From 19d0496e306626de4da45b278c56d00a622af8e6 Mon Sep 17 00:00:00 2001 From: Atul R Date: Sun, 29 Sep 2019 21:23:19 +0200 Subject: [PATCH] Deploy website version based on 27e9591630412fdc1cc075c34705c86a82654440 --- 404.html | 6 +-- blog/index.html | 6 +-- blog/tags/hello/index.html | 6 +-- blog/tags/index.html | 6 +-- blog/tags/nodegui/index.html | 6 +-- blog/welcome/index.html | 6 +-- chunk-map.json | 22 ++++---- client-manifest.json | 52 +++++++++---------- ...-index-jsc-4-f-f99.505b05deaa8813d82ea6.js | 2 +- ...component-4-ef-195.1ebedb4f37e2304eb832.js | 2 +- ...--docs-mdxce-3-7d1.36f8da190939bb0f0b99.js | 2 +- docs/api/Component/index.html | 12 ++--- docs/api/EventWidget/index.html | 8 +-- docs/api/FlexLayout/index.html | 8 +-- docs/api/NodeLayout/index.html | 8 +-- docs/api/NodeWidget/index.html | 8 +-- docs/api/QAbstractScrollArea/index.html | 8 +-- docs/api/QAbstractSlider/index.html | 8 +-- docs/api/QApplication/index.html | 8 +-- docs/api/QCheckBox/index.html | 8 +-- docs/api/QClipboard/index.html | 8 +-- docs/api/QCursor/index.html | 8 +-- docs/api/QDial/index.html | 8 +-- docs/api/QGridLayout/index.html | 8 +-- docs/api/QIcon/index.html | 8 +-- docs/api/QLabel/index.html | 8 +-- docs/api/QLineEdit/index.html | 8 +-- docs/api/QMainWindow/index.html | 8 +-- docs/api/QPixmap/index.html | 8 +-- docs/api/QPlainTextEdit/index.html | 8 +-- docs/api/QProgressBar/index.html | 8 +-- docs/api/QPushButton/index.html | 8 +-- docs/api/QRadioButton/index.html | 8 +-- docs/api/QScrollArea/index.html | 8 +-- docs/api/QSpinBox/index.html | 8 +-- docs/api/QTabWidget/index.html | 8 +-- docs/api/QWidget/index.html | 8 +-- docs/api/QtEnums/index.html | 8 +-- docs/api/YogaWidget/index.html | 8 +-- docs/api/process/index.html | 8 +-- docs/api/synopsis/index.html | 8 +-- docs/development/README/index.html | 8 +-- docs/development/common_errors/index.html | 8 +-- docs/development/debugging/index.html | 8 +-- docs/development/getting-started/index.html | 8 +-- docs/development/setting-up/index.html | 8 +-- .../signal_and_event_handling/index.html | 8 +-- docs/development/styling/index.html | 8 +-- docs/development/wrapping_widgets/index.html | 8 +-- docs/doc1/index.html | 8 +-- docs/faq/index.html | 8 +-- .../custom-nodegui-native-plugin/index.html | 8 +-- docs/guides/debugging-in-vscode/index.html | 8 +-- docs/guides/debugging/index.html | 8 +-- docs/guides/getting-started/index.html | 8 +-- docs/guides/handle-events/index.html | 8 +-- docs/guides/images/index.html | 8 +-- docs/guides/layout/index.html | 8 +-- docs/guides/networking/index.html | 8 +-- docs/guides/nodegui-architecture/index.html | 8 +-- docs/guides/scroll-view/index.html | 8 +-- docs/guides/styling/index.html | 8 +-- docs/guides/tutorial/index.html | 8 +-- .../using-native-node-modules/index.html | 8 +-- docs/mdx/index.html | 12 ++--- ...ata---docs-150-2d6.6e875209659be13f2970.js | 2 +- index.html | 10 ++-- ...0eadbce.js => main.3c22308242e28ead5e64.js | 2 +- ...omponent-3-e-5-43d.0893689f20edabdccdd1.js | 2 +- ...--docs-mdx-786-f56.6c0450d5f4f4bf4b0f24.js | 2 +- ...js => runtime~main.7a412b5ea073938bd334.js | 2 +- sitemap.xml | 2 +- 72 files changed, 289 insertions(+), 289 deletions(-) rename component---site-src-pages-index-jsc-4-f-f99.c77efb7a13d4c996d6c7.js => component---site-src-pages-index-jsc-4-f-f99.505b05deaa8813d82ea6.js (57%) rename content---docs-api-component-4-ef-195.be17a07689811b2e54a5.js => content---docs-api-component-4-ef-195.1ebedb4f37e2304eb832.js (97%) rename content---docs-mdxce-3-7d1.389cb0d1e93efb516d5d.js => content---docs-mdxce-3-7d1.36f8da190939bb0f0b99.js (97%) rename docsMetadata---docs-150-2d6.a4a03dc8ae50b1fa60b5.js => docsMetadata---docs-150-2d6.6e875209659be13f2970.js (96%) rename main.00ae184f6d3bd0eadbce.js => main.3c22308242e28ead5e64.js (99%) rename metadata---docs-api-component-3-e-5-43d.b1af807c32f3d1d45a4f.js => metadata---docs-api-component-3-e-5-43d.0893689f20edabdccdd1.js (75%) rename metadata---docs-mdx-786-f56.e64a4ecfb244bb1efd9f.js => metadata---docs-mdx-786-f56.6c0450d5f4f4bf4b0f24.js (61%) rename runtime~main.b0186ad8ee6d73168ac3.js => runtime~main.7a412b5ea073938bd334.js (98%) diff --git a/404.html b/404.html index 096181f50..16d1a690d 100644 --- a/404.html +++ b/404.html @@ -3,7 +3,7 @@ - + Page Not Found @@ -20,9 +20,9 @@

Page Not Found

We could not find what you were looking for.

Please contact the owner of the site that linked you to the original URL and let them know their link is broken.

- + - + \ No newline at end of file diff --git a/blog/index.html b/blog/index.html index 5b7c7eb0a..9766b83f3 100644 --- a/blog/index.html +++ b/blog/index.html @@ -3,7 +3,7 @@ - + Blog @@ -24,9 +24,9 @@

Welcome

May 30, 2019
Atul R

Atul R

Maintainer @NodeGui

This is the new blog site for NodeGui. This will be updated soon.

Tags:nodeguihello
Read More
- + - + diff --git a/blog/tags/hello/index.html b/blog/tags/hello/index.html index e7e2bc915..7a7e1c6ee 100644 --- a/blog/tags/hello/index.html +++ b/blog/tags/hello/index.html @@ -3,7 +3,7 @@ - + Blog | Tagged "hello" @@ -24,9 +24,9 @@

1 post(s) tagged with "hello"

View All Tags

Welcome

May 30, 2019
Atul R

Atul R

Maintainer @NodeGui

This is the new blog site for NodeGui. This will be updated soon.

Tags:nodeguihello
Read More
- + - + diff --git a/blog/tags/index.html b/blog/tags/index.html index 28c05bc13..4a7fa5a11 100644 --- a/blog/tags/index.html +++ b/blog/tags/index.html @@ -3,7 +3,7 @@ - + Blog Tags @@ -22,9 +22,9 @@

Tags

- + - + diff --git a/blog/tags/nodegui/index.html b/blog/tags/nodegui/index.html index dec3ec51e..a33864453 100644 --- a/blog/tags/nodegui/index.html +++ b/blog/tags/nodegui/index.html @@ -3,7 +3,7 @@ - + Blog | Tagged "nodegui" @@ -24,9 +24,9 @@

1 post(s) tagged with "nodegui"

View All Tags

Welcome

May 30, 2019
Atul R

Atul R

Maintainer @NodeGui

This is the new blog site for NodeGui. This will be updated soon.

Tags:nodeguihello
Read More
- + - + diff --git a/blog/welcome/index.html b/blog/welcome/index.html index 81c258cba..630c41731 100644 --- a/blog/welcome/index.html +++ b/blog/welcome/index.html @@ -3,7 +3,7 @@ - + Welcome @@ -24,9 +24,9 @@

Welcome

May 30, 2019
Atul R

Atul R

Maintainer @NodeGui

This is the new blog site for NodeGui. This will be updated soon.

Tags:nodeguihello
- + - + diff --git a/chunk-map.json b/chunk-map.json index 98b5e2c3a..123bac4a0 100644 --- a/chunk-map.json +++ b/chunk-map.json @@ -1,11 +1,11 @@ { "main": [ "/main.f66713773e9ba37b90fe.css", - "/main.00ae184f6d3bd0eadbce.js" + "/main.3c22308242e28ead5e64.js" ], "component---site-src-pages-index-jsc-4-f-f99": [ "/component---site-src-pages-index-jsc-4-f-f99.71bf8f44fd9ac59b6a50.css", - "/component---site-src-pages-index-jsc-4-f-f99.c77efb7a13d4c996d6c7.js" + "/component---site-src-pages-index-jsc-4-f-f99.505b05deaa8813d82ea6.js" ], "component---theme-blog-post-pageccc-cab": [ "/component---theme-blog-post-pageccc-cab.eaf730b8c654a212f785.js" @@ -30,7 +30,7 @@ "/component---theme-doc-legacy-page-9-e-7-ca5.d31182005d6c21dd63ac.js" ], "docsMetadata---docs-150-2d6": [ - "/docsMetadata---docs-150-2d6.a4a03dc8ae50b1fa60b5.js" + "/docsMetadata---docs-150-2d6.6e875209659be13f2970.js" ], "component---theme-doc-legacy-item-031-769": [ "/component---theme-doc-legacy-item-031-769.1f1ce10374de019f5d3a.css", @@ -48,17 +48,17 @@ "metadata---docs-faq-59-d-2b9": [ "/metadata---docs-faq-59-d-2b9.985713e75ca070fdde14.js" ], - "content---docs-api-component-4-ef-195": [ - "/content---docs-api-component-4-ef-195.be17a07689811b2e54a5.js" - ], - "metadata---docs-api-component-3-e-5-43d": [ - "/metadata---docs-api-component-3-e-5-43d.b1af807c32f3d1d45a4f.js" - ], "content---docs-mdxce-3-7d1": [ - "/content---docs-mdxce-3-7d1.389cb0d1e93efb516d5d.js" + "/content---docs-mdxce-3-7d1.36f8da190939bb0f0b99.js" ], "metadata---docs-mdx-786-f56": [ - "/metadata---docs-mdx-786-f56.e64a4ecfb244bb1efd9f.js" + "/metadata---docs-mdx-786-f56.6c0450d5f4f4bf4b0f24.js" + ], + "content---docs-api-component-4-ef-195": [ + "/content---docs-api-component-4-ef-195.1ebedb4f37e2304eb832.js" + ], + "metadata---docs-api-component-3-e-5-43d": [ + "/metadata---docs-api-component-3-e-5-43d.0893689f20edabdccdd1.js" ], "content---docs-api-event-widgetac-6-11b": [ "/content---docs-api-event-widgetac-6-11b.b87fa94e0cd874003d59.js" diff --git a/client-manifest.json b/client-manifest.json index 25baa13b5..a5976c31b 100644 --- a/client-manifest.json +++ b/client-manifest.json @@ -492,15 +492,15 @@ "css": [ { "file": "component---site-src-pages-index-jsc-4-f-f99.71bf8f44fd9ac59b6a50.css", - "hash": "96cbb5bfb07529143cee", + "hash": "39e78b432cd430aaf15d", "publicPath": "/component---site-src-pages-index-jsc-4-f-f99.71bf8f44fd9ac59b6a50.css" } ], "js": [ { - "file": "component---site-src-pages-index-jsc-4-f-f99.c77efb7a13d4c996d6c7.js", - "hash": "96cbb5bfb07529143cee", - "publicPath": "/component---site-src-pages-index-jsc-4-f-f99.c77efb7a13d4c996d6c7.js" + "file": "component---site-src-pages-index-jsc-4-f-f99.505b05deaa8813d82ea6.js", + "hash": "39e78b432cd430aaf15d", + "publicPath": "/component---site-src-pages-index-jsc-4-f-f99.505b05deaa8813d82ea6.js" } ] }, @@ -593,9 +593,9 @@ "12": { "js": [ { - "file": "content---docs-api-component-4-ef-195.be17a07689811b2e54a5.js", - "hash": "d8563747360e64aafd60", - "publicPath": "/content---docs-api-component-4-ef-195.be17a07689811b2e54a5.js" + "file": "content---docs-api-component-4-ef-195.1ebedb4f37e2304eb832.js", + "hash": "c23f4d43e9769fe6d05d", + "publicPath": "/content---docs-api-component-4-ef-195.1ebedb4f37e2304eb832.js" } ] }, @@ -1070,18 +1070,18 @@ "65": { "js": [ { - "file": "content---docs-mdxce-3-7d1.389cb0d1e93efb516d5d.js", - "hash": "ddcb7c039f51b90e6222", - "publicPath": "/content---docs-mdxce-3-7d1.389cb0d1e93efb516d5d.js" + "file": "content---docs-mdxce-3-7d1.36f8da190939bb0f0b99.js", + "hash": "ba8b42c4d14eb9f909eb", + "publicPath": "/content---docs-mdxce-3-7d1.36f8da190939bb0f0b99.js" } ] }, "66": { "js": [ { - "file": "docsMetadata---docs-150-2d6.a4a03dc8ae50b1fa60b5.js", - "hash": "4f8205e4b279b185f006", - "publicPath": "/docsMetadata---docs-150-2d6.a4a03dc8ae50b1fa60b5.js" + "file": "docsMetadata---docs-150-2d6.6e875209659be13f2970.js", + "hash": "3781f12a24d9a8186ab1", + "publicPath": "/docsMetadata---docs-150-2d6.6e875209659be13f2970.js" } ] }, @@ -1089,15 +1089,15 @@ "css": [ { "file": "main.f66713773e9ba37b90fe.css", - "hash": "964aa60e36531c0a82ad", + "hash": "2b829415ddc170fe1ef7", "publicPath": "/main.f66713773e9ba37b90fe.css" } ], "js": [ { - "file": "main.00ae184f6d3bd0eadbce.js", - "hash": "964aa60e36531c0a82ad", - "publicPath": "/main.00ae184f6d3bd0eadbce.js" + "file": "main.3c22308242e28ead5e64.js", + "hash": "2b829415ddc170fe1ef7", + "publicPath": "/main.3c22308242e28ead5e64.js" } ] }, @@ -1140,9 +1140,9 @@ "72": { "js": [ { - "file": "metadata---docs-api-component-3-e-5-43d.b1af807c32f3d1d45a4f.js", - "hash": "c0d8651c0c28b00718a1", - "publicPath": "/metadata---docs-api-component-3-e-5-43d.b1af807c32f3d1d45a4f.js" + "file": "metadata---docs-api-component-3-e-5-43d.0893689f20edabdccdd1.js", + "hash": "4bcf35bbd6d9c43be690", + "publicPath": "/metadata---docs-api-component-3-e-5-43d.0893689f20edabdccdd1.js" } ] }, @@ -1617,18 +1617,18 @@ "125": { "js": [ { - "file": "metadata---docs-mdx-786-f56.e64a4ecfb244bb1efd9f.js", - "hash": "e090cad8a4ac6ab6e445", - "publicPath": "/metadata---docs-mdx-786-f56.e64a4ecfb244bb1efd9f.js" + "file": "metadata---docs-mdx-786-f56.6c0450d5f4f4bf4b0f24.js", + "hash": "1c6257ade093684b9867", + "publicPath": "/metadata---docs-mdx-786-f56.6c0450d5f4f4bf4b0f24.js" } ] }, "126": { "js": [ { - "file": "runtime~main.b0186ad8ee6d73168ac3.js", - "hash": "d7e71319fb9d98d02611", - "publicPath": "/runtime~main.b0186ad8ee6d73168ac3.js" + "file": "runtime~main.7a412b5ea073938bd334.js", + "hash": "cc157fefaa2563ab1a7a", + "publicPath": "/runtime~main.7a412b5ea073938bd334.js" } ] }, diff --git a/component---site-src-pages-index-jsc-4-f-f99.c77efb7a13d4c996d6c7.js b/component---site-src-pages-index-jsc-4-f-f99.505b05deaa8813d82ea6.js similarity index 57% rename from component---site-src-pages-index-jsc-4-f-f99.c77efb7a13d4c996d6c7.js rename to component---site-src-pages-index-jsc-4-f-f99.505b05deaa8813d82ea6.js index a0786a4b9..914d0bbd5 100644 --- a/component---site-src-pages-index-jsc-4-f-f99.c77efb7a13d4c996d6c7.js +++ b/component---site-src-pages-index-jsc-4-f-f99.505b05deaa8813d82ea6.js @@ -1 +1 @@ -(window.webpackJsonp=window.webpackJsonp||[]).push([[3],{156:function(e,n,t){"use strict";t.r(n);var a=t(0),r=t.n(a),i=t(163),l=t.n(i),c=t(164),o=t(167);function u(){var e=E(["\n font-weight: 600;\n"]);return u=function(){return e},e}function m(){var e=E([""]);return m=function(){return e},e}function s(){var e=E([""]);return s=function(){return e},e}function f(){var e=E(["\n font-size: 20px;\n"]);return f=function(){return e},e}function d(){var e=E([""]);return d=function(){return e},e}function p(){var e=E(["\n flex-direction: column;\n display: flex;\n align-items: center;\n"]);return p=function(){return e},e}function g(){var e=E(["\n margin-left: auto;\n margin-right: auto;\n max-width: 1140px;\n max-width: var(--ifm-container-width);\n padding-left: 1rem;\n padding-left: var(--ifm-spacing-horizontal);\n padding-right: 1rem;\n padding-right: var(--ifm-spacing-horizontal);\n width: 100%;\n"]);return g=function(){return e},e}function v(){var e=E(["\n display: flex;\n align-items: center;\n padding: 2rem 0 0 0;\n width: 100%;\n margin: 0 auto;\n"]);return v=function(){return e},e}function h(){var e=E([""]);return h=function(){return e},e}function E(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}var b=o.a.header(h()),w=o.a.section(v()),x=o.a.div(g()),y=o.a.div(p()),O=(o.a.ol(d()),o.a.li(f()),o.a.h1(s())),k=o.a.h2(m());o.a.h4(u());function N(){var e=C(["\n width: 600px;\n max-width: 100%;\n"]);return N=function(){return e},e}function z(){var e=C(["\n font-weight: 400;\n"]);return z=function(){return e},e}function j(){var e=C(['\n background: black;\n display: flex;\n flex-direction: column;\n border: 1px solid gray;\n border-bottom: none;\n border-top-left-radius: 10px;\n border-top-right-radius: 10px;\n padding: 50px 30px 30px 30px;\n width: 600px;\n max-width: 100%;\n position: relative;\n margin-bottom: 20px;\n &::before {\n content: "○ ○ ○";\n color: gray;\n font-size: 14px;\n position: absolute;\n left: 15px;\n top: 5px;\n }\n']);return j=function(){return e},e}function S(){var e=C(['\n color: white !important;\n font-size: 14px;\n position: relative;\n &::before {\n content: "$";\n position: absolute;\n left: -13px;\n color: gray;\n }\n']);return S=function(){return e},e}function C(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}var _=o.a.code(S()),T=o.a.div(j()),P=o.a.h4(z()),W=o.a.div(N()),F=function(){return r.a.createElement(w,{id:"quick-start"},r.a.createElement(x,null,r.a.createElement(y,null,r.a.createElement(k,null,"Give it a try"),r.a.createElement(W,null,r.a.createElement(P,null,"1. Run these commands"),r.a.createElement(T,null,r.a.createElement(_,null,"git clone https://github.com/nodegui/nodegui-starter"),r.a.createElement(_,null,"cd nodegui-starter"),r.a.createElement(_,null,"npm install"),r.a.createElement(_,null,"npm start")),r.a.createElement(P,null,"2."," ",r.a.createElement("a",{className:"LinkBasics",href:"docs/guides/getting-started"},"Learn the basics")," ","or dive deeper and take a"," ",r.a.createElement("a",{className:"LinkBasics",href:"docs/api/QApplication"},"look at the APIs."))))))},J=t(171),G=t.n(J),I=t(166),L=t.n(I);function U(){var e=M(["\n padding-bottom: 40px;\n"]);return U=function(){return e},e}function B(){var e=M(["\n max-width: 170px;\n"]);return B=function(){return e},e}function q(){var e=M(["\n font-size: 1.6em;\n text-align: center;\n"]);return q=function(){return e},e}function Q(){var e=M(["\n font-size: 3em;\n font-weight: 600;\n"]);return Q=function(){return e},e}function A(){var e=M(["\n ","\n padding: 0.7rem 1.1rem;\n font-size: 1.2em;\n"]);return A=function(){return e},e}function M(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}var R=o.a.a(A(),(function(e){switch(e.type){case"primary":return"\n color: white; \n background: var(--ifm-color-primary);\n &:hover {\n color: white;\n text-decoration: none;\n background: var(--ifm-color-primary-dark);\n }\n ";case"secondary":return'\n &::after {\n content: "›";\n font-size: 24px;\n margin-left: 5px;\n text-align: center;\n }\n '}})),H=Object(o.a)(O)(Q()),V=o.a.p(q()),X=o.a.img(B()),$=Object(o.a)(b)(U());function D(){return r.a.createElement("div",null,r.a.createElement(R,{type:"primary",href:"#quick-start",target:"_self"},"Quick start"),r.a.createElement(R,{type:"secondary",href:L()("docs/guides/getting-started"),target:"_self"},"Learn basics"))}var K=function(){var e=l()().siteConfig,n=void 0===e?{}:e;return r.a.createElement($,null,r.a.createElement(x,null,r.a.createElement(y,null,r.a.createElement(X,{src:"img/logox200.png"}),r.a.createElement(H,null,n.title),r.a.createElement(V,null,n.tagline),r.a.createElement("div",{className:G.a.buttons},r.a.createElement(D,null)))))},Y=t(165),Z=t.n(Y),ee=[{title:r.a.createElement(r.a.Fragment,null,"Web Technologies"),imageUrl:"img/undraw_website_setup.svg",description:r.a.createElement(r.a.Fragment,null,"With NodeGui, you can build your app with familiar web technologies like CSS and JavaScript. There is even a"," ",r.a.createElement("a",{href:"https://react.nodegui.org"},"React based version"),".")},{title:r.a.createElement(r.a.Fragment,null,"Open Source"),imageUrl:"img/undraw_code_review.svg",description:r.a.createElement(r.a.Fragment,null,"NodeGui is an open source project maintained by an active community of contributors.")},{title:r.a.createElement(r.a.Fragment,null," Cross Platform"),imageUrl:"img/undraw_windows.svg",description:r.a.createElement(r.a.Fragment,null,"Compatible with Mac, Windows, and Linux, Electron apps build and run on three platforms.")}],ne=function(){return r.a.createElement("section",{className:G.a.features},r.a.createElement("div",{className:"container"},r.a.createElement("div",{className:"row"},ee.map((function(e,n){var t=e.imageUrl,a=e.title,i=e.description;return r.a.createElement("div",{key:n,className:Z()("col col--4",G.a.feature)},t&&r.a.createElement("div",{className:"text--center"},r.a.createElement("img",{className:G.a.featureImage,src:L()(t),alt:a})),r.a.createElement("h3",{className:"text--center"},a),r.a.createElement("p",{className:"text--center"},i))})))))},te=(t(188),function(e){return r.a.createElement(w,null,r.a.createElement("div",{className:"SplitView"},r.a.createElement("div",{className:"column first left ".concat(e.columnOneClass)},e.columnOne),r.a.createElement("div",{className:"column last right ".concat(e.columnTwoClass)},e.columnTwo)))});function ae(){var e=function(e,n){n||(n=e.slice(0));return Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}(["\n max-height: 300px;\n padding-bottom: 40px;\n"]);return ae=function(){return e},e}var re=o.a.img(ae()),ie=function(){return r.a.createElement(te,{columnTwoClass:"text",columnOne:r.a.createElement((function(){return r.a.createElement(re,{src:"img/demo.png"})}),null),columnTwo:r.a.createElement((function(){return r.a.createElement("div",null,r.a.createElement("h3",null,"Create native apps for Windows, MacOs and Linux using JavaScript and CSS"),r.a.createElement("p",null,"lets you create truly native apps and doesn't compromise on your users' experience. It provides a core set of platform agnostic native widgets that map directly to the platform’s native UI building blocks."),r.a.createElement("p",null,"NodeGui widgets are built on top of"," ",r.a.createElement("a",{href:"https://www.qt.io/",target:"_blank"},"Qt")," ","which is a mature dekstop apps framework. NodeGui widgets are extremely customizable just like in the web but does"," ",r.a.createElement("strong",null,"NOT")," use a Web browser under the hood."))}),null)})};function le(){var e=function(e,n){n||(n=e.slice(0));return Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}(["\n max-height: 300px;\n padding-bottom: 40px;\n"]);return le=function(){return e},e}var ce=o.a.img(le()),oe=function(){return r.a.createElement(te,{columnOneClass:"text",columnOne:r.a.createElement((function(){return r.a.createElement("div",null,r.a.createElement("h3",null,"Written in JavaScript—rendered with native code by Qt"),r.a.createElement("p",null,"Apps can be built completely in JavaScript. This enables native app development for whole new teams of developers, and can let existing native teams work much faster."),r.a.createElement("p",null,"With NodeGui you get flexibility of web and perfromance of Native desktop apps."))}),null),columnTwo:r.a.createElement((function(){return r.a.createElement("div",null,r.a.createElement(ce,{src:"img/code-sample.png"}))}),null)})};n.default=function(){var e=l()().siteConfig,n=void 0===e?{}:e;return r.a.createElement(c.a,{title:"Hello from ".concat(n.title),description:"Build performant, native and cross-platform desktop applications with JavaScript and CSS 🚀"},r.a.createElement(K,null),r.a.createElement("main",null,r.a.createElement(ne,null),r.a.createElement(ie,null),r.a.createElement(oe,null),r.a.createElement(F,null)))}},171:function(e,n,t){e.exports={heroBanner:"heroBanner_2Ftp",buttons:"buttons_1Wc3",features:"features_P2SU",featureImage:"featureImage_3Xqx"}},188:function(e,n,t){}}]); \ No newline at end of file +(window.webpackJsonp=window.webpackJsonp||[]).push([[3],{156:function(e,n,t){"use strict";t.r(n);var a=t(0),r=t.n(a),i=t(163),l=t.n(i),c=t(164),o=t(167);function u(){var e=E(["\n font-weight: 600;\n"]);return u=function(){return e},e}function m(){var e=E([""]);return m=function(){return e},e}function s(){var e=E([""]);return s=function(){return e},e}function d(){var e=E(["\n font-size: 20px;\n"]);return d=function(){return e},e}function f(){var e=E([""]);return f=function(){return e},e}function p(){var e=E(["\n flex-direction: column;\n display: flex;\n align-items: center;\n"]);return p=function(){return e},e}function g(){var e=E(["\n margin-left: auto;\n margin-right: auto;\n max-width: 1140px;\n max-width: var(--ifm-container-width);\n padding-left: 1rem;\n padding-left: var(--ifm-spacing-horizontal);\n padding-right: 1rem;\n padding-right: var(--ifm-spacing-horizontal);\n width: 100%;\n"]);return g=function(){return e},e}function v(){var e=E(["\n display: flex;\n align-items: center;\n padding: 2rem 0 0 0;\n width: 100%;\n margin: 0 auto;\n"]);return v=function(){return e},e}function h(){var e=E([""]);return h=function(){return e},e}function E(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}var b=o.a.header(h()),w=o.a.section(v()),x=o.a.div(g()),y=o.a.div(p()),O=(o.a.ol(f()),o.a.li(d()),o.a.h1(s())),k=o.a.h2(m());o.a.h4(u());function N(){var e=C(["\n width: 600px;\n max-width: 100%;\n"]);return N=function(){return e},e}function z(){var e=C(["\n font-weight: 400;\n"]);return z=function(){return e},e}function j(){var e=C(['\n background: black;\n display: flex;\n flex-direction: column;\n border: 1px solid gray;\n border-bottom: none;\n border-top-left-radius: 10px;\n border-top-right-radius: 10px;\n padding: 50px 30px 30px 30px;\n width: 600px;\n max-width: 100%;\n position: relative;\n margin-bottom: 20px;\n &::before {\n content: "○ ○ ○";\n color: gray;\n font-size: 14px;\n position: absolute;\n left: 15px;\n top: 5px;\n }\n']);return j=function(){return e},e}function S(){var e=C(['\n color: white !important;\n font-size: 14px;\n position: relative;\n &::before {\n content: "$";\n position: absolute;\n left: -13px;\n color: gray;\n }\n']);return S=function(){return e},e}function C(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}var _=o.a.code(S()),T=o.a.div(j()),P=o.a.h4(z()),W=o.a.div(N()),F=function(){return r.a.createElement(w,{id:"quick-start"},r.a.createElement(x,null,r.a.createElement(y,null,r.a.createElement(k,null,"Give it a try"),r.a.createElement(W,null,r.a.createElement(P,null,"1. Run these commands"),r.a.createElement(T,null,r.a.createElement(_,null,"git clone https://github.com/nodegui/nodegui-starter"),r.a.createElement(_,null,"cd nodegui-starter"),r.a.createElement(_,null,"npm install"),r.a.createElement(_,null,"npm start")),r.a.createElement(P,null,"2."," ",r.a.createElement("a",{className:"LinkBasics",href:"docs/guides/getting-started"},"Learn the basics")," ","or dive deeper and take a"," ",r.a.createElement("a",{className:"LinkBasics",href:"docs/api/QApplication"},"look at the APIs."))))))},G=t(171),J=t.n(G),I=t(166),L=t.n(I);function U(){var e=M(["\n padding-bottom: 40px;\n"]);return U=function(){return e},e}function B(){var e=M(["\n max-width: 170px;\n"]);return B=function(){return e},e}function q(){var e=M(["\n font-size: 1.6em;\n text-align: center;\n"]);return q=function(){return e},e}function Q(){var e=M(["\n font-size: 3em;\n font-weight: 600;\n"]);return Q=function(){return e},e}function A(){var e=M(["\n ","\n padding: 0.7rem 1.1rem;\n font-size: 1.2em;\n"]);return A=function(){return e},e}function M(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}var R=o.a.a(A(),(function(e){switch(e.type){case"primary":return"\n color: white; \n background: var(--ifm-color-primary);\n &:hover {\n color: white;\n text-decoration: none;\n background: var(--ifm-color-primary-dark);\n }\n ";case"secondary":return'\n &::after {\n content: "›";\n font-size: 24px;\n margin-left: 5px;\n text-align: center;\n }\n '}})),H=Object(o.a)(O)(Q()),V=o.a.p(q()),X=o.a.img(B()),$=Object(o.a)(b)(U());function D(){return r.a.createElement("div",null,r.a.createElement(R,{type:"primary",href:"#quick-start",target:"_self"},"Quick start"),r.a.createElement(R,{type:"secondary",href:L()("docs/guides/getting-started"),target:"_self"},"Learn basics"))}var K=function(){var e=l()().siteConfig,n=void 0===e?{}:e;return r.a.createElement($,null,r.a.createElement(x,null,r.a.createElement(y,null,r.a.createElement(X,{src:"img/logox200.png"}),r.a.createElement(H,null,n.title),r.a.createElement(V,null,n.tagline),r.a.createElement("div",{className:J.a.buttons},r.a.createElement(D,null)))))},Y=t(165),Z=t.n(Y),ee=[{title:r.a.createElement(r.a.Fragment,null,"Web Technologies"),imageUrl:"img/undraw_website_setup.svg",description:r.a.createElement(r.a.Fragment,null,"With NodeGui, you can build your app with familiar web technologies like CSS and JavaScript. There is even a"," ",r.a.createElement("a",{href:"https://react.nodegui.org"},"React based version"),".")},{title:r.a.createElement(r.a.Fragment,null,"Open Source"),imageUrl:"img/undraw_code_review.svg",description:r.a.createElement(r.a.Fragment,null,"NodeGui is an open source project maintained by an active community of contributors.")},{title:r.a.createElement(r.a.Fragment,null," Cross Platform"),imageUrl:"img/undraw_windows.svg",description:r.a.createElement(r.a.Fragment,null,"Compatible with Mac, Windows, and Linux, NodeGui apps build and run on three platforms.")}],ne=function(){return r.a.createElement("section",{className:J.a.features},r.a.createElement("div",{className:"container"},r.a.createElement("div",{className:"row"},ee.map((function(e,n){var t=e.imageUrl,a=e.title,i=e.description;return r.a.createElement("div",{key:n,className:Z()("col col--4",J.a.feature)},t&&r.a.createElement("div",{className:"text--center"},r.a.createElement("img",{className:J.a.featureImage,src:L()(t),alt:a})),r.a.createElement("h3",{className:"text--center"},a),r.a.createElement("p",{className:"text--center"},i))})))))},te=(t(188),function(e){return r.a.createElement(w,null,r.a.createElement("div",{className:"SplitView"},r.a.createElement("div",{className:"column first left ".concat(e.columnOneClass)},e.columnOne),r.a.createElement("div",{className:"column last right ".concat(e.columnTwoClass)},e.columnTwo)))});function ae(){var e=function(e,n){n||(n=e.slice(0));return Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}(["\n max-height: 300px;\n padding-bottom: 40px;\n"]);return ae=function(){return e},e}var re=o.a.img(ae()),ie=function(){return r.a.createElement(te,{columnTwoClass:"text",columnOne:r.a.createElement((function(){return r.a.createElement(re,{src:"img/demo.png"})}),null),columnTwo:r.a.createElement((function(){return r.a.createElement("div",null,r.a.createElement("h3",null,"Create native apps for Windows, MacOs and Linux using JavaScript and CSS"),r.a.createElement("p",null,"lets you create truly native apps and doesn't compromise on your users' experience. It provides a core set of platform agnostic native widgets that map directly to the platform’s native UI building blocks."),r.a.createElement("p",null,"NodeGui widgets are built on top of"," ",r.a.createElement("a",{href:"https://www.qt.io/",target:"_blank"},"Qt")," ","which is a mature dekstop apps framework. NodeGui widgets are extremely customizable just like in the web but does"," ",r.a.createElement("strong",null,"NOT")," use a Web browser under the hood."))}),null)})};function le(){var e=function(e,n){n||(n=e.slice(0));return Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}(["\n max-height: 300px;\n padding-bottom: 40px;\n"]);return le=function(){return e},e}var ce=o.a.img(le()),oe=function(){return r.a.createElement(te,{columnOneClass:"text",columnOne:r.a.createElement((function(){return r.a.createElement("div",null,r.a.createElement("h3",null,"Written in JavaScript—rendered with native code by Qt"),r.a.createElement("p",null,"Apps can be built completely in JavaScript. This enables native app development for whole new teams of developers, and can let existing native teams work much faster."),r.a.createElement("p",null,"With NodeGui you get flexibility of web and perfromance of Native desktop apps."))}),null),columnTwo:r.a.createElement((function(){return r.a.createElement("div",null,r.a.createElement(ce,{src:"img/code-sample.png"}))}),null)})};n.default=function(){var e=l()().siteConfig,n=void 0===e?{}:e;return r.a.createElement(c.a,{title:"Hello from ".concat(n.title),description:"Build performant, native and cross-platform desktop applications with JavaScript and CSS 🚀"},r.a.createElement(K,null),r.a.createElement("main",null,r.a.createElement(ne,null),r.a.createElement(ie,null),r.a.createElement(oe,null),r.a.createElement(F,null)))}},171:function(e,n,t){e.exports={heroBanner:"heroBanner_2Ftp",buttons:"buttons_1Wc3",features:"features_P2SU",featureImage:"featureImage_3Xqx"}},188:function(e,n,t){}}]); \ No newline at end of file diff --git a/content---docs-api-component-4-ef-195.be17a07689811b2e54a5.js b/content---docs-api-component-4-ef-195.1ebedb4f37e2304eb832.js similarity index 97% rename from content---docs-api-component-4-ef-195.be17a07689811b2e54a5.js rename to content---docs-api-component-4-ef-195.1ebedb4f37e2304eb832.js index fb7502f8f..eebba5b04 100644 --- a/content---docs-api-component-4-ef-195.be17a07689811b2e54a5.js +++ b/content---docs-api-component-4-ef-195.1ebedb4f37e2304eb832.js @@ -1 +1 @@ -(window.webpackJsonp=window.webpackJsonp||[]).push([[12],{161:function(e,t,n){"use strict";n.d(t,"a",(function(){return c})),n.d(t,"b",(function(){return u}));var r=n(0),o=n.n(r),a=o.a.createContext({}),i=function(e){var t=o.a.useContext(a),n=t;return e&&(n="function"==typeof e?e(t):Object.assign({},t,e)),n},c=function(e){var t=i(e.components);return o.a.createElement(a.Provider,{value:t},e.children)};var s="mdxType",l={inlineCode:"code",wrapper:function(e){var t=e.children;return o.a.createElement(o.a.Fragment,{},t)}},p=Object(r.forwardRef)((function(e,t){var n=e.components,r=e.mdxType,a=e.originalType,c=e.parentName,s=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&-1===t.indexOf(r)&&(n[r]=e[r]);return n}(e,["components","mdxType","originalType","parentName"]),p=i(n),u=r,d=p[c+"."+u]||p[u]||l[u]||a;return n?o.a.createElement(d,Object.assign({},{ref:t},s,{components:n})):o.a.createElement(d,Object.assign({},{ref:t},s))}));function u(e,t){var n=arguments,r=t&&t.mdxType;if("string"==typeof e||r){var a=n.length,i=new Array(a);i[0]=p;var c={};for(var l in t)hasOwnProperty.call(t,l)&&(c[l]=t[l]);c.originalType=e,c[s]="string"==typeof e?e:r,i[1]=c;for(var u=2;u=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var i={sidebar_label:"Component",title:"Component"},c=[{value:"Static Methods",id:"static-methods",children:[]},{value:"Instance Properties",id:"instance-properties",children:[]},{value:"Instance Methods",id:"instance-methods",children:[]}],s={rightToc:c},l="wrapper";function p(e){var t=e.components,n=a(e,["components"]);return Object(r.b)(l,o({},s,n,{components:t,mdxType:"MDXLayout"}),Object(r.b)("blockquote",null,Object(r.b)("p",{parentName:"blockquote"},"Abstract class that is root most base class for all widgets and layouts in the NodeGui World.")),Object(r.b)("p",null,Object(r.b)("strong",{parentName:"p"},"This class is used to add core properties to all widgets, layouts etc in NodeGui world. Currently it helps us maintain references to the native C++ instance of the widget or layout. It also helps in preventing gc of child elements of a layout or widget")),Object(r.b)("p",null,Object(r.b)("inlineCode",{parentName:"p"},"Component")," is an abstract class and hence no instances of the same should be created. It exists so that we can add core functionalities to all widgets and layouts easily. This is an internal class."),Object(r.b)("p",null,Object(r.b)("strong",{parentName:"p"},"Component is the base class for YogaWidget and NodeLayout which means all widgets and layouts inherit it aswell. Its the root base class in NodeGui world")),Object(r.b)("p",null,"To get a clearer picture you can take a look at the Component source code here: ",Object(r.b)("inlineCode",{parentName:"p"},"src/lib/core/Component/index.ts")),Object(r.b)("h2",{id:"static-methods"},"Static Methods"),Object(r.b)("p",null,"There are no public static methods for Component."),Object(r.b)("h2",{id:"instance-properties"},"Instance Properties"),Object(r.b)("p",null,"There are no public instance properties for Component."),Object(r.b)("h2",{id:"instance-methods"},"Instance Methods"),Object(r.b)("p",null,"There are no public instance methods for Component."))}p.isMDXComponent=!0}}]); \ No newline at end of file +(window.webpackJsonp=window.webpackJsonp||[]).push([[12],{161:function(e,t,n){"use strict";n.d(t,"a",(function(){return c})),n.d(t,"b",(function(){return u}));var r=n(0),o=n.n(r),a=o.a.createContext({}),i=function(e){var t=o.a.useContext(a),n=t;return e&&(n="function"==typeof e?e(t):Object.assign({},t,e)),n},c=function(e){var t=i(e.components);return o.a.createElement(a.Provider,{value:t},e.children)};var s="mdxType",l={inlineCode:"code",wrapper:function(e){var t=e.children;return o.a.createElement(o.a.Fragment,{},t)}},p=Object(r.forwardRef)((function(e,t){var n=e.components,r=e.mdxType,a=e.originalType,c=e.parentName,s=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&-1===t.indexOf(r)&&(n[r]=e[r]);return n}(e,["components","mdxType","originalType","parentName"]),p=i(n),u=r,d=p[c+"."+u]||p[u]||l[u]||a;return n?o.a.createElement(d,Object.assign({},{ref:t},s,{components:n})):o.a.createElement(d,Object.assign({},{ref:t},s))}));function u(e,t){var n=arguments,r=t&&t.mdxType;if("string"==typeof e||r){var a=n.length,i=new Array(a);i[0]=p;var c={};for(var l in t)hasOwnProperty.call(t,l)&&(c[l]=t[l]);c.originalType=e,c[s]="string"==typeof e?e:r,i[1]=c;for(var u=2;u=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var i={sidebar_label:"Component",title:"Component"},c=[{value:"Static Methods",id:"static-methods",children:[]},{value:"Instance Properties",id:"instance-properties",children:[]},{value:"Instance Methods",id:"instance-methods",children:[]}],s={rightToc:c},l="wrapper";function p(e){var t=e.components,n=a(e,["components"]);return Object(r.b)(l,o({},s,n,{components:t,mdxType:"MDXLayout"}),Object(r.b)("blockquote",null,Object(r.b)("p",{parentName:"blockquote"},"Abstract class that is root most base class for all widgets and layouts in the NodeGui World.")),Object(r.b)("p",null,Object(r.b)("strong",{parentName:"p"},"This class is used to add core properties to all widgets, layouts etc in NodeGui world. Currently it helps us maintain references to the native C++ instance of the widget or layout. It also helps in preventing gc of child elements of a layout or widget")),Object(r.b)("p",null,Object(r.b)("inlineCode",{parentName:"p"},"Component")," is an abstract class and hence no instances of the same should be created. It exists so that we can add core functionalities to all widgets and layouts easily. This is an internal class."),Object(r.b)("p",null,Object(r.b)("strong",{parentName:"p"},"Component is the base class for YogaWidget and NodeLayout which means all widgets and layouts inherit it aswell. Its the root base class in NodeGui world")),Object(r.b)("p",null,"To get a clearer picture you can take a look at the Component source code here: ",Object(r.b)("inlineCode",{parentName:"p"},"src/lib/core/Component/index.ts")),Object(r.b)("h2",{id:"static-methods"},"Static Methods"),Object(r.b)("p",null,"There are no public static methods for Component."),Object(r.b)("h2",{id:"instance-properties"},"Instance Properties"),Object(r.b)("p",null,"There are no public instance properties for Component."),Object(r.b)("h2",{id:"instance-methods"},"Instance Methods"),Object(r.b)("p",null,"There are no public instance methods for Component."))}p.isMDXComponent=!0}}]); \ No newline at end of file diff --git a/content---docs-mdxce-3-7d1.389cb0d1e93efb516d5d.js b/content---docs-mdxce-3-7d1.36f8da190939bb0f0b99.js similarity index 97% rename from content---docs-mdxce-3-7d1.389cb0d1e93efb516d5d.js rename to content---docs-mdxce-3-7d1.36f8da190939bb0f0b99.js index 95b28d48d..fa081ecfa 100644 --- a/content---docs-mdxce-3-7d1.389cb0d1e93efb516d5d.js +++ b/content---docs-mdxce-3-7d1.36f8da190939bb0f0b99.js @@ -1 +1 @@ -(window.webpackJsonp=window.webpackJsonp||[]).push([[65],{161:function(e,n,r){"use strict";r.d(n,"a",(function(){return i})),r.d(n,"b",(function(){return f}));var t=r(0),o=r.n(t),a=o.a.createContext({}),c=function(e){var n=o.a.useContext(a),r=n;return e&&(r="function"==typeof e?e(n):Object.assign({},n,e)),r},i=function(e){var n=c(e.components);return o.a.createElement(a.Provider,{value:n},e.children)};var p="mdxType",u={inlineCode:"code",wrapper:function(e){var n=e.children;return o.a.createElement(o.a.Fragment,{},n)}},l=Object(t.forwardRef)((function(e,n){var r=e.components,t=e.mdxType,a=e.originalType,i=e.parentName,p=function(e,n){var r={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&-1===n.indexOf(t)&&(r[t]=e[t]);return r}(e,["components","mdxType","originalType","parentName"]),l=c(r),f=t,s=l[i+"."+f]||l[f]||u[f]||a;return r?o.a.createElement(s,Object.assign({},{ref:n},p,{components:r})):o.a.createElement(s,Object.assign({},{ref:n},p))}));function f(e,n){var r=arguments,t=n&&n.mdxType;if("string"==typeof e||t){var a=r.length,c=new Array(a);c[0]=l;var i={};for(var u in n)hasOwnProperty.call(n,u)&&(i[u]=n[u]);i.originalType=e,i[p]="string"==typeof e?e:t,c[1]=i;for(var f=2;f=0||(o[r]=e[r]);return o}(e,n);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(t=0;t=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var c={id:"mdx",title:"Powered by MDX"},i=[],p=function(e){var n=e.children,r=e.color;return Object(t.b)("span",{style:{backgroundColor:r,borderRadius:"2px",color:"#fff",padding:"0.2rem"}},n)},u={rightToc:i,Highlight:p},l="wrapper";function f(e){var n=e.components,r=a(e,["components"]);return Object(t.b)(l,o({},u,r,{components:n,mdxType:"MDXLayout"}),Object(t.b)("p",null,"You can write JSX and use React components within your Markdown thanks to ",Object(t.b)("a",o({parentName:"p"},{href:"https://mdxjs.com/"}),"MDX"),"."),Object(t.b)(p,{color:"#25c2a0",mdxType:"Highlight"},"Docusaurus green")," and ",Object(t.b)(p,{color:"#1877F2",mdxType:"Highlight"},"Facebook blue")," are my favorite colors.",Object(t.b)("p",null,"I can write ",Object(t.b)("strong",{parentName:"p"},"Markdown")," alongside my ",Object(t.b)("em",{parentName:"p"},"JSX"),"!"))}f.isMDXComponent=!0}}]); \ No newline at end of file +(window.webpackJsonp=window.webpackJsonp||[]).push([[65],{161:function(e,n,r){"use strict";r.d(n,"a",(function(){return i})),r.d(n,"b",(function(){return f}));var t=r(0),o=r.n(t),a=o.a.createContext({}),c=function(e){var n=o.a.useContext(a),r=n;return e&&(r="function"==typeof e?e(n):Object.assign({},n,e)),r},i=function(e){var n=c(e.components);return o.a.createElement(a.Provider,{value:n},e.children)};var p="mdxType",u={inlineCode:"code",wrapper:function(e){var n=e.children;return o.a.createElement(o.a.Fragment,{},n)}},l=Object(t.forwardRef)((function(e,n){var r=e.components,t=e.mdxType,a=e.originalType,i=e.parentName,p=function(e,n){var r={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&-1===n.indexOf(t)&&(r[t]=e[t]);return r}(e,["components","mdxType","originalType","parentName"]),l=c(r),f=t,s=l[i+"."+f]||l[f]||u[f]||a;return r?o.a.createElement(s,Object.assign({},{ref:n},p,{components:r})):o.a.createElement(s,Object.assign({},{ref:n},p))}));function f(e,n){var r=arguments,t=n&&n.mdxType;if("string"==typeof e||t){var a=r.length,c=new Array(a);c[0]=l;var i={};for(var u in n)hasOwnProperty.call(n,u)&&(i[u]=n[u]);i.originalType=e,i[p]="string"==typeof e?e:t,c[1]=i;for(var f=2;f=0||(o[r]=e[r]);return o}(e,n);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(t=0;t=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var c={id:"mdx",title:"Powered by MDX"},i=[],p=function(e){var n=e.children,r=e.color;return Object(t.b)("span",{style:{backgroundColor:r,borderRadius:"2px",color:"#fff",padding:"0.2rem"}},n)},u={rightToc:i,Highlight:p},l="wrapper";function f(e){var n=e.components,r=a(e,["components"]);return Object(t.b)(l,o({},u,r,{components:n,mdxType:"MDXLayout"}),Object(t.b)("p",null,"You can write JSX and use React components within your Markdown thanks to ",Object(t.b)("a",o({parentName:"p"},{href:"https://mdxjs.com/"}),"MDX"),"."),Object(t.b)(p,{color:"#25c2a0",mdxType:"Highlight"},"Docusaurus green")," and ",Object(t.b)(p,{color:"#1877F2",mdxType:"Highlight"},"Facebook blue")," are my favorite colors.",Object(t.b)("p",null,"I can write ",Object(t.b)("strong",{parentName:"p"},"Markdown")," alongside my ",Object(t.b)("em",{parentName:"p"},"JSX"),"!"))}f.isMDXComponent=!0}}]); \ No newline at end of file diff --git a/docs/api/Component/index.html b/docs/api/Component/index.html index b8097bdb2..4a2d314b9 100644 --- a/docs/api/Component/index.html +++ b/docs/api/Component/index.html @@ -3,7 +3,7 @@ - + Component @@ -28,9 +28,9 @@

Component

Abstract class that is root most base class for all widgets and layouts in the NodeGui World.

This class is used to add core properties to all widgets, layouts etc in NodeGui world. Currently it helps us maintain references to the native C++ instance of the widget or layout. It also helps in preventing gc of child elements of a layout or widget

Component is an abstract class and hence no instances of the same should be created. It exists so that we can add core functionalities to all widgets and layouts easily. This is an internal class.

Component is the base class for YogaWidget and NodeLayout which means all widgets and layouts inherit it aswell. Its the root base class in NodeGui world

To get a clearer picture you can take a look at the Component source code here: src/lib/core/Component/index.ts

Static Methods

There are no public static methods for Component.

Instance Properties

There are no public instance properties for Component.

Instance Methods

There are no public instance methods for Component.

- + - + @@ -40,13 +40,13 @@ - + - + - + \ No newline at end of file diff --git a/docs/api/EventWidget/index.html b/docs/api/EventWidget/index.html index bb1ca9870..16f3768bb 100644 --- a/docs/api/EventWidget/index.html +++ b/docs/api/EventWidget/index.html @@ -3,7 +3,7 @@ - + EventWidget @@ -28,9 +28,9 @@

EventWidget

Abstract class that adds event handling support to all widgets.

This class implements an event emitter and merges it with Qt's event and signal system. It allows us to register and unregister event and signal listener at will from javascript

EventWidget is an abstract class and hence no instances of the same should be created. It exists so that we can add event handling functionalities to all widget's easily. This is an internal class.

EventWidget is the base class for NodeWidget which means all widgets inherit it aswell. It inherits from another abstract class YogaWidget

Example

const { QWidget, QWidgetEvents } = require("@nodegui/nodegui");
const view = new QWidget();
// addEventListener is a method from EventWidget
view.addEventListener("MouseMove", () => {
  console.log("mouse moved");
});
or;
// addEventListener is a method from EventWidget
view.addEventListener(QWidgetEvents.MouseMove, () => {
  console.log("mouse moved");
});

EventWidget will contain all methods and properties that are useful to handle events and signals of widgets in the NodeGui world.

Static Methods

EventWidget can access all the static methods defined in YogaWidget

Instance Properties

EventWidget can access all the instance properties defined in YogaWidget

Instance Methods

EventWidget can access all the instance methods defined in YogaWidget

Additionally it also has the following instance methods:

widget.addEventListener(eventType, callback)

Adds an event listener to the widget to listen to events that occur on a widget.

  • eventType string - The event or signal you wish to listen to for the widget. Every widget exports its own enum of all possible events and signal types it can take. For example: QWidget exports QWidgetEvents, QPushButton exports QPushButtonEvents.

  • callback (payload?: NativeEvent | any) => void - A callback function to invoke when an event occurs. Usually you receive a nativeEvent or a string as argument.

widget.removeEventListener(eventType, callback?)

Removes the specified event listener from the widget.

  • eventType string - The event or signal for which you wish to remove the listener.

  • callback Function (Optional) - If specified the removeEventListener will remove the specified listener only, otherwise all eventlisteners of the eventType on the widget will be removed.

- + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/FlexLayout/index.html b/docs/api/FlexLayout/index.html index d11bb49cf..08c250349 100644 --- a/docs/api/FlexLayout/index.html +++ b/docs/api/FlexLayout/index.html @@ -3,7 +3,7 @@ - + FlexLayout @@ -28,9 +28,9 @@

FlexLayout

Custom layout to help layout child widgets using flex layout.

This class is a JS wrapper around custom Qt layout implemented using Yoga

A FlexLayout can be used to layout all child NodeGui widgets using flex.

FlexLayout inherits from NodeLayout

Example

const { FlexLayout, QWidget, QLabel } = require("@nodegui/nodegui");
const view = new QWidget();
const layout = new FlexLayout();
view.setLayout(layout);
const label = new QLabel();
label.setText("label1");
const label2 = new QLabel();
label2.setText("label2");
layout.addWidget(label);
layout.addWidget(label2);

Static Methods

FlexLayout can access all the static methods defined in NodeLayout

Instance Properties

FlexLayout can access all the instance properties defined in NodeLayout

Instance Methods

FlexLayout can access all the instance methods defined in NodeLayout

Additionally it also has the following instance methods:

layout.addWidget(childWidget, childFlexNode?)

Adds the childWidget to the layout. It calls the native method of custom FlexLayout.

  • childWidget NodeWidget - child widget that needs to be added to the layout.
  • childFlexNode flexNode ref (Optional) - flexNode reference of the child widget. You can get this by calling childWidget.getFlexNode().

layout.insertChildBefore(childWidget, beforeChildWidget, childFlexNode?, beforeChildFlexNode?)

Adds the childWidget before another already set childWidget in the layout. It calls the native method of custom FlexLayout.

  • childWidget NodeWidget - child widget that needs to be added to the layout.
  • beforeChildWidget NodeWidget - the widget before which the childWidget needs to be added in the layout.
  • childFlexNode flexNode ref (Optional) - flexNode reference of the child widget. You can get this by calling childWidget.getFlexNode().
  • beforeChildFlexNode flexNode ref (Optional) - flexNode reference of the before child widget. You can get this by calling beforeChildWidget.getFlexNode().

layout.removeWidget(childWidget, childFlexNode?)

Removes the childWidget from the layout. It calls the native method of custom FlexLayout.

  • childWidget NodeWidget - child widget that needs to be added to the layout.
  • childFlexNode flexNode ref (Optional) - flexNode reference of the child widget. You can get this by calling childWidget.getFlexNode().

layout.setFlexNode(flexNode)

A layout doesnt have its own flexNode. This method sets the flex Node to use for calculating position of the child widgets. Hence this should be always equal to the flex node of widget for which this layout is set. This is called internally by widget.setLayout.

  • flexNode flexNode ref - flexNode reference of the widget for which this layout is set. You can get this by calling widget.getFlexNode().
- + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/NodeLayout/index.html b/docs/api/NodeLayout/index.html index a7c8b6a79..f3ea5bc91 100644 --- a/docs/api/NodeLayout/index.html +++ b/docs/api/NodeLayout/index.html @@ -3,7 +3,7 @@ - + NodeLayout @@ -28,9 +28,9 @@

NodeLayout

Abstract class to add functionalities common to all Layout.

This class implements all methods, properties of Qt's QLayout class so that it can be inherited by all layouts

NodeLayout is an abstract class and hence no instances of the same should be created. It exists so that we can add similar functionalities to all layout's easily. Additionally it helps in typechecking process.

NodeLayout is the base class for all layouts. It inherits from another abstract class Component

Example

const {
  NodeLayout,
  NodeWidget,
  FlexLayout,
  GridLayout,
  QPushButton,
  QWidget
} = require("@nodegui/nodegui");
// addChildToLayout can accept any layout since it expects NodeLayout
const addChildToLayout = (layout: NodeLayout, widget: NodeWidget) => {
  layout.addWidget(widget);
};
addChildToLayout(new FlexLayout(), new QPushButton());
addChildToLayout(new GridLayout(), new QWidget());

NodeLayout will list all methods and properties that are common to all layouts in the NodeGui world.

Static Methods

NodeLayout can access all the static methods defined in Component

Instance Properties

NodeLayout can access all the instance properties defined in Component

Additionally it also has the following instance properties:

layout.type

This will return the string layout for all layouts.

Instance Methods

NodeLayout can access all the instance methods defined in Component

Additionally it also has the following instance methods:

layout.addWidget(childWidget, ...args)

This is an abstract method in NodeLayout class. All Layouts inheriting from NodeLayout should implement this method.

  • childWidget NodeWidget - Any widget in the NodeGui world.
  • ...args any[] - Additional params as required by the layout.

layout.activate()

Redoes the layout for parent widget of this layout if necessary. Returns true if the layout was redone.

layout.invalidate()

Invalidates any cached information in this layout.

layout.update()

Updates the layout for parent widget of this layout. You should generally not need to call this because it is automatically called at the most appropriate times.

- + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/NodeWidget/index.html b/docs/api/NodeWidget/index.html index 39fbd3765..0bb4996dd 100644 --- a/docs/api/NodeWidget/index.html +++ b/docs/api/NodeWidget/index.html @@ -3,7 +3,7 @@ - + NodeWidget @@ -29,9 +29,9 @@ Returns true if the widget was closed; otherwise returns false.

widget.setLayout(layout)

Sets the layout manager for this widget to layout. It calls the native method QWidget: setLayout.

  • layout NodeLayout - Any layout that inherits from NodeLayout class.

widget.setStyleSheet(styleSheet)

Sets the property that holds the widget's style sheet. It calls the native method QWidget: styleSheet.

  • styleSheet string - String which holds the widget's style sheet. Make sure you create this string using StyleSheet.create()

widget.setCursor(cursor)

Sets the window mouse cursor. It calls the native method QWidget: setCursor.

widget.setWindowIcon(icon)

Sets the window icon. It calls the native method QWidget: setWindowIcon.

  • icon QIcon - Specifies icon for the window.

widget.setWindowState(state)

Sets the window state. It calls the native method QWidget: setWindowState.

widget.setWindowTitle(title)

Sets the window title property. It calls the native method QWidget: setWindowTitle.

  • title string - String which holds the windows title.

widget.styleSheet()

Gets the property that holds the widget's style sheet. It calls the native method QWidget: styleSheet.

widget.hide()

Hides the widget and its children. It calls the native method QWidget: hide.

widget.move(x, y)

Sets the screen position of the widget. It calls the native method QWidget: move.

  • x number - Pixels.
  • y number - Pixels.

widget.setObjectName(objectName)

Sets the object name of the widget in Qt. It calls the native method QObject: setObjectName. Object name can be analogous to id of an element in the web world. Using the objectName of the widget one can reference it in the Qt's stylesheet much like what we do with id in the web world.

  • objectName string - String which holds the widget's object name.

widget.objectName()

Gets the property that holds the widget's object name. It calls the native method QObject: setObjectName.

widget.setMouseTracking(isMouseTracked)

Sets the property that tells whether mouseTracking is enabled for the widget. It calls the native method QWidget: mouseTracking.

  • isMouseTracked boolean - Set it to true to enable mouse tracking.

widget.setEnabled(enabled)

Sets the property that tells whether the widget is enabled. It calls the native method QWidget: enabled. In general an enabled widget handles keyboard and mouse events; a disabled widget does not.

  • enabled boolean - Set it to true to enable the widget.

widget.setFixedSize(width, height)

Sets both the minimum and maximum sizes of the widget. It calls the native method QWidget: setFixedSize.

  • width number - Pixels.
  • height number - Pixels.

widget.setGeometry(x, y, width, height)

Sets the screen position as well as size of the widget. It calls the native method QWidget: setGeometry.

  • x number - Pixels.
  • y number - Pixels.
  • width number - Pixels.
  • height number - Pixels.

widget.setMaximumSize(width, height)

Sets the maximum size of the widget. It calls the native method QWidget: setMaximumSize.

  • width number - Pixels.
  • height number - Pixels.

widget.setMinimumSize(width, height)

Sets the minimum size of the widget. It calls the native method QWidget: setMinimumSize.

  • width number - Pixels.
  • height number - Pixels.

widget.repaint()

Repaints the widget. It calls the native method QWidget: repaint.

widget.update()

Updates the widget. It calls the native method QWidget: update.

widget.pos()

returns the current widget position. It calls the native method QWidget: pos. The returned size object contains x and y coordinates in pixels.

widget.size()

returns the current widget size. It calls the native method QWidget: size. The returned size object contains width and height in pixels.

widget.updateGeometry()

Notifies the layout system that this widget has changed and may need to change geometry.

widget.setAttribute(attributeName, switchOn)

Sets the attribute attribute on this widget if on is true; otherwise clears the attribute. It calls the native method QWidget: setAttribute.

  • attributeName WidgetAttribute - Enum from WidgetAttribute.
  • switchOn - set it to true if you want to enable an attribute.

widget.testAttribute(attributeName)

Returns true if attribute attribute is set on this widget; otherwise returns false. It calls the native method QWidget: testAttribute.

  • attributeName WidgetAttribute - Enum from WidgetAttribute.
- + - + @@ -41,7 +41,7 @@ Returns true if the widget was closed; otherwise returns false.

- + diff --git a/docs/api/QAbstractScrollArea/index.html b/docs/api/QAbstractScrollArea/index.html index 37e6918ec..e71f1c4b9 100644 --- a/docs/api/QAbstractScrollArea/index.html +++ b/docs/api/QAbstractScrollArea/index.html @@ -3,7 +3,7 @@ - + QAbstractScrollArea @@ -28,9 +28,9 @@

QAbstractScrollArea

Abstract class to add functionalities common to all scrollarea based widgets.

This class implements all methods, properties of Qt's QAbstractScrollArea class so that it can be inherited by all scroll based widgets

QAbstractScrollArea is an abstract class and hence no instances of the same should be created. It exists so that we can add similar functionalities to all scrollable widget's easily. If you wish to create a scrollarea use QScrollArea instead.

QAbstractScrollArea is the base class for all widgets. It inherits from another abstract class NodeWidget

QAbstractScrollArea will list all methods and properties that are common to all scrollable widgets in the NodeGui world.

Static Methods

QAbstractScrollArea can access all the static methods defined in NodeWidget

Instance Properties

QAbstractScrollArea can access all the instance properties defined in NodeWidget

Instance Methods

QAbstractScrollArea can access all the instance methods defined in NodeWidget

Additionally it also has the following instance methods:

widget.setViewport(widget)

Sets the viewport to be the given widget. It calls the native method QAbstractScrollArea: setViewport.

  • widget NodeWidget.

widget.viewport()

Returns the viewport widget (NodeWidget). It calls the native method QAbstractScrollArea: viewport.

- + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QAbstractSlider/index.html b/docs/api/QAbstractSlider/index.html index a16b1bdb5..605620c6a 100644 --- a/docs/api/QAbstractSlider/index.html +++ b/docs/api/QAbstractSlider/index.html @@ -3,7 +3,7 @@ - + QAbstractSlider @@ -28,9 +28,9 @@

QAbstractSlider

Abstract class to add functionalities common to all slider based widgets.

This class implements all methods, properties of Qt's QAbstractSlider class so that it can be inherited by all slider based widgets

QAbstractSlider is an abstract class and hence no instances of the same should be created. It exists so that we can add similar functionalities to all slider widget's easily. If you wish to create a slider use QDial instead.

QAbstractSlider is the base class for all widgets. It inherits from another abstract class NodeWidget

QAbstractSlider will list all methods and properties that are common to all slider widgets in the NodeGui world.

Static Methods

QAbstractSlider can access all the static methods defined in NodeWidget

Instance Properties

QAbstractSlider can access all the instance properties defined in NodeWidget

Instance Methods

QAbstractSlider can access all the instance methods defined in NodeWidget

Additionally it also has the following instance methods:

widget.setSingleStep(step)

Sets the step value for user arrow key slider interaction. It calls the native method QAbstractSlider: setSingleStep.

  • step number - Specified single step value.

widget.setMaximum(maximum)

Sets the maximum value for slider. It calls the native method QAbstractSlider: setMaximum.

  • maximum number - Specified maximum slider value.

widget.setMinimum(minimum)

Sets the minimum value for slider. It calls the native method QAbstractSlider: setMinimum.

  • minimum number - Specified minimum slider value.

widget.setValue(value)

Sets the current value for slider. It calls the native method QAbstractSlider: setValue.

  • value number - Specified current slider value.

widget.setOrientation(orientation)

Sets the current orientation for slider. It calls the native method QAbstractSlider: setOrientation.

slider.maximum()

Returns the maximum value (Number) of the slider. It calls the native method QAbstractSlider: maximum.

slider.minimum()

Returns the minimum value (Number) of the slider. It calls the native method QAbstractSlider: minimum.

slider.value()

Returns the current value (Number) of the slider. It calls the native method QAbstractSlider: value.

- + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QApplication/index.html b/docs/api/QApplication/index.html index c67221f1c..c31dd7053 100644 --- a/docs/api/QApplication/index.html +++ b/docs/api/QApplication/index.html @@ -3,7 +3,7 @@ - + QApplication @@ -28,9 +28,9 @@

QApplication

QApplication is the root object for the entire application. It manages app level settings.

This class is a JS wrapper around Qt's QApplication class

The QApplication class manages the GUI application's control flow and main settings. In NodeGui you will never create an instance of it manually. NodeGui's internal runtime Qode does it for you on app start. You can access the initialised QApplication though if needed.

QApplication inherits from Component

Example

const { QApplication } = require("@nodegui/nodegui");
const qApp = QApplication.instance();
qApp.quit();

Static Methods

QApplication can access all the static methods defined in Component. Additionally it also has the following static methods.

QApplication.instance()

Returns the already initialised QApplication instance. It calls the native method QApplication: instance.

QApplication.clipboard()

Returns the object for interacting with the clipboard. It calls the native method QApplication: clipboard. See QClipboard.

Instance Properties

QApplication can access all the instance properties defined in Component

Instance Methods

QApplication can access all the instance methods defined in Component. Additionally it also has the following instance methods:

qApp.quit()

Quits the entire app. It calls the native method QApplication: quit.

qApp.exit(returnCode)

Tells the application to exit with a return code. It calls the native method QApplication: exit.

  • returnCode number - The exit code while quitting the app.

qApp.processEvents()

Processes all pending events for the calling thread . It calls the native method QApplication: processEvents.

qApp.exec()

We will never call this method in NodeGui, since Qode will execute this function for us. It exists for experiments only.

Enters the main event loop and waits until exit() is called. Returns the value that was passed to exit() (which is 0 if exit() is called via quit()). It calls the native method QApplication: exec.

Returns the exit code after app exits.

- + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QCheckBox/index.html b/docs/api/QCheckBox/index.html index 6e6e32561..6ce0eb5cc 100644 --- a/docs/api/QCheckBox/index.html +++ b/docs/api/QCheckBox/index.html @@ -3,7 +3,7 @@ - + QCheckBox @@ -28,9 +28,9 @@

QCheckBox

Create and control checkbox.

This class is a JS wrapper around Qt's QCheckBox class

A QCheckBox provides ability to add and manipulate native checkbox widgets.

QCheckBox inherits from NodeWidget

Example

const { QCheckBox } = require("@nodegui/nodegui");
const checkbox = new QCheckBox();
checkbox.setText("Hello");

new QCheckBox(parent?)

  • parent NodeWidget (optional). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget.

Static Methods

QCheckBox can access all the static methods defined in NodeWidget

Instance Properties

QCheckBox can access all the instance properties defined in NodeWidget

Instance Methods

QCheckBox can access all the instance methods defined in NodeWidget

Additionally it also has the following instance methods:

checkbox.setText(text)

Sets the given text to the checkbox.

  • text string

checkbox.isChecked()

returns whether the checkbox is checked or not. It calls the native method QAbstractButton: isChecked.

checkbox.setChecked(check)

This property holds whether the button is checked. It calls the native method QAbstractButton: setChecked.

  • check boolean
- + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QClipboard/index.html b/docs/api/QClipboard/index.html index da5a9a9ed..c3220bec8 100644 --- a/docs/api/QClipboard/index.html +++ b/docs/api/QClipboard/index.html @@ -3,7 +3,7 @@ - + QClipboard @@ -28,9 +28,9 @@

QClipboard

The QClipboard class provides access to the window system clipboard.

This class is a JS wrapper around Qt's QClipboard class

QClipboard inherits from Component

Example

const {
  QClipboard,
  QClipboardMode,
  QApplication
} = require("@nodegui/nodegui");
const clipboard = QApplication.clipboard();
const text = clipboard.text(QClipboardMode.Clipboard);

Static Methods

QClipboard can access all the static methods defined in Component

Instance Properties

QClipboard can access all the instance properties defined in Component

Instance Methods

QClipboard can access all the instance methods defined in Component. Additionally it has:

clipboard.clear(mode)

Clear the clipboard contents. It calls the native method QClipboard: clear.

clipboard.setText(text, mode)

Copies text into the clipboard as plain text. It calls the native method QClipboard: setText.

clipboard.text(mode)

Returns the clipboard text as plain text, or an empty string if the clipboard does not contain any text. It calls the native method QClipboard: text.

- + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QCursor/index.html b/docs/api/QCursor/index.html index 677b0bd8b..ee347d898 100644 --- a/docs/api/QCursor/index.html +++ b/docs/api/QCursor/index.html @@ -3,7 +3,7 @@ - + QCursor @@ -28,9 +28,9 @@

QCursor

The QCursor class provides scalable icons in different modes and states.

This class is a JS wrapper around Qt's QCursor class

Example

const { QCursor } = require("@nodegui/nodegui");
const cursor = new QCursor();

new QCursor(cursor)

- + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QDial/index.html b/docs/api/QDial/index.html index 9737874ab..8a839e3bc 100644 --- a/docs/api/QDial/index.html +++ b/docs/api/QDial/index.html @@ -3,7 +3,7 @@ - + QDial @@ -28,9 +28,9 @@

QDial

Create and control dial slider widgets.

This class is a JS wrapper around Qt's QDial class

A QDial provides ability to add and manipulate native dial slider widgets.

QDial inherits from QAbstractSlider

Example

const { QDial } = require("@nodegui/nodegui");
const dial = new QDial();

new QDial(parent?)

  • parent NodeWidget (optional). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget.

Static Methods

QDial can access all the static methods defined in NodeWidget

Instance Properties

QDial can access all the instance properties defined in NodeWidget

Instance Methods

QDial can access all the instance methods defined in NodeWidget. Additionally it also has the following instance methods:

dial.setNotchesVisible(visible)

Sets the visibility of notches drawn around the dial. It calls the native method QDial: setNotchesVisible.

  • visible boolean - Set the value as current notch visibility.

dial.setWrapping(on)

Sets the ability to wrap arrow around the dial instead of limiting it to upper part of the dial. It calls the native method QDial: setWrapping.

  • on boolean - Set the value as current wrapping setting.

dial.setNotchTarget(target)

Sets the number of pixels between dial notches. It calls the native method QDial: setNotchTarget.

  • target number - Specifies number of pixels between notches.

dial.notchTarget()

Returns the current number of pixels between dial notches. It calls the native method QDial: notchTarget.

dial.notchesVisible()

Returns the visibility status (Boolean) of dial notches. It calls the native method QDial: notchesVisible.

dial.notchesVisible()

Returns the visibility status (Boolean) of dial notches. It calls the native method QDial: notchesVisible.

dial.wrapping()

Returns the current wrapping (Boolean) state of the dial. It calls the native method QDial: wrapping.

- + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QGridLayout/index.html b/docs/api/QGridLayout/index.html index 48f207931..19f494c2d 100644 --- a/docs/api/QGridLayout/index.html +++ b/docs/api/QGridLayout/index.html @@ -3,7 +3,7 @@ - + QGridLayout @@ -28,9 +28,9 @@

QGridLayout

The QGridLayout class lays out widgets in a grid.

This class is a JS wrapper around Qt's QGridLayout

QGridLayout inherits from NodeLayout

Example

const { QGridLayout, QWidget, QLabel } = require("@nodegui/nodegui");
const view = new QWidget();
const layout = new QGridLayout();
view.setLayout(layout);
const label = new QLabel();
label.setText("label1");
const label2 = new QLabel();
label2.setText("label2");
layout.addWidget(label);
layout.addWidget(label2);

Static Methods

QGridLayout can access all the static methods defined in NodeLayout

Instance Properties

QGridLayout can access all the instance properties defined in NodeLayout

Instance Methods

QGridLayout can access all the instance methods defined in NodeLayout

Additionally it also has the following instance methods:

layout.addWidget(childWidget)

Adds the childWidget to the layout. It calls the native method QGridLayout QGridLayout: addWidget.

  • childWidget NodeWidget - child widget that needs to be added to the layout.

layout.removeWidget(childWidget)

Removes the childWidget from the layout. It calls the native method of custom QGridLayout. QGridLayout: removeWidget.

  • childWidget NodeWidget - child widget that needs to be added to the layout.
- + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QIcon/index.html b/docs/api/QIcon/index.html index 30199bd2f..6805145f4 100644 --- a/docs/api/QIcon/index.html +++ b/docs/api/QIcon/index.html @@ -3,7 +3,7 @@ - + QIcon @@ -30,9 +30,9 @@ Additionally it also has the following instance methods:

QIcon: pixmap.

  • width: number,
  • height: number
  • mode?: QIconMode
  • state?: QIconState
- + - + @@ -42,7 +42,7 @@ Additionally it also has the following instance methods:

- + diff --git a/docs/api/QLabel/index.html b/docs/api/QLabel/index.html index 7b964b435..ef7005999 100644 --- a/docs/api/QLabel/index.html +++ b/docs/api/QLabel/index.html @@ -3,7 +3,7 @@ - + QLabel @@ -28,9 +28,9 @@

QLabel

Create and control text.

This class is a JS wrapper around Qt's QLabel class

A QLabel provides ability to add and manipulate text.

QLabel inherits from NodeWidget

Example

const { QLabel } = require("@nodegui/nodegui");
const label = new QLabel();
label.setText("Hello");

new QLabel(parent?)

  • parent NodeWidget (optional). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget.

Static Methods

QLabel can access all the static methods defined in NodeWidget

Instance Properties

QLabel can access all the instance properties defined in NodeWidget. Additionally it also has the following instance properties:

label.pixmap

The pixmap currently set on this label.

label.text

the current text set on the label.

Instance Methods

QLabel can access all the instance methods defined in NodeWidget. Additionally it also has the following instance methods:

label.setText(text)

Sets the given text to the label.

  • text string

label.setWordWrap(on)

  • on boolean - If true it sets wordwrap on the label

label.setPixmap(pixMap)

Images in the form of a pixmap can be set as the label content

  • pixMap QPixmap - Allows to set image content in the form of a QPixmap on the label
- + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QLineEdit/index.html b/docs/api/QLineEdit/index.html index 1885cfef6..a6bf8e694 100644 --- a/docs/api/QLineEdit/index.html +++ b/docs/api/QLineEdit/index.html @@ -3,7 +3,7 @@ - + QLineEdit @@ -28,9 +28,9 @@

QLineEdit

Create and control editable text field.

This class is a JS wrapper around Qt's QLineEdit class

A QLineEdit provides ability to add and manipulate native editable text field widgets.

QLineEdit inherits from NodeWidget

Example

const { QLineEdit } = require("@nodegui/nodegui");
const lineEdit = new QLineEdit();

new QLineEdit(parent?)

  • parent NodeWidget (optional). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget.

Static Methods

QLineEdit can access all the static methods defined in NodeWidget

Instance Properties

QLineEdit can access all the instance properties defined in NodeWidget. Additionally it also has the following instance properties:

lineEdit.placeholderText

The placeholder text set on the lineEdit.

Instance Methods

QLineEdit can access all the instance methods defined in NodeWidget. Additionally it also has the following instance methods:

lineEdit.setText(text)

Sets the given text to the lineEdit.

  • text string

lineEdit.setPlaceholderText(text)

Sets the given text to the lineEdit's placeholder.

  • text string

lineEdit.text()

Returns the currently set text from native lineEdit widget.

lineEdit.setReadOnly(isReadOnly)

Sets the lineEdit to be read only. lineEdit property holds whether the line edit is read only.

  • isReadOnly boolean

lineEdit.clear()

Clears the lineEdit.

- + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QMainWindow/index.html b/docs/api/QMainWindow/index.html index 8698e10bc..a921794c7 100644 --- a/docs/api/QMainWindow/index.html +++ b/docs/api/QMainWindow/index.html @@ -3,7 +3,7 @@ - + QMainWindow @@ -29,9 +29,9 @@ Once a central widget is set you can add children/layout to the central widget.

Static Methods

QMainWindow can access all the static methods defined in NodeWidget

Instance Properties

QMainWindow can access all the instance properties defined in NodeWidget

Additionally it also has the following instance properties:

win.layout

A NodeLayout representing current layout that is set on the window. If a centralWidget is set then the layout of central widget is returned.

win.centralWidget

A NodeWidget representing currently set central widget on the window.

Instance Methods

QMainWindow can access all the instance methods defined in NodeWidget

Additionally it also has the following instance methods:

win.setCentralWidget(widget)

Sets the given widget to be the main window's central widget.

  • widget NodeWidget - Any widget that inherits from NodeWidget class.
- + - + @@ -41,7 +41,7 @@ Once a central widget is set you can add children/layout to the central widget.< - + diff --git a/docs/api/QPixmap/index.html b/docs/api/QPixmap/index.html index eab540c30..648ff1a75 100644 --- a/docs/api/QPixmap/index.html +++ b/docs/api/QPixmap/index.html @@ -3,7 +3,7 @@ - + QPixmap @@ -30,9 +30,9 @@ returns true if load was successful otherwise returns false.

  • im This method doesnt mutate this pixmap and rather returns a new pixmap with new height and width.

    • width number. Width in pixels for new pixmap.
    • height number. Height in pixels for new pixmap.
    • aspectRatioMode AspectRatioMode (optional). Specifies how scaling should happen. AspectRatio is an enum from Qt
    - + - + @@ -42,7 +42,7 @@ This method doesnt mutate this pixmap and rather returns a new pixmap with new h - + diff --git a/docs/api/QPlainTextEdit/index.html b/docs/api/QPlainTextEdit/index.html index 9d8a5e5f6..600ba7049 100644 --- a/docs/api/QPlainTextEdit/index.html +++ b/docs/api/QPlainTextEdit/index.html @@ -3,7 +3,7 @@ - + QPlainTextEdit @@ -28,9 +28,9 @@

    QPlainTextEdit

    Used to edit and display plain text.

    This class is a JS wrapper around Qt's QPlainTextEdit class

    A QPlainTextEdit provides ability to add and manipulate native editable text field widgets.

    QPlainTextEdit inherits from NodeWidget

    Example

    const { QPlainTextEdit } = require("@nodegui/nodegui");
    const plainTextEdit = new QPlainTextEdit();

    new QPlainTextEdit(parent?)

    • parent NodeWidget (optional). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget.

    Static Methods

    QPlainTextEdit can access all the static methods defined in NodeWidget

    Instance Properties

    QPlainTextEdit can access all the instance properties defined in NodeWidget.

    plainTextEdit.placeholderText

    The placeholder text set on the plainTextEdit.

    Instance Methods

    QPlainTextEdit can access all the instance methods defined in NodeWidget.

    plainTextEdit.setPlainText(text)

    Sets the given text to the plainTextEdit. It calls the native method QPlainTextEdit: setPlainText.

    • text string

    plainTextEdit.setPlaceholderText(text)

    Sets the given text to the plainTextEdit's placeholder.

    • text string

    plainTextEdit.toPlainText()

    Returns the text of the text edit as plain text. QPlainTextEdit: toPlainText.

    plainTextEdit.setReadOnly(isReadOnly)

    Sets the plainTextEdit to be read only. QPlainTextEdit: isReadOnly.

    plainTextEdit.clear()

    Deletes all the text in the text edit.QPlainTextEdit: clear.

    plainTextEdit.setWordWrapMode(mode)

    This property holds the mode QPlainTextEdit will use when wrapping text by words.QPlainTextEdit: setWordWrapMode.

    • mode: QTextOptionWrapMode

    plainTextEdit.wordWrapMode()

    returns word wrap mode. QPlainTextEdit: wordWrapMode.

    plainTextEdit.setLineWrapMode(mode)

    This property holds the line wrap mode. QPlainTextEdit: setLineWrapMode.

    • mode: LineWrapMode

    plainTextEdit.lineWrapMode()

    returns line wrap mode. QPlainTextEdit: setLineWrapMode.

    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QProgressBar/index.html b/docs/api/QProgressBar/index.html index 4a4ff558f..ed6ffcb16 100644 --- a/docs/api/QProgressBar/index.html +++ b/docs/api/QProgressBar/index.html @@ -3,7 +3,7 @@ - + QProgressBar @@ -28,9 +28,9 @@

    QProgressBar

    Create and control progress bar widgets.

    This class is a JS wrapper around Qt's QProgressBar class

    A QProgressBar provides ability to add and manipulate native progress bar widgets.

    QProgressBar inherits from NodeWidget

    Example

    const { QProgressBar } = require("@nodegui/nodegui");
    const progressBar = new QProgressBar();

    new QProgressBar(parent?)

    • parent NodeWidget (optional). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget.

    Static Methods

    QProgressBar can access all the static methods defined in NodeWidget

    Instance Properties

    QProgressBar can access all the instance properties defined in NodeWidget

    Instance Methods

    QProgressBar can access all the instance methods defined in NodeWidget. Additionally it also has the following instance methods:

    progressBar.setValue(value)

    Sets the current value of the progressBar. It calls the native method QProgressBar: setValue.

    • value number - Set the value as current value

    progressBar.setMaximum(max)

    Sets the max value of the progressBar. It calls the native method QProgressBar: setMaximum.

    • max number - Set the value as max value of the progress bar.

    progressBar.setMinimum(min)

    Sets the min value of the progressBar. It calls the native method QProgressBar: setMinimum.

    • min number - Set the value as min value of the progress bar.

    progressBar.setOrientation(orientation)

    Sets the orientation of the progressBar. It calls the native method QProgressBar: setOrientation.

    progressBar.value()

    Returns the current value (Number) of the progressBar. It calls the native method QProgressBar: value.

    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QPushButton/index.html b/docs/api/QPushButton/index.html index 3ea06ef93..0cbb5ef91 100644 --- a/docs/api/QPushButton/index.html +++ b/docs/api/QPushButton/index.html @@ -3,7 +3,7 @@ - + QPushButton @@ -28,9 +28,9 @@

    QPushButton

    Create and control buttons.

    This class is a JS wrapper around Qt's QPushButton class

    A QPushButton provides ability to add and manipulate native button widgets.

    QPushButton inherits from NodeWidget

    Example

    const { QPushButton } = require("@nodegui/nodegui");
    const button = new QPushButton();
    button.setText("Hello");

    new QPushButton(parent?)

    • parent NodeWidget (optional). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget.

    Static Methods

    QPushButton can access all the static methods defined in NodeWidget

    Instance Properties

    QPushButton can access all the instance properties defined in NodeWidget

    Instance Methods

    QPushButton can access all the instance methods defined in NodeWidget

    Additionally it also has the following instance methods:

    button.setText(text)

    Sets the given text to the button.

    • text string

    button.setFlat(isFlat)

    Sets whether the button border is raised.

    • isFlat boolean

    button.setIcon(icon)

    Sets an icon in the button.

    • icon QIcon
    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QRadioButton/index.html b/docs/api/QRadioButton/index.html index 37b8c1fd9..9d22fb3f9 100644 --- a/docs/api/QRadioButton/index.html +++ b/docs/api/QRadioButton/index.html @@ -3,7 +3,7 @@ - + QRadioButton @@ -28,9 +28,9 @@

    QRadioButton

    Create and control radio button.

    This class is a JS wrapper around Qt's QRadioButton class

    A QRadioButton provides ability to add and manipulate native radio button widgets.

    QRadioButton inherits from NodeWidget

    Example

    const { QRadioButton } = require("@nodegui/nodegui");
    const radioButton = new QRadioButton();
    radioButton.setText("Hello");

    new QRadioButton(parent?)

    • parent NodeWidget (optional). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget.

    Static Methods

    QRadioButton can access all the static methods defined in NodeWidget

    Instance Properties

    QRadioButton can access all the instance properties defined in NodeWidget

    Instance Methods

    QRadioButton can access all the instance methods defined in NodeWidget

    Additionally it also has the following instance methods:

    radioButton.setText(text)

    Sets the given text to the radioButton.

    • text string
    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QScrollArea/index.html b/docs/api/QScrollArea/index.html index 3348894db..e28e7e712 100644 --- a/docs/api/QScrollArea/index.html +++ b/docs/api/QScrollArea/index.html @@ -3,7 +3,7 @@ - + QScrollArea @@ -28,9 +28,9 @@

    QScrollArea

    A QScrollArea provides a scrolling view onto another widget.

    This class is a JS wrapper around Qt's QScrollArea class

    QScrollArea inherits from QAbstractScrollArea

    Example

    const { QScrollArea } = require("@nodegui/nodegui");
    const scrollArea = new QScrollArea();
    scrollArea.setInlineStyle("flex: 1; width:'100%';");
    const imageLabel = new QLabel();
    const pixmap = new QPixmap(
      path.resolve(__dirname, "../extras/assets/kitchen.png")
    );
    imageLabel.setPixmap(pixmap);
    scrollArea.setWidget(imageLabel);

    new QScrollArea(parent?)

    • parent NodeWidget (optional). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget.

    Static Methods

    QScrollArea can access all the static methods defined in QAbstractScrollArea

    Instance Properties

    QScrollArea can access all the instance properties defined in QAbstractScrollArea

    Instance Methods

    QScrollArea can access all the instance methods defined in QAbstractScrollArea. Additionally it also has the following instance methods:

    scrollArea.setWidget(widget)

    Sets the scroll area's widget. It calls the native method QScrollArea: setWidget.

    • widget NodeWidget - Any widget you want to enclose in a scroll area.
    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QSpinBox/index.html b/docs/api/QSpinBox/index.html index 13aade2d6..ea39430c2 100644 --- a/docs/api/QSpinBox/index.html +++ b/docs/api/QSpinBox/index.html @@ -3,7 +3,7 @@ - + QSpinBox @@ -28,9 +28,9 @@

    QSpinBox

    Create and control spin box widgets.

    This class is a JS wrapper around Qt's QSpinBox class

    A QSpinBox provides ability to add and manipulate native spin box widgets.

    QSpinBox inherits from NodeWidget

    Example

    const { QSpinBox } = require("@nodegui/nodegui");
    const spinBox = new QSpinBox();

    new QSpinBox(parent?)

    • parent NodeWidget (optional). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget.

    Static Methods

    QSpinBox can access all the static methods defined in NodeWidget

    Instance Properties

    QSpinBox can access all the instance properties defined in NodeWidget

    Instance Methods

    QSpinBox can access all the instance methods defined in NodeWidget. Additionally it also has the following instance methods:

    spinBox.setValue(val)

    Sets the current value of the spinBox. It calls the native method QSpinBox: setValue.

    • val number - Set the value as current value

    spinBox.setRange(minimum, maximum)

    Sets the min/max value of the spinBox. It calls the native method QSpinBox: setRange.

    • max number - Set the value as max value of the progress bar.

    spinBox.setPrefix(prefix)

    Sets the prefix of the spinBox. It calls the native method QSpinBox: setPrefix.

    spinBox.setSuffix(suffix)

    Sets the suffix of the spinBox. It calls the native method QSpinBox: setSuffix.

    spinBox.setSingleStep(val)

    Sets the single step value of the spinBox. It calls the native method QSpinBox: setSingleStep.

    spinBox.cleanText()

    Returns the text content (String) of the spinBox excluding any prefix, suffix, or leading or trailing whitespace. It calls the native method QSpinBox: value.

    spinBox.minimum()

    Returns the minimum value (Number) of the spinBox. It calls the native method QSpinBox: value.

    spinBox.maximum()

    Returns the maximum value (Number) of the spinBox. It calls the native method QSpinBox: value.

    spinBox.value()

    Returns the current value (Number) of the spinBox. It calls the native method QSpinBox: value.

    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QTabWidget/index.html b/docs/api/QTabWidget/index.html index 272be086f..831ad7002 100644 --- a/docs/api/QTabWidget/index.html +++ b/docs/api/QTabWidget/index.html @@ -3,7 +3,7 @@ - + QTabWidget @@ -28,9 +28,9 @@

    QTabWidget

    Will be available from NodeGUI v0.1.10 and up

    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QWidget/index.html b/docs/api/QWidget/index.html index f9ce59a38..c2e9d7e2a 100644 --- a/docs/api/QWidget/index.html +++ b/docs/api/QWidget/index.html @@ -3,7 +3,7 @@ - + QWidget @@ -28,9 +28,9 @@

    QWidget

    Create and control views.

    This class is a JS wrapper around Qt's QWidget class

    A QWidget can be used to encapsulate other widgets and provide structure. It functions similar to a div in the web world.

    QWidget inherits from NodeWidget

    Example

    const { QWidget } = require("@nodegui/nodegui");
    const view = new QWidget();
    view.setObjectName("container"); //Similar to setting `id` on the web
    view.setLayout(new FlexLayout());

    new QWidget(parent?)

    • parent NodeWidget (optional). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget.

    Static Methods

    QWidget can access all the static methods defined in NodeWidget

    Instance Properties

    QWidget can access all the instance properties defined in NodeWidget

    Instance Methods

    QWidget can access all the instance methods defined in NodeWidget

    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/QtEnums/index.html b/docs/api/QtEnums/index.html index 7fa858136..baea31fe3 100644 --- a/docs/api/QtEnums/index.html +++ b/docs/api/QtEnums/index.html @@ -3,7 +3,7 @@ - + Qt Enums @@ -28,9 +28,9 @@

    Qt Enums

    Enums from Qt

    For a complete list of Enums that we can use from Javascript see file

    Qt enums: src/lib/QtEnums/index.ts in the NodeGui repo.

    All the enums in this file can be imported directly from @nodegui/@nodegui.

    Example

    import { AspectRatioMode } from "@nodegui/nodegui";
    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/YogaWidget/index.html b/docs/api/YogaWidget/index.html index 81bcdc951..65b459d09 100644 --- a/docs/api/YogaWidget/index.html +++ b/docs/api/YogaWidget/index.html @@ -3,7 +3,7 @@ - + YogaWidget @@ -28,9 +28,9 @@

    YogaWidget

    Abstract class to add common functionality related to Flex layout to all Widgets.

    This class implements methods related to flex layout required to be present in all widgets

    YogaWidget is an abstract class and hence no instances of the same should be created. It exists so that we can add similar functionalities related to flex layout to all widget's easily. We implement flex layout using a library called Yoga. As part of yoga every widget needs to store its own flex properties such as alignItems, flexDirection etc. This is done with the help of YogaWidget.

    YogaWidget is the base class for EventWidget which means all widgets inherit it aswell. It inherits from another abstract class Component

    const { QWidget } = require("@nodegui/nodegui");
    const view = new QWidget();
    // getFlexNode is a method from YogaWidget
    const flexNode = view.getFlexNode();

    YogaWidget helps in storing all flex properties of a widget.

    Static Methods

    YogaWidget can access all the static methods defined in Component

    Instance Properties

    YogaWidget can access all the instance properties defined in Component

    Instance Methods

    YogaWidget can access all the instance methods defined in Component

    Additionally it also has the following instance methods:

    widget.getFlexNode()

    Returns a native reference to the flex node used in c++ instance for the widget. This is not a regular javascript object and hence no methods or properties can be accessed from it. It exists so that we pass around a widgets flex node to layouts, etc.

    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/api/process/index.html b/docs/api/process/index.html index fc3844005..9dc56bfc9 100644 --- a/docs/api/process/index.html +++ b/docs/api/process/index.html @@ -3,7 +3,7 @@ - + process @@ -30,9 +30,9 @@ It adds the following properties :

    Properties

    process.versions.qode Readonly

    A String representing Qode's version string. Qode is a lightly modified version of NodeJs that allows running Qt and NodeJs under a single process.

    process.versions.qt(compiled) Readonly

    A String representing Qt version used when compile Qode binary. This can be useful to know which version of Qt is binary compatible with the version of Qode you are running. This is useful when running qode with a different version of Qt than what it was compiled with.

    process.versions.qt(runtime) Readonly

    A String representing Qt version of the Qt library loaded during runtime. This can be useful to know which version of Qt you are using at runtime as compared to the version of Qt used when Qode was compiled.This is possible since Qt is dynamically linked to Qode and you could replace the Qt dynamic libraries with any binary compatible library. Hence, this is useful when running qode with a different version of Qt than what it was compiled with.

    - + - + @@ -42,7 +42,7 @@ It adds the following properties :

    - + - + @@ -45,7 +45,7 @@ built-in modules.

    
 
-
+
 
 
 
diff --git a/docs/development/README/index.html b/docs/development/README/index.html
index 9a52b2fb6..f1a42f987 100644
--- a/docs/development/README/index.html
+++ b/docs/development/README/index.html
@@ -3,7 +3,7 @@
 
 
 
-
+
 
 README
 
@@ -29,9 +29,9 @@
 https://doc.qt.io/qt-5/qprogressbar.html#textVisible-prop to get a grip on it.
     This PR can be used as a guide
     https://github.com/nodegui/nodegui/issues/36
     https://github.com/nodegui/nodegui/pull/39
     You can also take a look at few bugs or the issue board here to know what you can pick up if you are out of ideas.
     https://github.com/nodegui/nodegui/projects/
     https://github.com/nodegui/react-nodegui/projects/
    
 
 
-
+
 
-
+
 
 
 
@@ -41,7 +41,7 @@
 
 
 
-
+
 
 
 
diff --git a/docs/development/common_errors/index.html b/docs/development/common_errors/index.html
index 5f507eb2c..66006e634 100644
--- a/docs/development/common_errors/index.html
+++ b/docs/development/common_errors/index.html
@@ -3,7 +3,7 @@
 
 
 
-
+
 
 common_errors
 
@@ -30,9 +30,9 @@
 if its a leaf node widget(doesnt contain any children).

    • - + - + @@ -42,7 +42,7 @@ if its a leaf node widget(doesnt contain any children).

    - + diff --git a/docs/development/debugging/index.html b/docs/development/debugging/index.html index bcea04fde..9a999c658 100644 --- a/docs/development/debugging/index.html +++ b/docs/development/debugging/index.html @@ -3,7 +3,7 @@ - + debugging @@ -28,9 +28,9 @@
    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/development/getting-started/index.html b/docs/development/getting-started/index.html index 2b20eddc7..d00e5a4d7 100644 --- a/docs/development/getting-started/index.html +++ b/docs/development/getting-started/index.html @@ -3,7 +3,7 @@ - + getting-started @@ -31,9 +31,9 @@ So if you take a look at NLabel you will see, it inherits from QLabel and NodeWi 4.1. You can see the readme of https://github.com/nodejs/node-addon-api.git/
  • See node-qt implementation. It is implemented in Nan (explained in video).
  • Now try to match the implementation in node-qt and convert to N-API using examples from samples.
  • Implementations not in node-qt need to be done with effort.
    • - + - + @@ -43,7 +43,7 @@ So if you take a look at NLabel you will see, it inherits from QLabel and NodeWi - + diff --git a/docs/development/setting-up/index.html b/docs/development/setting-up/index.html index 7da4673f7..85557ed4b 100644 --- a/docs/development/setting-up/index.html +++ b/docs/development/setting-up/index.html @@ -3,7 +3,7 @@ - + setting-up @@ -28,9 +28,9 @@

    setting-up

    Setup project for development

    Development setup and getting started

    Make sure you follow the setup guide of Qode so that you have a build environment ready for Qode.

    MacOSX:

    Requirements

    1. Node version: > 11
    2. CMake 3.1 and up (Installation instructions can be found here: https://cmake.org/install/)
    3. Make, GCC v7
    4. Qt (Optional): Make sure you followed the setup instructions from Qode

    Windows:

    Requirements

    1. Node version: > 11
    2. CMake 3.1 and up (Installation instructions can be found here: https://cmake.org/install/)
    3. Visual Studio Community 2017
    4. Powershell
    5. Qt (Optional): Make sure you followed the setup instructions from Qode

    Linux:

    Supported versions: Ubuntu 17.10 and up

    Requirements

    1. Node version: > 11
    2. CMake 3.1 and up (Installation instructions can be found here: https://cmake.org/install/)
    3. Make, GCC v7, pkg-config
    4. Qt (Optional): Make sure you followed the setup instructions from Qode

    On Ubuntu: $ sudo apt-get install pkg-config build-essentials should install everything except Qt5.

    Note: If you are using your own version of Qt make sure to

    export PKG_CONFIG_PATH="<path to qt installation>/5.13.0/gcc_64/lib/pkgconfig"

    Common:

    1. Once you have setup the platform specific stuff as mentioned above, follow these:
    2. git clone this repo.
    3. yarn install
    4. yarn build:addon
    5. yarn dev

    If you want to run with your own version of Qt make sure to pass qt_home_dir variable when building addon.

    npm run rebuild:addon [--qt_home_dir=/path/to/qt]

    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/development/signal_and_event_handling/index.html b/docs/development/signal_and_event_handling/index.html index 9e22932c1..a8de82046 100644 --- a/docs/development/signal_and_event_handling/index.html +++ b/docs/development/signal_and_event_handling/index.html @@ -3,7 +3,7 @@ - + signal_and_event_handling @@ -33,9 +33,9 @@ like this:

    
 And run npm run automoc before running npm run build:addon
    We need to run Qt's MOC (Meta Object Compiler) on the file whenever we use Q_OBJECT in a class or use QObject::connect. This is so that Qt can expand the macros and add necessary implementations to our class.
    How does it work ?
    1. On JS side for each widget instance we create an instance of NodeJS's Event Emitter. This is done by the class EventWidget from which NodeWidget inherits
    2. We send this event emiiter's emit function to the C++ side by calling initNodeEventEmitter method and store a pointer to the event emitter's emit function using emitOnNode. initNodeEventEmitter function is added by a macro from EventWidget (c++). You can find the initNodeEventEmitter method with the event widget macros.
    3. We setup Qt's connect method for all the signals that we want to listen to and call the emitOnNode (which is actually emit from Event emitter) whenever a signal arrives. This is done manually on every widget by overriding the method connectWidgetSignalsToEventEmitter. Check npushbutton.h for details. This takes care of all the signals of the widgets. Now to export all qt events of the widget, we had overriden the widgets event(Event*) method to listen to events received by the widget and send it to the event emitter. This is done inside the EVENTWIDGET_IMPLEMENTATIONS macro
    
 
 
-
+
 
-
+
 
 
 
@@ -45,7 +45,7 @@ And run npm run automoc before running npm run build:addon
 
-
+
 
 
 
diff --git a/docs/development/styling/index.html b/docs/development/styling/index.html
index 6ea03a299..2d04bedac 100644
--- a/docs/development/styling/index.html
+++ b/docs/development/styling/index.html
@@ -3,7 +3,7 @@
 
 
 
-
+
 
 styling
 
@@ -35,9 +35,9 @@ declare and define q properties for each of those custom properties we want.
 This allows us to use something like:
    view.setStyleSheet(`
        background-color:green;
        qproperty-flex: 1;
        qproperty-alignItems: 'center';
    `);
    Notice qproperty- prefix? These are the custom q-properties we defined in YogaWidget.h. We do not need to prefix qproperty- if a stylehsheet string is passed through StyleSheet.create(). StyleSheet.create has an autoprefixer which will do the right thing.
    NodeWidget
    Every widget we implement should inherit from NodeWidget. This helps us add all the properties we want in the widgets via a single class. NodeWidget is the class that contains properties and methods shared by all widgets. This class allows us to add features to all widgets easily.
    
 
 
-
+
 
-
+
 
 
 
@@ -47,7 +47,7 @@ This allows us to use something like:
    
 
-
+
 
 
 
diff --git a/docs/development/wrapping_widgets/index.html b/docs/development/wrapping_widgets/index.html
index e115a1c9f..5e5b30898 100644
--- a/docs/development/wrapping_widgets/index.html
+++ b/docs/development/wrapping_widgets/index.html
@@ -3,7 +3,7 @@
 
 
 
-
+
 
 wrapping_widgets
 
@@ -28,9 +28,9 @@
 
    wrapping_widgets
    Exporting a new method from a widget
    Exporting a new widget from scratch
    
 
    
 
-
+
 
-
+
 
 
 
@@ -40,7 +40,7 @@
 
 
 
-
+
 
 
 
diff --git a/docs/doc1/index.html b/docs/doc1/index.html
index 90d88cbfa..4430a8a45 100644
--- a/docs/doc1/index.html
+++ b/docs/doc1/index.html
@@ -3,7 +3,7 @@
 
 
 
-
+
 
 Style Guide
 
@@ -28,9 +28,9 @@
 
    Style Guide
    You can write content using GitHub-flavored Markdown syntax.
    Markdown Syntax
    To serve as an example page when styling markdown based Docusaurus sites.
    Headers
    H1 - Create the best documentation
    H2 - Create the best documentation
    H3 - Create the best documentation
    H4 - Create the best documentation
    H5 - Create the best documentation
    H6 - Create the best documentation
    Emphasis
    Emphasis, aka italics, with asterisks or underscores.
    Strong emphasis, aka bold, with asterisks or underscores.
    Combined emphasis with asterisks and underscores.
    Strikethrough uses two tildes. Scratch this.
    Lists
    1. First ordered list item
    2. Another item ⋅⋅* Unordered sub-list.
    3. Actual numbers don't matter, just that it's a number ⋅⋅1. Ordered sub-list
    4. And another item.
    ⋅⋅⋅You can have properly indented paragraphs within list items. Notice the blank line above, and the leading spaces (at least one, but we'll use three here to also align the raw Markdown).
    ⋅⋅⋅To have a line break without a paragraph, you will need to use two trailing spaces.⋅⋅ ⋅⋅⋅Note that this line is separate, but within the same paragraph.⋅⋅ ⋅⋅⋅(This is contrary to the typical GFM line break behaviour, where trailing spaces are not required.)
    • Unordered list can use asterisks
    • Or minuses
    • Or pluses
    Links
    I'm an inline-style link
    I'm an inline-style link with title
    I'm a reference-style link
    I'm a relative reference to a repository file
    You can use numbers for reference-style link definitions
    Or leave it empty and use the link text itself.
    URLs and URLs in angle brackets will automatically get turned into links. http://www.example.com or http://www.example.com and sometimes example.com (but not on Github, for example).
    Some text to show that the reference links can follow later.
    Images
    Here's our logo (hover to see the title text):
    Inline-style: alt text
    Reference-style: alt text
    Code
    var s = 'JavaScript syntax highlighting';
    alert(s);
    s = "Python syntax highlighting"
    print s
    No language indicated, so no syntax highlighting.
    But let's throw in a <b>tag</b>.
    Tables
    Colons can be used to align columns.
    TablesAreCool
    col 3 isright-aligned$1600
    col 2 iscentered$12
    zebra stripesare neat$1
    There must be at least 3 dashes separating each header cell. The outer pipes (|) are optional, and you don't need to make the raw Markdown line up prettily. You can also use inline Markdown.
    MarkdownLessPretty
    Stillrendersnicely
    123
    Blockquotes
    Blockquotes are very handy in email to emulate reply text. This line is part of the same quote.
    Quote break.
    This is a very long line that will still be quoted properly when it wraps. Oh boy let's keep writing to make sure this is long enough to actually wrap for everyone. Oh, you can put Markdown into a blockquote.
    Inline HTML
    Definition list
    Is something people use sometimes.
    Markdown in HTML
    Does *not* work **very** well. Use HTML tags.
    Line Breaks
    Here's a line for us to start with.
    This line is separated from the one above by two newlines, so it will be a separate paragraph.
    This line is also a separate paragraph, but... This line is only separated by a single newline, so it's a separate line in the same paragraph.
    
 
 
-
+
 
-
+
 
 
 
@@ -40,7 +40,7 @@
 
 
 
-
+
 
 
 
diff --git a/docs/faq/index.html b/docs/faq/index.html
index 12a86282d..16624a4b5 100644
--- a/docs/faq/index.html
+++ b/docs/faq/index.html
@@ -3,7 +3,7 @@
 
 
 
-
+
 
 FAQ
 
@@ -39,9 +39,9 @@ garbage collected.
    If you encounter this problem, the following articles m
 code from this:
    const { QWidget } = require("@nodegui/nodegui");
    const view = new QWidget();
    view.setObjectName("container");
    view.setLayout(new FlexLayout());
    to this:
    const { QWidget } = require("@nodegui/nodegui");
    const view = new QWidget();
    view.setObjectName("container");
    view.setLayout(new FlexLayout());
    global.view = view; //prevent GC
    
 
 
-
+
 
-
+
 
 
 
@@ -51,7 +51,7 @@ code from this:
    
 
-
+
 
 
 
diff --git a/docs/guides/custom-nodegui-native-plugin/index.html b/docs/guides/custom-nodegui-native-plugin/index.html
index b1d7581f5..8c25ec2a3 100644
--- a/docs/guides/custom-nodegui-native-plugin/index.html
+++ b/docs/guides/custom-nodegui-native-plugin/index.html
@@ -3,7 +3,7 @@
 
 
 
-
+
 
 Custom NodeGui Plugin
 
@@ -28,9 +28,9 @@
 
    Custom NodeGui Plugin
    WIP
    
 
    
 
-
+
 
-
+
 
 
 
@@ -40,7 +40,7 @@
 
 
 
-
+
 
 
 
diff --git a/docs/guides/debugging-in-vscode/index.html b/docs/guides/debugging-in-vscode/index.html
index 49659d9d3..314a7a77c 100644
--- a/docs/guides/debugging-in-vscode/index.html
+++ b/docs/guides/debugging-in-vscode/index.html
@@ -3,7 +3,7 @@
 
 
 
-
+
 
 Debugging in VSCode
 
@@ -28,9 +28,9 @@
 
    Debugging in VSCode
    • Open a NodeGui project in VSCode.
      $ git clone git@github.com:nodegui/nodegui-starter.git
      $ code nodegui-starter
    • Add a file .vscode/launch.json with the following configuration:
      {
        "version": "0.2.0",
        "configurations": [
          {
            "name": "Debug Qode Process",
            "type": "node",
            "request": "launch",
            "cwd": "${workspaceRoot}",
            "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/qode",
            "windows": {
              "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/qode.exe"
            },
            "args": ["./dist/index.js"],
            "outputCapture": "std"
          }
        ]
      }
      Tip: You could also configure a preLaunchTask for building typescript before launching the debugger everytime.
    • Debugging
      Set some breakpoints in index.js, and start debugging in the Debug View. You should be able to hit the breakpoints.
    
 
 
-
+
 
-
+
 
 
 
@@ -40,7 +40,7 @@
 
 
 
-
+
 
 
 
diff --git a/docs/guides/debugging/index.html b/docs/guides/debugging/index.html
index 68a6db6ca..53c2eca07 100644
--- a/docs/guides/debugging/index.html
+++ b/docs/guides/debugging/index.html
@@ -3,7 +3,7 @@
 
 
 
-
+
 
 Debugging
 
@@ -37,9 +37,9 @@ an external debugger will need to connect on this port. The default port
  • Debugging the NodeGui app in VSCode
- + - + @@ -49,7 +49,7 @@ launched NodeGui app present there.
  • - + diff --git a/docs/guides/getting-started/index.html b/docs/guides/getting-started/index.html index 64adca488..4480779e8 100644 --- a/docs/guides/getting-started/index.html +++ b/docs/guides/getting-started/index.html @@ -3,7 +3,7 @@ - + Getting started @@ -43,9 +43,9 @@ virtually all code editors and IDEs these days support JavaScript.

    nodegui/nodegui-starter repository.

    Note: Running this requires Git and npm.

    # Clone the repository
    $ git clone https://github.com/nodegui/nodegui-starter
    # Go into the repository
    $ cd nodegui-starter
    # Install dependencies
    $ npm install
    # Run the app
    $ npm start

    That's it!

    Congratulations! You've successfully run and modified your first NodeGui app.

    Now what?

    If you're curious to learn more about NodeGui, continue on to the tutorial.

    - + - + @@ -55,7 +55,7 @@ virtually all code editors and IDEs these days support JavaScript.

    - + diff --git a/docs/guides/handle-events/index.html b/docs/guides/handle-events/index.html index 4bea41045..9176368cc 100644 --- a/docs/guides/handle-events/index.html +++ b/docs/guides/handle-events/index.html @@ -3,7 +3,7 @@ - + Handle Events @@ -28,9 +28,9 @@
    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/guides/images/index.html b/docs/guides/images/index.html index e24e9d930..3b2ce1ff4 100644 --- a/docs/guides/images/index.html +++ b/docs/guides/images/index.html @@ -3,7 +3,7 @@ - + Images @@ -28,9 +28,9 @@
    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/guides/layout/index.html b/docs/guides/layout/index.html index 9f47fae9d..847558050 100644 --- a/docs/guides/layout/index.html +++ b/docs/guides/layout/index.html @@ -3,7 +3,7 @@ - + Layout @@ -28,9 +28,9 @@

    Layout

    NodeGui uses a layout system to automatically arranging child widgets within a widget to ensure that they make good use of the available space.

    Fixed Dimensions

    A widget's height and width determine its size on the screen. The simplest way to set the dimensions of a widget is by adding a fixed width and height to style. Setting dimensions this way is common for widgets that should always render at exactly the same size, regardless of screen dimensions.

    const { QMainWindow, QWidget } = require("@nodegui/nodegui");
    const win = new QMainWindow();
    const view = new QWidget(win);
    view.setInlineStyle("width:50px; height:30px; background-color: yellow;");
    win.show();
    (global as any).win = win;

    Dynamic Layouts

    Dynamic layouts automatically position and resize widgets when the amount of space available for them changes, ensuring that they are consistently arranged and that the user interface as a whole remains usable.

    NodeGui currently supports the following layouts at the moment:

    • FlexLayout
    • QGridLayout

    More layouts will be added as time goes on. You can also add layouts yourself by creating custom native plugins for NodeGui usng the Custom Native Plugin API.

    FlexLayout

    Use FlexLayout to have the children expand and shrink dynamically based on available space. Normally you will use flex: 1, which tells a widget to fill all available space, shared evenly amongst other widgets with the same parent. The larger the flex given, the higher the ratio of space a component will take compared to its siblings.

    A widget can only expand to fill available space if its parent has dimensions greater than 0. If a parent does not have either a fixed width and height or flex, the parent will have dimensions of 0 and the flex children will not be visible.

    Flexbox is designed to provide a consistent layout on different screen sizes. You will normally use a combination of flexDirection, alignItems, and justifyContent to achieve the right layout.

    Example:

    Lets say you want to build a UI that has a parent view which has two child widgets. One a label with text Hello and another a view with background color white. Now you want the label to occupy 1/3 of the available space while the white colored child view to occupy the remaining 2/3 space.

    flex layout example 1

    The code for that would look something like this:

    let { QLabel, FlexLayout, QWidget, QMainWindow } = require("@nodegui/nodegui");
    // Create a root view and assign a flex layout to it.
    const rootView = new QWidget();
    rootView.setLayout(new FlexLayout());
    rootView.setObjectName("rootView");
    // Create two widgets - one label and one view
    const label = new QLabel();
    label.setText("Hello");
    label.setObjectName("label");
    const view = new QWidget();
    view.setObjectName("view");
    // Now tell rootView layout that the label and the other view are its children
    rootView.layout.addWidget(label);
    rootView.layout.addWidget(view);
    // Tell FlexLayout how you want children of rootView to be poisitioned
    rootView.setStyleSheet(`
      #rootView{
        flex: 1;
        background-color: blue;
      }
      #label {
       flex: 1;
       color: white;
       background-color: green;
      }
      #view {
        flex: 3;
        background-color: white;
      }
    `);
    const win = new QMainWindow();
    win.setCentralWidget(rootView);
    win.show();
    global.win = win;

    TLDR

    • First step is to set a layout on the parent widget. You can do this using the widget's setLayout method. Here we are using FlexLayout.

    • For a layout to work you must let the layout know which widgets are the children and how to lay them on the available screen space within the parent widget. You do this using a layout's addWidget method. In the case of FlexLayout you will specify properties by setting flex properties on the parent and child widgets.

    To know more on how FlexBox layout works in depth you can visit: https://facebook.github.io/react-native/docs/0.60/flexbox.

    NodeGui uses the same library that React Native uses underneath for FlexBox (Yoga).

    • You can specify layout properties via inline styles also.

    Conclusion

    The primary layout in NodeGui is the Flexbox layout. Flexbox layout can be controlled via stylesheet just as in web. So both paint and layout properties are available at the same place.

    NodeGui will also try to support other available layouts in Qt. But, If you need a special layout that Qt/NodeGui doesnt yet support you can always create a native plugin for NodeGui and use Qt's APIs to create one. In fact, Qt doesnt have a FlexLayout built in, FlexLayout is actually a custom Qt layout written with the help of Yoga library.

    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/guides/networking/index.html b/docs/guides/networking/index.html index 81d0281ec..6ad11ecd1 100644 --- a/docs/guides/networking/index.html +++ b/docs/guides/networking/index.html @@ -3,7 +3,7 @@ - + Networking @@ -28,9 +28,9 @@
    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/guides/nodegui-architecture/index.html b/docs/guides/nodegui-architecture/index.html index 7e94dd588..f3e47614f 100644 --- a/docs/guides/nodegui-architecture/index.html +++ b/docs/guides/nodegui-architecture/index.html @@ -3,7 +3,7 @@ - + Architecture @@ -41,9 +41,9 @@ compiled with Qode or a compatible Node version to be used with NodeGui.

    T consult this guide on how to recompile them for NodeGui.

    - + - + @@ -53,7 +53,7 @@ consult this guide on how to re - + diff --git a/docs/guides/scroll-view/index.html b/docs/guides/scroll-view/index.html index aa9cf5aaa..ab497dd97 100644 --- a/docs/guides/scroll-view/index.html +++ b/docs/guides/scroll-view/index.html @@ -3,7 +3,7 @@ - + Scroll View @@ -28,9 +28,9 @@
    - + - + @@ -40,7 +40,7 @@ - + diff --git a/docs/guides/styling/index.html b/docs/guides/styling/index.html index 97002d219..250fea0f6 100644 --- a/docs/guides/styling/index.html +++ b/docs/guides/styling/index.html @@ -3,7 +3,7 @@ - + Styling @@ -29,9 +29,9 @@ Some examples include:

    * {
      color: blue;
    }
    QPushButton {
      padding: 10px;
    }
    #okButton {
      margin: 10px;
    }
    #mainView > QPushButton {
      margin: 10px;
    }

    To see a complete list of selectors see here: https://doc.qt.io/qt-5/stylesheet-syntax.html#selector-types

    Pseudo states

    Like in the web, you can style your widget based on its state. An example would be, you might want the color of the button text to be red when its hovered upon. These are possible with pseudo states. Pseudo-states appear at the end of the selector, with a colon (:) in between.

    #okButton:hover {
      color: red;
    }

    More details here : https://doc.qt.io/qt-5/stylesheet-syntax.html#pseudo-states

    Cascading

    Style sheets can be set on the parent widgets and on child widgets. An arbitrary widget's effective style sheet is obtained by merging the style sheets set on the widget's ancestors (parent, grandparent, etc.).

    When conflicts arise, the widget's own inline style sheet is always preferred to any inherited style sheet, irrespective of the specificity of the conflicting rules. Likewise, the parent widget's style sheet is preferred to the grandparent's, etc.

    The behaviour is similar to what we see on the web.

    For more in depth examples see here: https://doc.qt.io/qt-5/stylesheet-syntax.html#cascading

    Supported properties

    Since we are not running inside a web browser, there are few differences in the properties you could use in NodeGui vs in web.

    The complete list is detailed here: https://doc.qt.io/qt-5/stylesheet-reference.html#list-of-properties

    Apart from the properties listed in the link, NodeGui also supports layout properties related to Flex. You can use all flex properties such as align-items, justify-content, flex, etc on all widgets. The layout styling will be coverted in more detail in the section: Layout.

    Advanced usage (Setting QObject Properties)

    In Qt, every widget has certain properties set on them using something called as Q_PROPERTY. There are many q-properties that are defined on each widget already. You can also define custom qproperties in the native C++ code yourself too. What does it have to do with styling ? The thing is some of these properties can be altered using qt stylesheet. In Qt's terminology, these properties are called designable properties.

    For example:

    MyLabel {
      qproperty-alignment: AlignCenter;
    }
    MyGroupBox {
      qproperty-titlecolor: rgb(100, 200, 100);
    }
    QPushButton {
      qproperty-iconsize: 20px 20px;
    }

    You can discover these properties by following Qt's documentation or by running a simple google search like "center text in QLabel using stylesheet in Qt". These are advanced properties and in practice will come in use rarely but its good to know.

    More details : https://doc.qt.io/qt-5/stylesheet-syntax.html#setting-qobject-properties

    In this section, we mostly covered the paint properties in the NodeGui stylesheet. The next section would cover on how you can use flex to layout your widgets with stylesheet.

    - + - + @@ -41,7 +41,7 @@ Some examples include:

    
 
-
+
 
 
 
diff --git a/docs/guides/tutorial/index.html b/docs/guides/tutorial/index.html
index df4e0e9c2..bbc8bb755 100644
--- a/docs/guides/tutorial/index.html
+++ b/docs/guides/tutorial/index.html
@@ -3,7 +3,7 @@
 
 
 
-
+
 
 Learn the Basics
 
@@ -34,9 +34,9 @@ You can take a look at the list of native widgets that NodeGui currently support
 With time more widgets and APIs will be added to NodeGui. Apart from modules in NodeGui, you also have access to the entire node modules ecosystem. Thus, any node module that you can use with Node.js, can be used with NodeGui. This makes it extremely powerful.
    Fine, I want something more custom and beautiful than just native looking widgets. What do I do?
    To make things more beautiful, you will have to learn about styling. Lets take a look at that next.
    
 
 
-
+
 
-
+
 
 
 
@@ -46,7 +46,7 @@ With time more widgets and APIs will be added to NodeGui. Apart from modules in
 
 
 
-
+
 
 
 
diff --git a/docs/guides/using-native-node-modules/index.html b/docs/guides/using-native-node-modules/index.html
index a219723cd..6049a0b1c 100644
--- a/docs/guides/using-native-node-modules/index.html
+++ b/docs/guides/using-native-node-modules/index.html
@@ -3,7 +3,7 @@
 
 
 
-
+
 
 Using native Node Modules
 
@@ -39,9 +39,9 @@ happen. So in general, it is recommended to always build native modules from
 source code.
    
 
 
-
+
 
-
+
 
 
 
@@ -51,7 +51,7 @@ source code.
    
 
-
+
 
 
 
diff --git a/docs/mdx/index.html b/docs/mdx/index.html
index 053bb2f2a..c1e4e5a0d 100644
--- a/docs/mdx/index.html
+++ b/docs/mdx/index.html
@@ -3,7 +3,7 @@
 
 
 
-
+
 
 Powered by MDX
 
@@ -28,9 +28,9 @@
 
    Powered by MDX
    You can write JSX and use React components within your Markdown thanks to MDX.
    Docusaurus green and Facebook blue are my favorite colors.
    I can write Markdown alongside my JSX!
    
 
    
 
-
+
 
-
+
 
 
 
@@ -40,13 +40,13 @@
 
 
 
-
+
 
 
 
-
+
 
-
+
 
 
 
\ No newline at end of file
diff --git a/docsMetadata---docs-150-2d6.a4a03dc8ae50b1fa60b5.js b/docsMetadata---docs-150-2d6.6e875209659be13f2970.js
similarity index 96%
rename from docsMetadata---docs-150-2d6.a4a03dc8ae50b1fa60b5.js
rename to docsMetadata---docs-150-2d6.6e875209659be13f2970.js
index 6736ff6a3..822b6bc22 100644
--- a/docsMetadata---docs-150-2d6.a4a03dc8ae50b1fa60b5.js
+++ b/docsMetadata---docs-150-2d6.6e875209659be13f2970.js
@@ -1 +1 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[66],{42:function(e){e.exports=JSON.parse('{"docs":{"doc1":{"id":"doc1","title":"Style Guide","sidebar_label":"Style Guide","description":"You can write content using [GitHub-flavored Markdown syntax](https://github.github.com/gfm/).","source":"@site/docs/doc1.md","permalink":"/docs/doc1"},"faq":{"title":"FAQ","sidebar_label":"FAQ","id":"faq","description":"## Why am I having trouble installing Qode?","source":"@site/docs/faq.md","permalink":"/docs/faq"},"api/Component":{"sidebar_label":"Component","title":"Component","id":"api/Component","description":"> Abstract class that is root most base class for all widgets and layouts in the NodeGui World.","source":"@site/docs/api/Component.md","permalink":"/docs/api/Component","sidebar":"api","category":"Internal Modules","next":"api/EventWidget","previous":"api/QtEnums","previous_title":"Qt Enums","next_title":"EventWidget"},"mdx":{"id":"mdx","title":"Powered by MDX","description":"You can write JSX and use React components within your Markdown thanks to [MDX](https://mdxjs.com/).","source":"@site/docs/mdx.md","permalink":"/docs/mdx"},"api/EventWidget":{"sidebar_label":"EventWidget","title":"EventWidget","id":"api/EventWidget","description":"> Abstract class that adds event handling support to all widgets.","source":"@site/docs/api/EventWidget.md","permalink":"/docs/api/EventWidget","sidebar":"api","category":"Internal Modules","next":"api/NodeLayout","previous":"api/Component","previous_title":"Component","next_title":"NodeLayout"},"api/FlexLayout":{"sidebar_label":"FlexLayout","title":"FlexLayout","id":"api/FlexLayout","description":"> Custom layout to help layout child widgets using flex layout.","source":"@site/docs/api/FlexLayout.md","permalink":"/docs/api/FlexLayout","sidebar":"api","category":"Layouts","next":"api/QGridLayout","previous":"api/QWidget","previous_title":"QWidget","next_title":"QGridLayout"},"api/NodeLayout":{"sidebar_label":"NodeLayout","title":"NodeLayout","id":"api/NodeLayout","description":"> Abstract class to add functionalities common to all Layout.","source":"@site/docs/api/NodeLayout.md","permalink":"/docs/api/NodeLayout","sidebar":"api","category":"Internal Modules","next":"api/NodeWidget","previous":"api/EventWidget","previous_title":"EventWidget","next_title":"NodeWidget"},"api/NodeWidget":{"sidebar_label":"NodeWidget","title":"NodeWidget","id":"api/NodeWidget","description":"> Abstract class to add functionalities common to all Widgets.","source":"@site/docs/api/NodeWidget.md","permalink":"/docs/api/NodeWidget","sidebar":"api","category":"Internal Modules","next":"api/YogaWidget","previous":"api/NodeLayout","previous_title":"NodeLayout","next_title":"YogaWidget"},"api/QAbstractScrollArea":{"sidebar_label":"QAbstractScrollArea","title":"QAbstractScrollArea","id":"api/QAbstractScrollArea","description":"> Abstract class to add functionalities common to all scrollarea based widgets.","source":"@site/docs/api/QAbstractScrollArea.md","permalink":"/docs/api/QAbstractScrollArea","sidebar":"api","category":"Internal Modules","next":"api/QAbstractSlider","previous":"api/YogaWidget","previous_title":"YogaWidget","next_title":"QAbstractSlider"},"api/QAbstractSlider":{"sidebar_label":"QAbstractSlider","title":"QAbstractSlider","id":"api/QAbstractSlider","description":"> Abstract class to add functionalities common to all slider based widgets.","source":"@site/docs/api/QAbstractSlider.md","permalink":"/docs/api/QAbstractSlider","sidebar":"api","category":"Internal Modules","next":"api/process","previous":"api/QAbstractScrollArea","previous_title":"QAbstractScrollArea","next_title":"process"},"api/QApplication":{"sidebar_label":"QApplication","title":"QApplication","id":"api/QApplication","description":"> QApplication is the root object for the entire application. It manages app level settings.","source":"@site/docs/api/QApplication.md","permalink":"/docs/api/QApplication","sidebar":"api","category":"Widgets","next":"api/QCheckBox","previous":"api/synopsis","previous_title":"Synopsis","next_title":"QCheckBox"},"api/QCheckBox":{"sidebar_label":"QCheckBox","title":"QCheckBox","id":"api/QCheckBox","description":"> Create and control checkbox.","source":"@site/docs/api/QCheckBox.md","permalink":"/docs/api/QCheckBox","sidebar":"api","category":"Widgets","next":"api/QDial","previous":"api/QApplication","previous_title":"QApplication","next_title":"QDial"},"api/QClipboard":{"sidebar_label":"QClipboard","title":"QClipboard","id":"api/QClipboard","description":"> The QClipboard class provides access to the window system clipboard.","source":"@site/docs/api/QClipboard.md","permalink":"/docs/api/QClipboard","sidebar":"api","category":"Modules","next":"api/QCursor","previous":"api/QGridLayout","previous_title":"QGridLayout","next_title":"QCursor"},"api/QCursor":{"sidebar_label":"QCursor","title":"QCursor","id":"api/QCursor","description":"> The QCursor class provides scalable icons in different modes and states.","source":"@site/docs/api/QCursor.md","permalink":"/docs/api/QCursor","sidebar":"api","category":"Modules","next":"api/QPixmap","previous":"api/QClipboard","previous_title":"QClipboard","next_title":"QPixmap"},"api/QDial":{"sidebar_label":"QDial","title":"QDial","id":"api/QDial","description":"> Create and control dial slider widgets.","source":"@site/docs/api/QDial.md","permalink":"/docs/api/QDial","sidebar":"api","category":"Widgets","next":"api/QIcon","previous":"api/QCheckBox","previous_title":"QCheckBox","next_title":"QIcon"},"api/QGridLayout":{"sidebar_label":"QGridLayout","title":"QGridLayout","id":"api/QGridLayout","description":"> The QGridLayout class lays out widgets in a grid.","source":"@site/docs/api/QGridLayout.md","permalink":"/docs/api/QGridLayout","sidebar":"api","category":"Layouts","next":"api/QClipboard","previous":"api/FlexLayout","previous_title":"FlexLayout","next_title":"QClipboard"},"api/QIcon":{"sidebar_label":"QIcon","title":"QIcon","id":"api/QIcon","description":"> The QIcon class provides scalable icons in different modes and states.","source":"@site/docs/api/QIcon.md","permalink":"/docs/api/QIcon","sidebar":"api","category":"Widgets","next":"api/QLabel","previous":"api/QDial","previous_title":"QDial","next_title":"QLabel"},"api/QLabel":{"sidebar_label":"QLabel","title":"QLabel","id":"api/QLabel","description":"> Create and control text.","source":"@site/docs/api/QLabel.md","permalink":"/docs/api/QLabel","sidebar":"api","category":"Widgets","next":"api/QLineEdit","previous":"api/QIcon","previous_title":"QIcon","next_title":"QLineEdit"},"api/QLineEdit":{"sidebar_label":"QLineEdit","title":"QLineEdit","id":"api/QLineEdit","description":"> Create and control editable text field.","source":"@site/docs/api/QLineEdit.md","permalink":"/docs/api/QLineEdit","sidebar":"api","category":"Widgets","next":"api/QMainWindow","previous":"api/QLabel","previous_title":"QLabel","next_title":"QMainWindow"},"api/QMainWindow":{"sidebar_label":"QMainWindow","title":"QMainWindow","id":"api/QMainWindow","description":"> Create and control windows.","source":"@site/docs/api/QMainWindow.md","permalink":"/docs/api/QMainWindow","sidebar":"api","category":"Widgets","next":"api/QPlainTextEdit","previous":"api/QLineEdit","previous_title":"QLineEdit","next_title":"QPlainTextEdit"},"api/QPixmap":{"sidebar_label":"QPixmap","title":"QPixmap","id":"api/QPixmap","description":"> The QPixmap class helps hold an image in the form of off-screen image representation.","source":"@site/docs/api/QPixmap.md","permalink":"/docs/api/QPixmap","sidebar":"api","category":"Modules","next":"api/QtEnums","previous":"api/QCursor","previous_title":"QCursor","next_title":"Qt Enums"},"api/QPlainTextEdit":{"sidebar_label":"QPlainTextEdit","title":"QPlainTextEdit","id":"api/QPlainTextEdit","description":"> Used to edit and display plain text.","source":"@site/docs/api/QPlainTextEdit.md","permalink":"/docs/api/QPlainTextEdit","sidebar":"api","category":"Widgets","next":"api/QProgressBar","previous":"api/QMainWindow","previous_title":"QMainWindow","next_title":"QProgressBar"},"api/QProgressBar":{"sidebar_label":"QProgressBar","title":"QProgressBar","id":"api/QProgressBar","description":"> Create and control progress bar widgets.","source":"@site/docs/api/QProgressBar.md","permalink":"/docs/api/QProgressBar","sidebar":"api","category":"Widgets","next":"api/QPushButton","previous":"api/QPlainTextEdit","previous_title":"QPlainTextEdit","next_title":"QPushButton"},"api/QPushButton":{"sidebar_label":"QPushButton","title":"QPushButton","id":"api/QPushButton","description":"> Create and control buttons.","source":"@site/docs/api/QPushButton.md","permalink":"/docs/api/QPushButton","sidebar":"api","category":"Widgets","next":"api/QRadioButton","previous":"api/QProgressBar","previous_title":"QProgressBar","next_title":"QRadioButton"},"api/QRadioButton":{"sidebar_label":"QRadioButton","title":"QRadioButton","id":"api/QRadioButton","description":"> Create and control radio button.","source":"@site/docs/api/QRadioButton.md","permalink":"/docs/api/QRadioButton","sidebar":"api","category":"Widgets","next":"api/QScrollArea","previous":"api/QPushButton","previous_title":"QPushButton","next_title":"QScrollArea"},"api/QScrollArea":{"sidebar_label":"QScrollArea","title":"QScrollArea","id":"api/QScrollArea","description":"> A `QScrollArea` provides a scrolling view onto another widget.","source":"@site/docs/api/QScrollArea.md","permalink":"/docs/api/QScrollArea","sidebar":"api","category":"Widgets","next":"api/QSpinBox","previous":"api/QRadioButton","previous_title":"QRadioButton","next_title":"QSpinBox"},"api/QSpinBox":{"sidebar_label":"QSpinBox","title":"QSpinBox","id":"api/QSpinBox","description":"> Create and control spin box widgets.","source":"@site/docs/api/QSpinBox.md","permalink":"/docs/api/QSpinBox","sidebar":"api","category":"Widgets","next":"api/QTabWidget","previous":"api/QScrollArea","previous_title":"QScrollArea","next_title":"QTabWidget"},"api/QTabWidget":{"sidebar_label":"QTabWidget","title":"QTabWidget","id":"api/QTabWidget","description":"Will be available from NodeGUI v0.1.10 and up","source":"@site/docs/api/QTabWidget.md","permalink":"/docs/api/QTabWidget","sidebar":"api","category":"Widgets","next":"api/QWidget","previous":"api/QSpinBox","previous_title":"QSpinBox","next_title":"QWidget"},"api/QWidget":{"sidebar_label":"QWidget","title":"QWidget","id":"api/QWidget","description":"> Create and control views.","source":"@site/docs/api/QWidget.md","permalink":"/docs/api/QWidget","sidebar":"api","category":"Widgets","next":"api/FlexLayout","previous":"api/QTabWidget","previous_title":"QTabWidget","next_title":"FlexLayout"},"api/QtEnums":{"sidebar_label":"Qt Enums","title":"Qt Enums","id":"api/QtEnums","description":"## Enums from Qt","source":"@site/docs/api/QtEnums.md","permalink":"/docs/api/QtEnums","sidebar":"api","category":"Modules","next":"api/Component","previous":"api/QPixmap","previous_title":"QPixmap","next_title":"Component"},"api/YogaWidget":{"sidebar_label":"YogaWidget","title":"YogaWidget","id":"api/YogaWidget","description":"> Abstract class to add common functionality related to Flex layout to all Widgets.","source":"@site/docs/api/YogaWidget.md","permalink":"/docs/api/YogaWidget","sidebar":"api","category":"Internal Modules","next":"api/QAbstractScrollArea","previous":"api/NodeWidget","previous_title":"NodeWidget","next_title":"QAbstractScrollArea"},"api/process":{"sidebar_label":"process","title":"process","id":"api/process","description":"> Extensions to process object.","source":"@site/docs/api/process.md","permalink":"/docs/api/process","sidebar":"api","category":"APIs","previous":"api/QAbstractSlider","previous_title":"QAbstractSlider"},"api/synopsis":{"sidebar_label":"Synopsis","title":"Synopsis","id":"api/synopsis","description":"> How to use Node.js and NodeGui\'s APIs.","source":"@site/docs/api/synopsis.md","permalink":"/docs/api/synopsis","sidebar":"api","category":"General","next":"api/QApplication","next_title":"QApplication"},"development/README":{"id":"development/README","title":"README","description":"# Contributor\'s guide","source":"@site/docs/development/README.md","permalink":"/docs/development/README"},"development/common_errors":{"id":"development/common_errors","title":"common_errors","description":"# Common errors","source":"@site/docs/development/common_errors.md","permalink":"/docs/development/common_errors"},"development/debugging":{"id":"development/debugging","title":"debugging","description":"# debugging","source":"@site/docs/development/debugging.md","permalink":"/docs/development/debugging"},"development/getting-started":{"id":"development/getting-started","title":"getting-started","description":"## Getting started","source":"@site/docs/development/getting-started.md","permalink":"/docs/development/getting-started"},"development/setting-up":{"id":"development/setting-up","title":"setting-up","description":"# Setup project for development","source":"@site/docs/development/setting-up.md","permalink":"/docs/development/setting-up"},"development/signal_and_event_handling":{"id":"development/signal_and_event_handling","title":"signal_and_event_handling","description":"# Event handling","source":"@site/docs/development/signal_and_event_handling.md","permalink":"/docs/development/signal_and_event_handling"},"development/styling":{"id":"development/styling","title":"styling","description":"# How styling works?","source":"@site/docs/development/styling.md","permalink":"/docs/development/styling"},"development/wrapping_widgets":{"id":"development/wrapping_widgets","title":"wrapping_widgets","description":"# Exporting a new method from a widget","source":"@site/docs/development/wrapping_widgets.md","permalink":"/docs/development/wrapping_widgets"},"guides/custom-nodegui-native-plugin":{"sidebar_label":"Custom NodeGui Plugin","title":"Custom NodeGui Plugin","id":"guides/custom-nodegui-native-plugin","description":"WIP","source":"@site/docs/guides/custom-nodegui-native-plugin.md","permalink":"/docs/guides/custom-nodegui-native-plugin","sidebar":"guides","category":"Guides","previous":"guides/using-native-node-modules","previous_title":"Using native Node Modules"},"guides/debugging-in-vscode":{"sidebar_label":"Debugging in VSCode","title":"Debugging in VSCode","id":"guides/debugging-in-vscode","description":"- **Open a NodeGui project in VSCode.**","source":"@site/docs/guides/debugging-in-vscode.md","permalink":"/docs/guides/debugging-in-vscode","sidebar":"guides","category":"Guides","next":"guides/using-native-node-modules","previous":"guides/debugging","previous_title":"Debugging","next_title":"Using native Node Modules"},"guides/debugging":{"sidebar_label":"Debugging","title":"Debugging","id":"guides/debugging","description":"## Application Debugging","source":"@site/docs/guides/debugging.md","permalink":"/docs/guides/debugging","sidebar":"guides","category":"Guides","next":"guides/debugging-in-vscode","previous":"guides/nodegui-architecture","previous_title":"Architecture","next_title":"Debugging in VSCode"},"guides/getting-started":{"sidebar_label":"Getting started","title":"Getting started","id":"guides/getting-started","description":"NodeGui enables you to create desktop applications with JavaScript. You could see it","source":"@site/docs/guides/getting-started.md","permalink":"/docs/guides/getting-started","sidebar":"guides","category":"The Basics","next":"guides/tutorial","next_title":"Learn the Basics"},"guides/handle-events":{"sidebar_label":"Handle Events","title":"Handle Events","id":"guides/handle-events","description":"WIP","source":"@site/docs/guides/handle-events.md","permalink":"/docs/guides/handle-events","sidebar":"guides","category":"The Basics","next":"guides/scroll-view","previous":"guides/layout","previous_title":"Layout","next_title":"Scroll View"},"guides/images":{"sidebar_label":"Images","title":"Images","id":"guides/images","description":"WIP","source":"@site/docs/guides/images.md","permalink":"/docs/guides/images","sidebar":"guides","category":"The Basics","next":"guides/networking","previous":"guides/scroll-view","previous_title":"Scroll View","next_title":"Networking"},"guides/layout":{"sidebar_label":"Layout","title":"Layout","id":"guides/layout","description":"NodeGui uses a layout system to automatically arranging child widgets within a widget to ensure that they make good use of the available space.","source":"@site/docs/guides/layout.md","permalink":"/docs/guides/layout","sidebar":"guides","category":"The Basics","next":"guides/handle-events","previous":"guides/styling","previous_title":"Styling","next_title":"Handle Events"},"guides/networking":{"sidebar_label":"Networking","title":"Networking","id":"guides/networking","description":"WIP","source":"@site/docs/guides/networking.md","permalink":"/docs/guides/networking","sidebar":"guides","category":"The Basics","next":"guides/nodegui-architecture","previous":"guides/images","previous_title":"Images","next_title":"Architecture"},"guides/nodegui-architecture":{"sidebar_label":"Architecture","title":"Architecture","id":"guides/nodegui-architecture","description":"By looking at how NodeGui works internally, we would get a clear picture on why the APIs are designed the way they are.","source":"@site/docs/guides/nodegui-architecture.md","permalink":"/docs/guides/nodegui-architecture","sidebar":"guides","category":"Guides","next":"guides/debugging","previous":"guides/networking","previous_title":"Networking","next_title":"Debugging"},"guides/scroll-view":{"sidebar_label":"Scroll View","title":"Scroll View","id":"guides/scroll-view","description":"WIP","source":"@site/docs/guides/scroll-view.md","permalink":"/docs/guides/scroll-view","sidebar":"guides","category":"The Basics","next":"guides/images","previous":"guides/handle-events","previous_title":"Handle Events","next_title":"Images"},"guides/styling":{"sidebar_label":"Styling","title":"Styling","id":"guides/styling","description":"With NodeGui, you can style a widget to your needs. If you are familiar with CSS in the web world you would feel right at home. All widgets have a method `setInlineStyle` for setting inline styles for the respective widget. The style names and values usually match how CSS works on the web.","source":"@site/docs/guides/styling.md","permalink":"/docs/guides/styling","sidebar":"guides","category":"The Basics","next":"guides/layout","previous":"guides/tutorial","previous_title":"Learn the Basics","next_title":"Layout"},"guides/tutorial":{"sidebar_label":"Learn the Basics","title":"Learn the Basics","id":"guides/tutorial","description":"NodeGui uses native components instead of web based components as building blocks. So to understand the basic structure of a NodeGui app, you need to be familiar with Javascript or Typescript. This tutorial is aimed at everyone who has some web experience with web development.","source":"@site/docs/guides/tutorial.md","permalink":"/docs/guides/tutorial","sidebar":"guides","category":"The Basics","next":"guides/styling","previous":"guides/getting-started","previous_title":"Getting started","next_title":"Styling"},"guides/using-native-node-modules":{"sidebar_label":"Native Node Modules","title":"Using native Node Modules","id":"guides/using-native-node-modules","description":"Native Node modules are supported by NodeGui, but since NodeGui is very","source":"@site/docs/guides/using-native-node-modules.md","permalink":"/docs/guides/using-native-node-modules","sidebar":"guides","category":"Guides","next":"guides/custom-nodegui-native-plugin","previous":"guides/debugging-in-vscode","previous_title":"Debugging in VSCode","next_title":"Custom NodeGui Plugin"}},"docsDir":"/Users/atulr/Project/nodegui/nodegui/website/docs","docsSidebars":{"api":[{"type":"category","label":"General","items":[{"type":"doc","id":"api/synopsis"}]},{"type":"category","label":"Widgets","items":[{"type":"doc","id":"api/QApplication"},{"type":"doc","id":"api/QCheckBox"},{"type":"doc","id":"api/QDial"},{"type":"doc","id":"api/QIcon"},{"type":"doc","id":"api/QLabel"},{"type":"doc","id":"api/QLineEdit"},{"type":"doc","id":"api/QMainWindow"},{"type":"doc","id":"api/QPlainTextEdit"},{"type":"doc","id":"api/QProgressBar"},{"type":"doc","id":"api/QPushButton"},{"type":"doc","id":"api/QRadioButton"},{"type":"doc","id":"api/QScrollArea"},{"type":"doc","id":"api/QSpinBox"},{"type":"doc","id":"api/QTabWidget"},{"type":"doc","id":"api/QWidget"}]},{"type":"category","label":"Layouts","items":[{"type":"doc","id":"api/FlexLayout"},{"type":"doc","id":"api/QGridLayout"}]},{"type":"category","label":"Modules","items":[{"type":"doc","id":"api/QClipboard"},{"type":"doc","id":"api/QCursor"},{"type":"doc","id":"api/QPixmap"},{"type":"doc","id":"api/QtEnums"}]},{"type":"category","label":"Internal Modules","items":[{"type":"doc","id":"api/Component"},{"type":"doc","id":"api/EventWidget"},{"type":"doc","id":"api/NodeLayout"},{"type":"doc","id":"api/NodeWidget"},{"type":"doc","id":"api/YogaWidget"},{"type":"doc","id":"api/QAbstractScrollArea"},{"type":"doc","id":"api/QAbstractSlider"}]},{"type":"category","label":"APIs","items":[{"type":"doc","id":"api/process"}]}],"guides":[{"type":"category","label":"The Basics","items":[{"type":"doc","id":"guides/getting-started"},{"type":"doc","id":"guides/tutorial"},{"type":"doc","id":"guides/styling"},{"type":"doc","id":"guides/layout"},{"type":"doc","id":"guides/handle-events"},{"type":"doc","id":"guides/scroll-view"},{"type":"doc","id":"guides/images"},{"type":"doc","id":"guides/networking"}]},{"type":"category","label":"Guides","items":[{"type":"doc","id":"guides/nodegui-architecture"},{"type":"doc","id":"guides/debugging"},{"type":"doc","id":"guides/debugging-in-vscode"},{"type":"doc","id":"guides/using-native-node-modules"},{"type":"doc","id":"guides/custom-nodegui-native-plugin"}]}]},"sourceToPermalink":{"@site/docs/doc1.md":"/docs/doc1","@site/docs/faq.md":"/docs/faq","@site/docs/api/Component.md":"/docs/api/Component","@site/docs/mdx.md":"/docs/mdx","@site/docs/api/EventWidget.md":"/docs/api/EventWidget","@site/docs/api/FlexLayout.md":"/docs/api/FlexLayout","@site/docs/api/NodeLayout.md":"/docs/api/NodeLayout","@site/docs/api/NodeWidget.md":"/docs/api/NodeWidget","@site/docs/api/QAbstractScrollArea.md":"/docs/api/QAbstractScrollArea","@site/docs/api/QAbstractSlider.md":"/docs/api/QAbstractSlider","@site/docs/api/QApplication.md":"/docs/api/QApplication","@site/docs/api/QCheckBox.md":"/docs/api/QCheckBox","@site/docs/api/QClipboard.md":"/docs/api/QClipboard","@site/docs/api/QCursor.md":"/docs/api/QCursor","@site/docs/api/QDial.md":"/docs/api/QDial","@site/docs/api/QGridLayout.md":"/docs/api/QGridLayout","@site/docs/api/QIcon.md":"/docs/api/QIcon","@site/docs/api/QLabel.md":"/docs/api/QLabel","@site/docs/api/QLineEdit.md":"/docs/api/QLineEdit","@site/docs/api/QMainWindow.md":"/docs/api/QMainWindow","@site/docs/api/QPixmap.md":"/docs/api/QPixmap","@site/docs/api/QPlainTextEdit.md":"/docs/api/QPlainTextEdit","@site/docs/api/QProgressBar.md":"/docs/api/QProgressBar","@site/docs/api/QPushButton.md":"/docs/api/QPushButton","@site/docs/api/QRadioButton.md":"/docs/api/QRadioButton","@site/docs/api/QScrollArea.md":"/docs/api/QScrollArea","@site/docs/api/QSpinBox.md":"/docs/api/QSpinBox","@site/docs/api/QTabWidget.md":"/docs/api/QTabWidget","@site/docs/api/QWidget.md":"/docs/api/QWidget","@site/docs/api/QtEnums.md":"/docs/api/QtEnums","@site/docs/api/YogaWidget.md":"/docs/api/YogaWidget","@site/docs/api/process.md":"/docs/api/process","@site/docs/api/synopsis.md":"/docs/api/synopsis","@site/docs/development/README.md":"/docs/development/README","@site/docs/development/common_errors.md":"/docs/development/common_errors","@site/docs/development/debugging.md":"/docs/development/debugging","@site/docs/development/getting-started.md":"/docs/development/getting-started","@site/docs/development/setting-up.md":"/docs/development/setting-up","@site/docs/development/signal_and_event_handling.md":"/docs/development/signal_and_event_handling","@site/docs/development/styling.md":"/docs/development/styling","@site/docs/development/wrapping_widgets.md":"/docs/development/wrapping_widgets","@site/docs/guides/custom-nodegui-native-plugin.md":"/docs/guides/custom-nodegui-native-plugin","@site/docs/guides/debugging-in-vscode.md":"/docs/guides/debugging-in-vscode","@site/docs/guides/debugging.md":"/docs/guides/debugging","@site/docs/guides/getting-started.md":"/docs/guides/getting-started","@site/docs/guides/handle-events.md":"/docs/guides/handle-events","@site/docs/guides/images.md":"/docs/guides/images","@site/docs/guides/layout.md":"/docs/guides/layout","@site/docs/guides/networking.md":"/docs/guides/networking","@site/docs/guides/nodegui-architecture.md":"/docs/guides/nodegui-architecture","@site/docs/guides/scroll-view.md":"/docs/guides/scroll-view","@site/docs/guides/styling.md":"/docs/guides/styling","@site/docs/guides/tutorial.md":"/docs/guides/tutorial","@site/docs/guides/using-native-node-modules.md":"/docs/guides/using-native-node-modules"},"permalinkToId":{"/docs/doc1":"doc1","/docs/faq":"faq","/docs/api/Component":"api/Component","/docs/mdx":"mdx","/docs/api/EventWidget":"api/EventWidget","/docs/api/FlexLayout":"api/FlexLayout","/docs/api/NodeLayout":"api/NodeLayout","/docs/api/NodeWidget":"api/NodeWidget","/docs/api/QAbstractScrollArea":"api/QAbstractScrollArea","/docs/api/QAbstractSlider":"api/QAbstractSlider","/docs/api/QApplication":"api/QApplication","/docs/api/QCheckBox":"api/QCheckBox","/docs/api/QClipboard":"api/QClipboard","/docs/api/QCursor":"api/QCursor","/docs/api/QDial":"api/QDial","/docs/api/QGridLayout":"api/QGridLayout","/docs/api/QIcon":"api/QIcon","/docs/api/QLabel":"api/QLabel","/docs/api/QLineEdit":"api/QLineEdit","/docs/api/QMainWindow":"api/QMainWindow","/docs/api/QPixmap":"api/QPixmap","/docs/api/QPlainTextEdit":"api/QPlainTextEdit","/docs/api/QProgressBar":"api/QProgressBar","/docs/api/QPushButton":"api/QPushButton","/docs/api/QRadioButton":"api/QRadioButton","/docs/api/QScrollArea":"api/QScrollArea","/docs/api/QSpinBox":"api/QSpinBox","/docs/api/QTabWidget":"api/QTabWidget","/docs/api/QWidget":"api/QWidget","/docs/api/QtEnums":"api/QtEnums","/docs/api/YogaWidget":"api/YogaWidget","/docs/api/process":"api/process","/docs/api/synopsis":"api/synopsis","/docs/development/README":"development/README","/docs/development/common_errors":"development/common_errors","/docs/development/debugging":"development/debugging","/docs/development/getting-started":"development/getting-started","/docs/development/setting-up":"development/setting-up","/docs/development/signal_and_event_handling":"development/signal_and_event_handling","/docs/development/styling":"development/styling","/docs/development/wrapping_widgets":"development/wrapping_widgets","/docs/guides/custom-nodegui-native-plugin":"guides/custom-nodegui-native-plugin","/docs/guides/debugging-in-vscode":"guides/debugging-in-vscode","/docs/guides/debugging":"guides/debugging","/docs/guides/getting-started":"guides/getting-started","/docs/guides/handle-events":"guides/handle-events","/docs/guides/images":"guides/images","/docs/guides/layout":"guides/layout","/docs/guides/networking":"guides/networking","/docs/guides/nodegui-architecture":"guides/nodegui-architecture","/docs/guides/scroll-view":"guides/scroll-view","/docs/guides/styling":"guides/styling","/docs/guides/tutorial":"guides/tutorial","/docs/guides/using-native-node-modules":"guides/using-native-node-modules"}}')}}]);
\ No newline at end of file
+(window.webpackJsonp=window.webpackJsonp||[]).push([[66],{42:function(e){e.exports=JSON.parse('{"docs":{"doc1":{"id":"doc1","title":"Style Guide","sidebar_label":"Style Guide","description":"You can write content using [GitHub-flavored Markdown syntax](https://github.github.com/gfm/).","source":"@site/docs/doc1.md","permalink":"/docs/doc1"},"faq":{"title":"FAQ","sidebar_label":"FAQ","id":"faq","description":"## Why am I having trouble installing Qode?","source":"@site/docs/faq.md","permalink":"/docs/faq"},"mdx":{"id":"mdx","title":"Powered by MDX","description":"You can write JSX and use React components within your Markdown thanks to [MDX](https://mdxjs.com/).","source":"@site/docs/mdx.md","permalink":"/docs/mdx"},"api/Component":{"sidebar_label":"Component","title":"Component","id":"api/Component","description":"> Abstract class that is root most base class for all widgets and layouts in the NodeGui World.","source":"@site/docs/api/Component.md","permalink":"/docs/api/Component","sidebar":"api","category":"Internal Modules","next":"api/EventWidget","previous":"api/QtEnums","previous_title":"Qt Enums","next_title":"EventWidget"},"api/EventWidget":{"sidebar_label":"EventWidget","title":"EventWidget","id":"api/EventWidget","description":"> Abstract class that adds event handling support to all widgets.","source":"@site/docs/api/EventWidget.md","permalink":"/docs/api/EventWidget","sidebar":"api","category":"Internal Modules","next":"api/NodeLayout","previous":"api/Component","previous_title":"Component","next_title":"NodeLayout"},"api/FlexLayout":{"sidebar_label":"FlexLayout","title":"FlexLayout","id":"api/FlexLayout","description":"> Custom layout to help layout child widgets using flex layout.","source":"@site/docs/api/FlexLayout.md","permalink":"/docs/api/FlexLayout","sidebar":"api","category":"Layouts","next":"api/QGridLayout","previous":"api/QWidget","previous_title":"QWidget","next_title":"QGridLayout"},"api/NodeLayout":{"sidebar_label":"NodeLayout","title":"NodeLayout","id":"api/NodeLayout","description":"> Abstract class to add functionalities common to all Layout.","source":"@site/docs/api/NodeLayout.md","permalink":"/docs/api/NodeLayout","sidebar":"api","category":"Internal Modules","next":"api/NodeWidget","previous":"api/EventWidget","previous_title":"EventWidget","next_title":"NodeWidget"},"api/NodeWidget":{"sidebar_label":"NodeWidget","title":"NodeWidget","id":"api/NodeWidget","description":"> Abstract class to add functionalities common to all Widgets.","source":"@site/docs/api/NodeWidget.md","permalink":"/docs/api/NodeWidget","sidebar":"api","category":"Internal Modules","next":"api/YogaWidget","previous":"api/NodeLayout","previous_title":"NodeLayout","next_title":"YogaWidget"},"api/QAbstractScrollArea":{"sidebar_label":"QAbstractScrollArea","title":"QAbstractScrollArea","id":"api/QAbstractScrollArea","description":"> Abstract class to add functionalities common to all scrollarea based widgets.","source":"@site/docs/api/QAbstractScrollArea.md","permalink":"/docs/api/QAbstractScrollArea","sidebar":"api","category":"Internal Modules","next":"api/QAbstractSlider","previous":"api/YogaWidget","previous_title":"YogaWidget","next_title":"QAbstractSlider"},"api/QAbstractSlider":{"sidebar_label":"QAbstractSlider","title":"QAbstractSlider","id":"api/QAbstractSlider","description":"> Abstract class to add functionalities common to all slider based widgets.","source":"@site/docs/api/QAbstractSlider.md","permalink":"/docs/api/QAbstractSlider","sidebar":"api","category":"Internal Modules","next":"api/process","previous":"api/QAbstractScrollArea","previous_title":"QAbstractScrollArea","next_title":"process"},"api/QApplication":{"sidebar_label":"QApplication","title":"QApplication","id":"api/QApplication","description":"> QApplication is the root object for the entire application. It manages app level settings.","source":"@site/docs/api/QApplication.md","permalink":"/docs/api/QApplication","sidebar":"api","category":"Widgets","next":"api/QCheckBox","previous":"api/synopsis","previous_title":"Synopsis","next_title":"QCheckBox"},"api/QCheckBox":{"sidebar_label":"QCheckBox","title":"QCheckBox","id":"api/QCheckBox","description":"> Create and control checkbox.","source":"@site/docs/api/QCheckBox.md","permalink":"/docs/api/QCheckBox","sidebar":"api","category":"Widgets","next":"api/QDial","previous":"api/QApplication","previous_title":"QApplication","next_title":"QDial"},"api/QClipboard":{"sidebar_label":"QClipboard","title":"QClipboard","id":"api/QClipboard","description":"> The QClipboard class provides access to the window system clipboard.","source":"@site/docs/api/QClipboard.md","permalink":"/docs/api/QClipboard","sidebar":"api","category":"Modules","next":"api/QCursor","previous":"api/QGridLayout","previous_title":"QGridLayout","next_title":"QCursor"},"api/QCursor":{"sidebar_label":"QCursor","title":"QCursor","id":"api/QCursor","description":"> The QCursor class provides scalable icons in different modes and states.","source":"@site/docs/api/QCursor.md","permalink":"/docs/api/QCursor","sidebar":"api","category":"Modules","next":"api/QPixmap","previous":"api/QClipboard","previous_title":"QClipboard","next_title":"QPixmap"},"api/QDial":{"sidebar_label":"QDial","title":"QDial","id":"api/QDial","description":"> Create and control dial slider widgets.","source":"@site/docs/api/QDial.md","permalink":"/docs/api/QDial","sidebar":"api","category":"Widgets","next":"api/QIcon","previous":"api/QCheckBox","previous_title":"QCheckBox","next_title":"QIcon"},"api/QGridLayout":{"sidebar_label":"QGridLayout","title":"QGridLayout","id":"api/QGridLayout","description":"> The QGridLayout class lays out widgets in a grid.","source":"@site/docs/api/QGridLayout.md","permalink":"/docs/api/QGridLayout","sidebar":"api","category":"Layouts","next":"api/QClipboard","previous":"api/FlexLayout","previous_title":"FlexLayout","next_title":"QClipboard"},"api/QIcon":{"sidebar_label":"QIcon","title":"QIcon","id":"api/QIcon","description":"> The QIcon class provides scalable icons in different modes and states.","source":"@site/docs/api/QIcon.md","permalink":"/docs/api/QIcon","sidebar":"api","category":"Widgets","next":"api/QLabel","previous":"api/QDial","previous_title":"QDial","next_title":"QLabel"},"api/QLabel":{"sidebar_label":"QLabel","title":"QLabel","id":"api/QLabel","description":"> Create and control text.","source":"@site/docs/api/QLabel.md","permalink":"/docs/api/QLabel","sidebar":"api","category":"Widgets","next":"api/QLineEdit","previous":"api/QIcon","previous_title":"QIcon","next_title":"QLineEdit"},"api/QLineEdit":{"sidebar_label":"QLineEdit","title":"QLineEdit","id":"api/QLineEdit","description":"> Create and control editable text field.","source":"@site/docs/api/QLineEdit.md","permalink":"/docs/api/QLineEdit","sidebar":"api","category":"Widgets","next":"api/QMainWindow","previous":"api/QLabel","previous_title":"QLabel","next_title":"QMainWindow"},"api/QMainWindow":{"sidebar_label":"QMainWindow","title":"QMainWindow","id":"api/QMainWindow","description":"> Create and control windows.","source":"@site/docs/api/QMainWindow.md","permalink":"/docs/api/QMainWindow","sidebar":"api","category":"Widgets","next":"api/QPlainTextEdit","previous":"api/QLineEdit","previous_title":"QLineEdit","next_title":"QPlainTextEdit"},"api/QPixmap":{"sidebar_label":"QPixmap","title":"QPixmap","id":"api/QPixmap","description":"> The QPixmap class helps hold an image in the form of off-screen image representation.","source":"@site/docs/api/QPixmap.md","permalink":"/docs/api/QPixmap","sidebar":"api","category":"Modules","next":"api/QtEnums","previous":"api/QCursor","previous_title":"QCursor","next_title":"Qt Enums"},"api/QPlainTextEdit":{"sidebar_label":"QPlainTextEdit","title":"QPlainTextEdit","id":"api/QPlainTextEdit","description":"> Used to edit and display plain text.","source":"@site/docs/api/QPlainTextEdit.md","permalink":"/docs/api/QPlainTextEdit","sidebar":"api","category":"Widgets","next":"api/QProgressBar","previous":"api/QMainWindow","previous_title":"QMainWindow","next_title":"QProgressBar"},"api/QProgressBar":{"sidebar_label":"QProgressBar","title":"QProgressBar","id":"api/QProgressBar","description":"> Create and control progress bar widgets.","source":"@site/docs/api/QProgressBar.md","permalink":"/docs/api/QProgressBar","sidebar":"api","category":"Widgets","next":"api/QPushButton","previous":"api/QPlainTextEdit","previous_title":"QPlainTextEdit","next_title":"QPushButton"},"api/QPushButton":{"sidebar_label":"QPushButton","title":"QPushButton","id":"api/QPushButton","description":"> Create and control buttons.","source":"@site/docs/api/QPushButton.md","permalink":"/docs/api/QPushButton","sidebar":"api","category":"Widgets","next":"api/QRadioButton","previous":"api/QProgressBar","previous_title":"QProgressBar","next_title":"QRadioButton"},"api/QRadioButton":{"sidebar_label":"QRadioButton","title":"QRadioButton","id":"api/QRadioButton","description":"> Create and control radio button.","source":"@site/docs/api/QRadioButton.md","permalink":"/docs/api/QRadioButton","sidebar":"api","category":"Widgets","next":"api/QScrollArea","previous":"api/QPushButton","previous_title":"QPushButton","next_title":"QScrollArea"},"api/QScrollArea":{"sidebar_label":"QScrollArea","title":"QScrollArea","id":"api/QScrollArea","description":"> A `QScrollArea` provides a scrolling view onto another widget.","source":"@site/docs/api/QScrollArea.md","permalink":"/docs/api/QScrollArea","sidebar":"api","category":"Widgets","next":"api/QSpinBox","previous":"api/QRadioButton","previous_title":"QRadioButton","next_title":"QSpinBox"},"api/QSpinBox":{"sidebar_label":"QSpinBox","title":"QSpinBox","id":"api/QSpinBox","description":"> Create and control spin box widgets.","source":"@site/docs/api/QSpinBox.md","permalink":"/docs/api/QSpinBox","sidebar":"api","category":"Widgets","next":"api/QTabWidget","previous":"api/QScrollArea","previous_title":"QScrollArea","next_title":"QTabWidget"},"api/QTabWidget":{"sidebar_label":"QTabWidget","title":"QTabWidget","id":"api/QTabWidget","description":"Will be available from NodeGUI v0.1.10 and up","source":"@site/docs/api/QTabWidget.md","permalink":"/docs/api/QTabWidget","sidebar":"api","category":"Widgets","next":"api/QWidget","previous":"api/QSpinBox","previous_title":"QSpinBox","next_title":"QWidget"},"api/QWidget":{"sidebar_label":"QWidget","title":"QWidget","id":"api/QWidget","description":"> Create and control views.","source":"@site/docs/api/QWidget.md","permalink":"/docs/api/QWidget","sidebar":"api","category":"Widgets","next":"api/FlexLayout","previous":"api/QTabWidget","previous_title":"QTabWidget","next_title":"FlexLayout"},"api/QtEnums":{"sidebar_label":"Qt Enums","title":"Qt Enums","id":"api/QtEnums","description":"## Enums from Qt","source":"@site/docs/api/QtEnums.md","permalink":"/docs/api/QtEnums","sidebar":"api","category":"Modules","next":"api/Component","previous":"api/QPixmap","previous_title":"QPixmap","next_title":"Component"},"api/YogaWidget":{"sidebar_label":"YogaWidget","title":"YogaWidget","id":"api/YogaWidget","description":"> Abstract class to add common functionality related to Flex layout to all Widgets.","source":"@site/docs/api/YogaWidget.md","permalink":"/docs/api/YogaWidget","sidebar":"api","category":"Internal Modules","next":"api/QAbstractScrollArea","previous":"api/NodeWidget","previous_title":"NodeWidget","next_title":"QAbstractScrollArea"},"api/process":{"sidebar_label":"process","title":"process","id":"api/process","description":"> Extensions to process object.","source":"@site/docs/api/process.md","permalink":"/docs/api/process","sidebar":"api","category":"APIs","previous":"api/QAbstractSlider","previous_title":"QAbstractSlider"},"api/synopsis":{"sidebar_label":"Synopsis","title":"Synopsis","id":"api/synopsis","description":"> How to use Node.js and NodeGui\'s APIs.","source":"@site/docs/api/synopsis.md","permalink":"/docs/api/synopsis","sidebar":"api","category":"General","next":"api/QApplication","next_title":"QApplication"},"development/README":{"id":"development/README","title":"README","description":"# Contributor\'s guide","source":"@site/docs/development/README.md","permalink":"/docs/development/README"},"development/common_errors":{"id":"development/common_errors","title":"common_errors","description":"# Common errors","source":"@site/docs/development/common_errors.md","permalink":"/docs/development/common_errors"},"development/debugging":{"id":"development/debugging","title":"debugging","description":"# debugging","source":"@site/docs/development/debugging.md","permalink":"/docs/development/debugging"},"development/getting-started":{"id":"development/getting-started","title":"getting-started","description":"## Getting started","source":"@site/docs/development/getting-started.md","permalink":"/docs/development/getting-started"},"development/setting-up":{"id":"development/setting-up","title":"setting-up","description":"# Setup project for development","source":"@site/docs/development/setting-up.md","permalink":"/docs/development/setting-up"},"development/signal_and_event_handling":{"id":"development/signal_and_event_handling","title":"signal_and_event_handling","description":"# Event handling","source":"@site/docs/development/signal_and_event_handling.md","permalink":"/docs/development/signal_and_event_handling"},"development/styling":{"id":"development/styling","title":"styling","description":"# How styling works?","source":"@site/docs/development/styling.md","permalink":"/docs/development/styling"},"development/wrapping_widgets":{"id":"development/wrapping_widgets","title":"wrapping_widgets","description":"# Exporting a new method from a widget","source":"@site/docs/development/wrapping_widgets.md","permalink":"/docs/development/wrapping_widgets"},"guides/custom-nodegui-native-plugin":{"sidebar_label":"Custom NodeGui Plugin","title":"Custom NodeGui Plugin","id":"guides/custom-nodegui-native-plugin","description":"WIP","source":"@site/docs/guides/custom-nodegui-native-plugin.md","permalink":"/docs/guides/custom-nodegui-native-plugin","sidebar":"guides","category":"Guides","previous":"guides/using-native-node-modules","previous_title":"Using native Node Modules"},"guides/debugging-in-vscode":{"sidebar_label":"Debugging in VSCode","title":"Debugging in VSCode","id":"guides/debugging-in-vscode","description":"- **Open a NodeGui project in VSCode.**","source":"@site/docs/guides/debugging-in-vscode.md","permalink":"/docs/guides/debugging-in-vscode","sidebar":"guides","category":"Guides","next":"guides/using-native-node-modules","previous":"guides/debugging","previous_title":"Debugging","next_title":"Using native Node Modules"},"guides/debugging":{"sidebar_label":"Debugging","title":"Debugging","id":"guides/debugging","description":"## Application Debugging","source":"@site/docs/guides/debugging.md","permalink":"/docs/guides/debugging","sidebar":"guides","category":"Guides","next":"guides/debugging-in-vscode","previous":"guides/nodegui-architecture","previous_title":"Architecture","next_title":"Debugging in VSCode"},"guides/getting-started":{"sidebar_label":"Getting started","title":"Getting started","id":"guides/getting-started","description":"NodeGui enables you to create desktop applications with JavaScript. You could see it","source":"@site/docs/guides/getting-started.md","permalink":"/docs/guides/getting-started","sidebar":"guides","category":"The Basics","next":"guides/tutorial","next_title":"Learn the Basics"},"guides/handle-events":{"sidebar_label":"Handle Events","title":"Handle Events","id":"guides/handle-events","description":"WIP","source":"@site/docs/guides/handle-events.md","permalink":"/docs/guides/handle-events","sidebar":"guides","category":"The Basics","next":"guides/scroll-view","previous":"guides/layout","previous_title":"Layout","next_title":"Scroll View"},"guides/images":{"sidebar_label":"Images","title":"Images","id":"guides/images","description":"WIP","source":"@site/docs/guides/images.md","permalink":"/docs/guides/images","sidebar":"guides","category":"The Basics","next":"guides/networking","previous":"guides/scroll-view","previous_title":"Scroll View","next_title":"Networking"},"guides/layout":{"sidebar_label":"Layout","title":"Layout","id":"guides/layout","description":"NodeGui uses a layout system to automatically arranging child widgets within a widget to ensure that they make good use of the available space.","source":"@site/docs/guides/layout.md","permalink":"/docs/guides/layout","sidebar":"guides","category":"The Basics","next":"guides/handle-events","previous":"guides/styling","previous_title":"Styling","next_title":"Handle Events"},"guides/networking":{"sidebar_label":"Networking","title":"Networking","id":"guides/networking","description":"WIP","source":"@site/docs/guides/networking.md","permalink":"/docs/guides/networking","sidebar":"guides","category":"The Basics","next":"guides/nodegui-architecture","previous":"guides/images","previous_title":"Images","next_title":"Architecture"},"guides/nodegui-architecture":{"sidebar_label":"Architecture","title":"Architecture","id":"guides/nodegui-architecture","description":"By looking at how NodeGui works internally, we would get a clear picture on why the APIs are designed the way they are.","source":"@site/docs/guides/nodegui-architecture.md","permalink":"/docs/guides/nodegui-architecture","sidebar":"guides","category":"Guides","next":"guides/debugging","previous":"guides/networking","previous_title":"Networking","next_title":"Debugging"},"guides/scroll-view":{"sidebar_label":"Scroll View","title":"Scroll View","id":"guides/scroll-view","description":"WIP","source":"@site/docs/guides/scroll-view.md","permalink":"/docs/guides/scroll-view","sidebar":"guides","category":"The Basics","next":"guides/images","previous":"guides/handle-events","previous_title":"Handle Events","next_title":"Images"},"guides/styling":{"sidebar_label":"Styling","title":"Styling","id":"guides/styling","description":"With NodeGui, you can style a widget to your needs. If you are familiar with CSS in the web world you would feel right at home. All widgets have a method `setInlineStyle` for setting inline styles for the respective widget. The style names and values usually match how CSS works on the web.","source":"@site/docs/guides/styling.md","permalink":"/docs/guides/styling","sidebar":"guides","category":"The Basics","next":"guides/layout","previous":"guides/tutorial","previous_title":"Learn the Basics","next_title":"Layout"},"guides/tutorial":{"sidebar_label":"Learn the Basics","title":"Learn the Basics","id":"guides/tutorial","description":"NodeGui uses native components instead of web based components as building blocks. So to understand the basic structure of a NodeGui app, you need to be familiar with Javascript or Typescript. This tutorial is aimed at everyone who has some web experience with web development.","source":"@site/docs/guides/tutorial.md","permalink":"/docs/guides/tutorial","sidebar":"guides","category":"The Basics","next":"guides/styling","previous":"guides/getting-started","previous_title":"Getting started","next_title":"Styling"},"guides/using-native-node-modules":{"sidebar_label":"Native Node Modules","title":"Using native Node Modules","id":"guides/using-native-node-modules","description":"Native Node modules are supported by NodeGui, but since NodeGui is very","source":"@site/docs/guides/using-native-node-modules.md","permalink":"/docs/guides/using-native-node-modules","sidebar":"guides","category":"Guides","next":"guides/custom-nodegui-native-plugin","previous":"guides/debugging-in-vscode","previous_title":"Debugging in VSCode","next_title":"Custom NodeGui Plugin"}},"docsDir":"/Users/atulr/Project/nodegui/nodegui/website/docs","docsSidebars":{"api":[{"type":"category","label":"General","items":[{"type":"doc","id":"api/synopsis"}]},{"type":"category","label":"Widgets","items":[{"type":"doc","id":"api/QApplication"},{"type":"doc","id":"api/QCheckBox"},{"type":"doc","id":"api/QDial"},{"type":"doc","id":"api/QIcon"},{"type":"doc","id":"api/QLabel"},{"type":"doc","id":"api/QLineEdit"},{"type":"doc","id":"api/QMainWindow"},{"type":"doc","id":"api/QPlainTextEdit"},{"type":"doc","id":"api/QProgressBar"},{"type":"doc","id":"api/QPushButton"},{"type":"doc","id":"api/QRadioButton"},{"type":"doc","id":"api/QScrollArea"},{"type":"doc","id":"api/QSpinBox"},{"type":"doc","id":"api/QTabWidget"},{"type":"doc","id":"api/QWidget"}]},{"type":"category","label":"Layouts","items":[{"type":"doc","id":"api/FlexLayout"},{"type":"doc","id":"api/QGridLayout"}]},{"type":"category","label":"Modules","items":[{"type":"doc","id":"api/QClipboard"},{"type":"doc","id":"api/QCursor"},{"type":"doc","id":"api/QPixmap"},{"type":"doc","id":"api/QtEnums"}]},{"type":"category","label":"Internal Modules","items":[{"type":"doc","id":"api/Component"},{"type":"doc","id":"api/EventWidget"},{"type":"doc","id":"api/NodeLayout"},{"type":"doc","id":"api/NodeWidget"},{"type":"doc","id":"api/YogaWidget"},{"type":"doc","id":"api/QAbstractScrollArea"},{"type":"doc","id":"api/QAbstractSlider"}]},{"type":"category","label":"APIs","items":[{"type":"doc","id":"api/process"}]}],"guides":[{"type":"category","label":"The Basics","items":[{"type":"doc","id":"guides/getting-started"},{"type":"doc","id":"guides/tutorial"},{"type":"doc","id":"guides/styling"},{"type":"doc","id":"guides/layout"},{"type":"doc","id":"guides/handle-events"},{"type":"doc","id":"guides/scroll-view"},{"type":"doc","id":"guides/images"},{"type":"doc","id":"guides/networking"}]},{"type":"category","label":"Guides","items":[{"type":"doc","id":"guides/nodegui-architecture"},{"type":"doc","id":"guides/debugging"},{"type":"doc","id":"guides/debugging-in-vscode"},{"type":"doc","id":"guides/using-native-node-modules"},{"type":"doc","id":"guides/custom-nodegui-native-plugin"}]}]},"sourceToPermalink":{"@site/docs/doc1.md":"/docs/doc1","@site/docs/faq.md":"/docs/faq","@site/docs/mdx.md":"/docs/mdx","@site/docs/api/Component.md":"/docs/api/Component","@site/docs/api/EventWidget.md":"/docs/api/EventWidget","@site/docs/api/FlexLayout.md":"/docs/api/FlexLayout","@site/docs/api/NodeLayout.md":"/docs/api/NodeLayout","@site/docs/api/NodeWidget.md":"/docs/api/NodeWidget","@site/docs/api/QAbstractScrollArea.md":"/docs/api/QAbstractScrollArea","@site/docs/api/QAbstractSlider.md":"/docs/api/QAbstractSlider","@site/docs/api/QApplication.md":"/docs/api/QApplication","@site/docs/api/QCheckBox.md":"/docs/api/QCheckBox","@site/docs/api/QClipboard.md":"/docs/api/QClipboard","@site/docs/api/QCursor.md":"/docs/api/QCursor","@site/docs/api/QDial.md":"/docs/api/QDial","@site/docs/api/QGridLayout.md":"/docs/api/QGridLayout","@site/docs/api/QIcon.md":"/docs/api/QIcon","@site/docs/api/QLabel.md":"/docs/api/QLabel","@site/docs/api/QLineEdit.md":"/docs/api/QLineEdit","@site/docs/api/QMainWindow.md":"/docs/api/QMainWindow","@site/docs/api/QPixmap.md":"/docs/api/QPixmap","@site/docs/api/QPlainTextEdit.md":"/docs/api/QPlainTextEdit","@site/docs/api/QProgressBar.md":"/docs/api/QProgressBar","@site/docs/api/QPushButton.md":"/docs/api/QPushButton","@site/docs/api/QRadioButton.md":"/docs/api/QRadioButton","@site/docs/api/QScrollArea.md":"/docs/api/QScrollArea","@site/docs/api/QSpinBox.md":"/docs/api/QSpinBox","@site/docs/api/QTabWidget.md":"/docs/api/QTabWidget","@site/docs/api/QWidget.md":"/docs/api/QWidget","@site/docs/api/QtEnums.md":"/docs/api/QtEnums","@site/docs/api/YogaWidget.md":"/docs/api/YogaWidget","@site/docs/api/process.md":"/docs/api/process","@site/docs/api/synopsis.md":"/docs/api/synopsis","@site/docs/development/README.md":"/docs/development/README","@site/docs/development/common_errors.md":"/docs/development/common_errors","@site/docs/development/debugging.md":"/docs/development/debugging","@site/docs/development/getting-started.md":"/docs/development/getting-started","@site/docs/development/setting-up.md":"/docs/development/setting-up","@site/docs/development/signal_and_event_handling.md":"/docs/development/signal_and_event_handling","@site/docs/development/styling.md":"/docs/development/styling","@site/docs/development/wrapping_widgets.md":"/docs/development/wrapping_widgets","@site/docs/guides/custom-nodegui-native-plugin.md":"/docs/guides/custom-nodegui-native-plugin","@site/docs/guides/debugging-in-vscode.md":"/docs/guides/debugging-in-vscode","@site/docs/guides/debugging.md":"/docs/guides/debugging","@site/docs/guides/getting-started.md":"/docs/guides/getting-started","@site/docs/guides/handle-events.md":"/docs/guides/handle-events","@site/docs/guides/images.md":"/docs/guides/images","@site/docs/guides/layout.md":"/docs/guides/layout","@site/docs/guides/networking.md":"/docs/guides/networking","@site/docs/guides/nodegui-architecture.md":"/docs/guides/nodegui-architecture","@site/docs/guides/scroll-view.md":"/docs/guides/scroll-view","@site/docs/guides/styling.md":"/docs/guides/styling","@site/docs/guides/tutorial.md":"/docs/guides/tutorial","@site/docs/guides/using-native-node-modules.md":"/docs/guides/using-native-node-modules"},"permalinkToId":{"/docs/doc1":"doc1","/docs/faq":"faq","/docs/mdx":"mdx","/docs/api/Component":"api/Component","/docs/api/EventWidget":"api/EventWidget","/docs/api/FlexLayout":"api/FlexLayout","/docs/api/NodeLayout":"api/NodeLayout","/docs/api/NodeWidget":"api/NodeWidget","/docs/api/QAbstractScrollArea":"api/QAbstractScrollArea","/docs/api/QAbstractSlider":"api/QAbstractSlider","/docs/api/QApplication":"api/QApplication","/docs/api/QCheckBox":"api/QCheckBox","/docs/api/QClipboard":"api/QClipboard","/docs/api/QCursor":"api/QCursor","/docs/api/QDial":"api/QDial","/docs/api/QGridLayout":"api/QGridLayout","/docs/api/QIcon":"api/QIcon","/docs/api/QLabel":"api/QLabel","/docs/api/QLineEdit":"api/QLineEdit","/docs/api/QMainWindow":"api/QMainWindow","/docs/api/QPixmap":"api/QPixmap","/docs/api/QPlainTextEdit":"api/QPlainTextEdit","/docs/api/QProgressBar":"api/QProgressBar","/docs/api/QPushButton":"api/QPushButton","/docs/api/QRadioButton":"api/QRadioButton","/docs/api/QScrollArea":"api/QScrollArea","/docs/api/QSpinBox":"api/QSpinBox","/docs/api/QTabWidget":"api/QTabWidget","/docs/api/QWidget":"api/QWidget","/docs/api/QtEnums":"api/QtEnums","/docs/api/YogaWidget":"api/YogaWidget","/docs/api/process":"api/process","/docs/api/synopsis":"api/synopsis","/docs/development/README":"development/README","/docs/development/common_errors":"development/common_errors","/docs/development/debugging":"development/debugging","/docs/development/getting-started":"development/getting-started","/docs/development/setting-up":"development/setting-up","/docs/development/signal_and_event_handling":"development/signal_and_event_handling","/docs/development/styling":"development/styling","/docs/development/wrapping_widgets":"development/wrapping_widgets","/docs/guides/custom-nodegui-native-plugin":"guides/custom-nodegui-native-plugin","/docs/guides/debugging-in-vscode":"guides/debugging-in-vscode","/docs/guides/debugging":"guides/debugging","/docs/guides/getting-started":"guides/getting-started","/docs/guides/handle-events":"guides/handle-events","/docs/guides/images":"guides/images","/docs/guides/layout":"guides/layout","/docs/guides/networking":"guides/networking","/docs/guides/nodegui-architecture":"guides/nodegui-architecture","/docs/guides/scroll-view":"guides/scroll-view","/docs/guides/styling":"guides/styling","/docs/guides/tutorial":"guides/tutorial","/docs/guides/using-native-node-modules":"guides/using-native-node-modules"}}')}}]);
\ No newline at end of file
diff --git a/index.html b/index.html
index a549dcef9..292774465 100644
--- a/index.html
+++ b/index.html
@@ -3,7 +3,7 @@
 
 
 
-
+
 
 Hello from NodeGui
 
@@ -21,12 +21,12 @@
 
 
 
    
-
    NodeGui
    Build performant, native, cross platform desktop apps with JavaScript and CSS 🚀
    [object Object]
    Web Technologies
    With NodeGui, you can build your app with familiar web technologies like CSS and JavaScript. There is even a React based version.
    [object Object]
    Open Source
    NodeGui is an open source project maintained by an active community of contributors.
    [object Object]
     Cross Platform
    Compatible with Mac, Windows, and Linux, Electron apps build and run on three platforms.
    Create native apps for Windows, MacOs and Linux using JavaScript and CSS
    lets you create truly native apps and doesn't compromise on your users' experience. It provides a core set of platform agnostic native widgets that map directly to the platform’s native UI building blocks.
    NodeGui widgets are built on top of Qt which is a mature dekstop apps framework. NodeGui widgets are extremely customizable just like in the web but does NOT use a Web browser under the hood.
    Written in JavaScript—rendered with native code by Qt
    Apps can be built completely in JavaScript. This enables native app development for whole new teams of developers, and can let existing native teams work much faster.
    With NodeGui you get flexibility of web and perfromance of Native desktop apps.
    Give it a try
    1. Run these commands
    git clone https://github.com/nodegui/nodegui-startercd nodegui-starternpm installnpm start
    2. Learn the basics or dive deeper and take a look at the APIs.
    
+
    NodeGui
    Build performant, native, cross platform desktop apps with JavaScript and CSS 🚀
    [object Object]
    Web Technologies
    With NodeGui, you can build your app with familiar web technologies like CSS and JavaScript. There is even a React based version.
    [object Object]
    Open Source
    NodeGui is an open source project maintained by an active community of contributors.
    [object Object]
     Cross Platform
    Compatible with Mac, Windows, and Linux, NodeGui apps build and run on three platforms.
    Create native apps for Windows, MacOs and Linux using JavaScript and CSS
    lets you create truly native apps and doesn't compromise on your users' experience. It provides a core set of platform agnostic native widgets that map directly to the platform’s native UI building blocks.
    NodeGui widgets are built on top of Qt which is a mature dekstop apps framework. NodeGui widgets are extremely customizable just like in the web but does NOT use a Web browser under the hood.
    Written in JavaScript—rendered with native code by Qt
    Apps can be built completely in JavaScript. This enables native app development for whole new teams of developers, and can let existing native teams work much faster.
    With NodeGui you get flexibility of web and perfromance of Native desktop apps.
    Give it a try
    1. Run these commands
    git clone https://github.com/nodegui/nodegui-startercd nodegui-starternpm installnpm start
    2. Learn the basics or dive deeper and take a look at the APIs.
    
 
    
 
-
+
 
-
+
 
 
 
@@ -34,7 +34,7 @@
 
 
 
-
+
 
 
 
\ No newline at end of file
diff --git a/main.00ae184f6d3bd0eadbce.js b/main.3c22308242e28ead5e64.js
similarity index 99%
rename from main.00ae184f6d3bd0eadbce.js
rename to main.3c22308242e28ead5e64.js
index 9d82b9b1f..463f37abb 100644
--- a/main.00ae184f6d3bd0eadbce.js
+++ b/main.3c22308242e28ead5e64.js
@@ -1 +1 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[67],[function(e,t,n){"use strict";e.exports=n(25)},function(e,t,n){"use strict";function o(){return(o=Object.assign||function(e){for(var t=1;t=0;f--){var p=i[f];"."===p?a(i,f):".."===p?(a(i,f),d++):d&&(a(i,f),d--)}if(!c)for(;d--;d)i.unshift("..");!c||""===i[0]||i[0]&&r(i[0])||i.unshift("");var m=i.join("/");return n&&"/"!==m.substr(-1)&&(m+="/"),m};function u(e){return e.valueOf?e.valueOf():Object.prototype.valueOf.call(e)}var l=function e(t,n){if(t===n)return!0;if(null==t||null==n)return!1;if(Array.isArray(t))return Array.isArray(n)&&t.length===n.length&&t.every((function(t,o){return e(t,n[o])}));if("object"==typeof t||"object"==typeof n){var o=u(t),r=u(n);return o!==t||r!==n?e(o,r):Object.keys(Object.assign({},t,n)).every((function(o){return e(t[o],n[o])}))}return!1},c=n(3);function s(e){return"/"===e.charAt(0)?e:"/"+e}function d(e){return"/"===e.charAt(0)?e.substr(1):e}function f(e,t){return function(e,t){return 0===e.toLowerCase().indexOf(t.toLowerCase())&&-1!=="/?#".indexOf(e.charAt(t.length))}(e,t)?e.substr(t.length):e}function p(e){return"/"===e.charAt(e.length-1)?e.slice(0,-1):e}function m(e){var t=e.pathname,n=e.search,o=e.hash,r=t||"/";return n&&"?"!==n&&(r+="?"===n.charAt(0)?n:"?"+n),o&&"#"!==o&&(r+="#"===o.charAt(0)?o:"#"+o),r}function h(e,t,n,r){var a;"string"==typeof e?(a=function(e){var t=e||"/",n="",o="",r=t.indexOf("#");-1!==r&&(o=t.substr(r),t=t.substr(0,r));var a=t.indexOf("?");return-1!==a&&(n=t.substr(a),t=t.substr(0,a)),{pathname:t,search:"?"===n?"":n,hash:"#"===o?"":o}}(e)).state=t:(void 0===(a=Object(o.a)({},e)).pathname&&(a.pathname=""),a.search?"?"!==a.search.charAt(0)&&(a.search="?"+a.search):a.search="",a.hash?"#"!==a.hash.charAt(0)&&(a.hash="#"+a.hash):a.hash="",void 0!==t&&void 0===a.state&&(a.state=t));try{a.pathname=decodeURI(a.pathname)}catch(e){throw e instanceof URIError?new URIError('Pathname "'+a.pathname+'" could not be decoded. This is likely caused by an invalid percent-encoding.'):e}return n&&(a.key=n),r?a.pathname?"/"!==a.pathname.charAt(0)&&(a.pathname=i(a.pathname,r.pathname)):a.pathname=r.pathname:a.pathname||(a.pathname="/"),a}function g(e,t){return e.pathname===t.pathname&&e.search===t.search&&e.hash===t.hash&&e.key===t.key&&l(e.state,t.state)}function b(){var e=null;var t=[];return{setPrompt:function(t){return e=t,function(){e===t&&(e=null)}},confirmTransitionTo:function(t,n,o,r){if(null!=e){var a="function"==typeof e?e(t,n):e;"string"==typeof a?"function"==typeof o?o(a,r):r(!0):r(!1!==a)}else r(!0)},appendListener:function(e){var n=!0;function o(){n&&e.apply(void 0,arguments)}return t.push(o),function(){n=!1,t=t.filter((function(e){return e!==o}))}},notifyListeners:function(){for(var e=arguments.length,n=new Array(e),o=0;ot?n.splice(t,n.length-t,o):n.push(o),d({action:"PUSH",location:o,index:t,entries:n})}}))},replace:function(e,t){var o=h(e,t,f(),w.location);s.confirmTransitionTo(o,"REPLACE",n,(function(e){e&&(w.entries[w.index]=o,d({action:"REPLACE",location:o}))}))},go:y,goBack:function(){y(-1)},goForward:function(){y(1)},canGo:function(e){var t=w.index+e;return t>=0&&t=0||(r[n]=e[n]);return r}n.d(t,"a",(function(){return o}))},function(e,t,n){e.exports=n(29)()},function(e,t,n){"use strict";n.d(t,"a",(function(){return u})),n.d(t,"b",(function(){return l}));var o=n(2),r=n(1),a=n(0),i=n.n(a);function u(e,t,n){return void 0===n&&(n=[]),e.some((function(e){var r=e.path?Object(o.e)(t,e):n.length?n[n.length-1].match:o.b.computeRootMatch(t);return r&&(n.push({route:e,match:r}),e.routes&&u(e.routes,t,n)),r})),n}function l(e,t,n){return void 0===t&&(t={}),void 0===n&&(n={}),e?i.a.createElement(o.c,n,e.map((function(e,n){return i.a.createElement(o.a,{key:e.key||n,path:e.path,exact:e.exact,strict:e.strict,render:function(n){return e.render?e.render(Object(r.a)({},n,{},t,{route:e})):i.a.createElement(e.component,Object(r.a)({},n,t,{route:e}))}})}))):null}},function(e){e.exports=JSON.parse('{"/":{"component":"component---site-src-pages-index-jsc-4-f-f99"},"/blog/welcome":{"component":"component---theme-blog-post-pageccc-cab","content":"content---blog-welcome-286-e55","metadata":"metadata---blog-welcome-27-a-91f","prevItem":null,"nextItem":null},"/blog":{"component":"component---theme-blog-list-pagea-6-a-7ba","items":[{"content":"content---blogaf-1-856","metadata":"metadata---blog-welcome-27-a-91f"}],"metadata":"metadata---blog-83-c-2b0"},"/docs":{"component":"component---theme-doc-legacy-page-9-e-7-ca5","docsMetadata":"docsMetadata---docs-150-2d6"},"/docs/doc1":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-doc-1-b-2-f-e80","metadata":"metadata---docs-doc-12-a-3-5a1"},"/docs/faq":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-faq-048-db5","metadata":"metadata---docs-faq-59-d-2b9"},"/docs/api/Component":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-component-4-ef-195","metadata":"metadata---docs-api-component-3-e-5-43d"},"/docs/mdx":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-mdxce-3-7d1","metadata":"metadata---docs-mdx-786-f56"},"/docs/api/EventWidget":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-event-widgetac-6-11b","metadata":"metadata---docs-api-event-widget-39-a-9ea"},"/docs/api/FlexLayout":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-flex-layout-3-dc-a16","metadata":"metadata---docs-api-flex-layoutecf-540"},"/docs/api/NodeLayout":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-node-layoutd-28-11a","metadata":"metadata---docs-api-node-layout-1-e-9-c15"},"/docs/api/NodeWidget":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-node-widget-080-a39","metadata":"metadata---docs-api-node-widgeta-92-a4f"},"/docs/api/QAbstractScrollArea":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-abstract-scroll-area-3-e-6-d7f","metadata":"metadata---docs-api-q-abstract-scroll-area-59-d-279"},"/docs/api/QAbstractSlider":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-abstract-slider-3-e-0-54d","metadata":"metadata---docs-api-q-abstract-sliderdfa-ab7"},"/docs/api/QApplication":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-applicationd-3-e-0a3","metadata":"metadata---docs-api-q-applicationc-1-d-8a4"},"/docs/api/QCheckBox":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-check-boxd-9-b-c95","metadata":"metadata---docs-api-q-check-box-132-293"},"/docs/api/QClipboard":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-clipboard-69-d-2ef","metadata":"metadata---docs-api-q-clipboard-486-b21"},"/docs/api/QCursor":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-cursor-362-d51","metadata":"metadata---docs-api-q-cursor-887-11e"},"/docs/api/QDial":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-dial-80-b-99a","metadata":"metadata---docs-api-q-dialbfb-aef"},"/docs/api/QGridLayout":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-grid-layouta-4-e-552","metadata":"metadata---docs-api-q-grid-layout-7-db-030"},"/docs/api/QIcon":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-icone-5-f-b0d","metadata":"metadata---docs-api-q-icone-6-d-093"},"/docs/api/QLabel":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-label-2-f-9-04b","metadata":"metadata---docs-api-q-label-165-210"},"/docs/api/QLineEdit":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-line-editea-0-53d","metadata":"metadata---docs-api-q-line-edit-13-f-b8a"},"/docs/api/QMainWindow":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-main-window-0-e-7-299","metadata":"metadata---docs-api-q-main-window-04-f-efb"},"/docs/api/QPixmap":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-pixmap-8-dd-cb2","metadata":"metadata---docs-api-q-pixmapfdf-820"},"/docs/api/QPlainTextEdit":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-plain-text-edit-7-c-8-081","metadata":"metadata---docs-api-q-plain-text-edit-161-ecc"},"/docs/api/QProgressBar":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-progress-barc-46-afe","metadata":"metadata---docs-api-q-progress-bar-43-d-07e"},"/docs/api/QPushButton":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-push-button-06-c-73e","metadata":"metadata---docs-api-q-push-button-96-d-c92"},"/docs/api/QRadioButton":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-radio-buttone-54-746","metadata":"metadata---docs-api-q-radio-button-367-f7c"},"/docs/api/QScrollArea":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-scroll-area-8-c-4-3fd","metadata":"metadata---docs-api-q-scroll-area-46-a-96e"},"/docs/api/QSpinBox":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-spin-box-1-ce-bfd","metadata":"metadata---docs-api-q-spin-box-809-ae0"},"/docs/api/QTabWidget":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-tab-widget-508-95e","metadata":"metadata---docs-api-q-tab-widgetebc-5aa"},"/docs/api/QWidget":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-q-widget-04-a-59f","metadata":"metadata---docs-api-q-widget-287-e6c"},"/docs/api/QtEnums":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-qt-enumsfd-7-cf3","metadata":"metadata---docs-api-qt-enums-423-cf9"},"/docs/api/YogaWidget":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-yoga-widgeta-42-cc7","metadata":"metadata---docs-api-yoga-widget-95-c-f8b"},"/docs/api/process":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-process-5-ec-b1e","metadata":"metadata---docs-api-process-32-d-09e"},"/docs/api/synopsis":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-api-synopsis-7-bb-e1c","metadata":"metadata---docs-api-synopsis-21-f-a62"},"/docs/development/README":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-development-readme-149-437","metadata":"metadata---docs-development-readm-ec-6-c-332"},"/docs/development/common_errors":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-development-common-errorsf-15-a5b","metadata":"metadata---docs-development-common-errors-402-ef4"},"/docs/development/debugging":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-development-debuggingb-54-9ed","metadata":"metadata---docs-development-debuggingc-36-26a"},"/docs/development/getting-started":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-development-getting-started-139-387","metadata":"metadata---docs-development-getting-started-89-b-c7a"},"/docs/development/setting-up":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-development-setting-up-28-c-666","metadata":"metadata---docs-development-setting-up-979-75f"},"/docs/development/signal_and_event_handling":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-development-signal-and-event-handling-7-d-4-f3f","metadata":"metadata---docs-development-signal-and-event-handling-0-b-5-692"},"/docs/development/styling":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-development-styling-293-cad","metadata":"metadata---docs-development-styling-1-c-2-0d6"},"/docs/development/wrapping_widgets":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-development-wrapping-widgets-84-b-538","metadata":"metadata---docs-development-wrapping-widgets-303-fb8"},"/docs/guides/custom-nodegui-native-plugin":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-guides-custom-nodegui-native-plugin-632-9db","metadata":"metadata---docs-guides-custom-nodegui-native-plugin-92-b-12f"},"/docs/guides/debugging-in-vscode":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-guides-debugging-in-vscodebd-7-cec","metadata":"metadata---docs-guides-debugging-in-vscodebf-8-5b0"},"/docs/guides/debugging":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-guides-debuggingf-3-f-cf5","metadata":"metadata---docs-guides-debugging-970-fb8"},"/docs/guides/getting-started":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-guides-getting-startedc-9-e-20f","metadata":"metadata---docs-guides-getting-started-2-b-7-1a4"},"/docs/guides/handle-events":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-guides-handle-events-160-4b0","metadata":"metadata---docs-guides-handle-events-5-eb-540"},"/docs/guides/images":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-guides-images-991-065","metadata":"metadata---docs-guides-images-915-5ee"},"/docs/guides/layout":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-guides-layoutdf-5-a64","metadata":"metadata---docs-guides-layoutf-65-d7d"},"/docs/guides/networking":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-guides-networking-374-03e","metadata":"metadata---docs-guides-networkingdfd-ce0"},"/docs/guides/nodegui-architecture":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-guides-nodegui-architecture-262-19e","metadata":"metadata---docs-guides-nodegui-architecture-550-b82"},"/docs/guides/scroll-view":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-guides-scroll-view-76-e-87c","metadata":"metadata---docs-guides-scroll-view-9-a-9-2ac"},"/docs/guides/styling":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-guides-stylingfec-977","metadata":"metadata---docs-guides-styling-9-ea-213"},"/docs/guides/tutorial":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-guides-tutoriale-53-6ab","metadata":"metadata---docs-guides-tutorial-1-f-1-23b"},"/docs/guides/using-native-node-modules":{"component":"component---theme-doc-legacy-item-031-769","content":"content---docs-guides-using-native-node-modules-3-ab-104","metadata":"metadata---docs-guides-using-native-node-modules-31-f-551"},"/blog/tags/nodegui":{"component":"component---theme-blog-tags-posts-page-687-b6c","items":[{"content":"content---blogaf-1-856","metadata":"metadata---blog-welcome-27-a-91f"}],"metadata":"metadata---blog-tags-nodegui-632-d46"},"/blog/tags/hello":{"component":"component---theme-blog-tags-posts-page-687-b6c","items":[{"content":"content---blogaf-1-856","metadata":"metadata---blog-welcome-27-a-91f"}],"metadata":"metadata---blog-tags-hellob-02-3e8"},"/blog/tags":{"component":"component---theme-blog-tags-list-page-01-a-d0b","tags":"tags---blog-tags-8-d-7-36d"}}')},function(e,t,n){"use strict";t.a={plugins:[],themes:[],customFields:{},themeConfig:{navbar:{title:"NodeGui",logo:{alt:"NodeGui Logo",src:"img/logo-circle.png"},links:[{to:"docs/guides/getting-started",label:"Docs",position:"right"},{to:"docs/api/QApplication",label:"API",position:"right"},{to:"blog",label:"Blog",position:"right"},{href:"https://github.com/nodegui/nodegui",label:"GitHub",position:"right"}]},footer:{style:"dark",links:[{title:"Docs",items:[{to:"docs/guides/getting-started",label:"Getting Started"},{to:"docs/api/QApplication",label:"API"}]},{title:"Community",items:[{label:"Spectrum",href:"https://spectrum.chat/nodegui"},{label:"Twitter",to:"https://twitter.com/node_gui"},{label:"Medium",to:"https://medium.com/nodegui"}]},{title:"More",items:[{label:"Blog",to:"blog"},{label:"React NodeGui",to:"https://react.nodegui.org"},{label:"FAQ",to:"docs/faq"}]}],copyright:"Copyright © 2019 NodeGui"},googleAnalytics:{trackingID:"UA-145065218-1"}},title:"NodeGui",tagline:"Build performant, native, cross platform desktop apps with JavaScript and CSS 🚀",url:"https://nodegui.org",baseUrl:"/",favicon:"img/favicon.ico",organizationName:"nodegui",projectName:"nodegui",presets:[["@docusaurus/preset-classic",{docs:{sidebarPath:"/Users/atulr/Project/nodegui/nodegui/website/sidebars.js"},theme:{customCss:"/Users/atulr/Project/nodegui/nodegui/website/src/css/custom.css"}}]]}},function(e,t,n){var o,r;void 0===(r="function"==typeof(o=function(){var e,t,n={version:"0.2.0"},o=n.settings={minimum:.08,easing:"ease",positionUsing:"",speed:200,trickle:!0,trickleRate:.02,trickleSpeed:800,showSpinner:!0,barSelector:'[role="bar"]',spinnerSelector:'[role="spinner"]',parent:"body",template:'
    '};function r(e,t,n){return en?n:e}function a(e){return 100*(-1+e)}n.configure=function(e){var t,n;for(t in e)void 0!==(n=e[t])&&e.hasOwnProperty(t)&&(o[t]=n);return this},n.status=null,n.set=function(e){var t=n.isStarted();e=r(e,o.minimum,1),n.status=1===e?null:e;var l=n.render(!t),c=l.querySelector(o.barSelector),s=o.speed,d=o.easing;return l.offsetWidth,i((function(t){""===o.positionUsing&&(o.positionUsing=n.getPositioningCSS()),u(c,function(e,t,n){var r;return(r="translate3d"===o.positionUsing?{transform:"translate3d("+a(e)+"%,0,0)"}:"translate"===o.positionUsing?{transform:"translate("+a(e)+"%,0)"}:{"margin-left":a(e)+"%"}).transition="all "+t+"ms "+n,r}(e,s,d)),1===e?(u(l,{transition:"none",opacity:1}),l.offsetWidth,setTimeout((function(){u(l,{transition:"all "+s+"ms linear",opacity:0}),setTimeout((function(){n.remove(),t()}),s)}),s)):setTimeout(t,s)})),this},n.isStarted=function(){return"number"==typeof n.status},n.start=function(){n.status||n.set(0);var e=function(){setTimeout((function(){n.status&&(n.trickle(),e())}),o.trickleSpeed)};return o.trickle&&e(),this},n.done=function(e){return e||n.status?n.inc(.3+.5*Math.random()).set(1):this},n.inc=function(e){var t=n.status;return t?("number"!=typeof e&&(e=(1-t)*r(Math.random()*t,.1,.95)),t=r(t+e,0,.994),n.set(t)):n.start()},n.trickle=function(){return n.inc(Math.random()*o.trickleRate)},e=0,t=0,n.promise=function(o){return o&&"resolved"!==o.state()?(0===t&&n.start(),e++,t++,o.always((function(){0==--t?(e=0,n.done()):n.set((e-t)/e)})),this):this},n.render=function(e){if(n.isRendered())return document.getElementById("nprogress");c(document.documentElement,"nprogress-busy");var t=document.createElement("div");t.id="nprogress",t.innerHTML=o.template;var r,i=t.querySelector(o.barSelector),l=e?"-100":a(n.status||0),s=document.querySelector(o.parent);return u(i,{transition:"all 0 linear",transform:"translate3d("+l+"%,0,0)"}),o.showSpinner||(r=t.querySelector(o.spinnerSelector))&&f(r),s!=document.body&&c(s,"nprogress-custom-parent"),s.appendChild(t),t},n.remove=function(){s(document.documentElement,"nprogress-busy"),s(document.querySelector(o.parent),"nprogress-custom-parent");var e=document.getElementById("nprogress");e&&f(e)},n.isRendered=function(){return!!document.getElementById("nprogress")},n.getPositioningCSS=function(){var e=document.body.style,t="WebkitTransform"in e?"Webkit":"MozTransform"in e?"Moz":"msTransform"in e?"ms":"OTransform"in e?"O":"";return t+"Perspective"in e?"translate3d":t+"Transform"in e?"translate":"margin"};var i=function(){var e=[];function t(){var n=e.shift();n&&n(t)}return function(n){e.push(n),1==e.length&&t()}}(),u=function(){var e=["Webkit","O","Moz","ms"],t={};function n(n){return n=n.replace(/^-ms-/,"ms-").replace(/-([\da-z])/gi,(function(e,t){return t.toUpperCase()})),t[n]||(t[n]=function(t){var n=document.body.style;if(t in n)return t;for(var o,r=e.length,a=t.charAt(0).toUpperCase()+t.slice(1);r--;)if((o=e[r]+a)in n)return o;return t}(n))}function o(e,t,o){t=n(t),e.style[t]=o}return function(e,t){var n,r,a=arguments;if(2==a.length)for(n in t)void 0!==(r=t[n])&&t.hasOwnProperty(n)&&o(e,n,r);else o(e,a[1],a[2])}}();function l(e,t){return("string"==typeof e?e:d(e)).indexOf(" "+t+" ")>=0}function c(e,t){var n=d(e),o=n+t;l(n,t)||(e.className=o.substring(1))}function s(e,t){var n,o=d(e);l(e,t)&&(n=o.replace(" "+t+" "," "),e.className=n.substring(1,n.length-1))}function d(e){return(" "+(e.className||"")+" ").replace(/\s+/gi," ")}function f(e){e&&e.parentNode&&e.parentNode.removeChild(e)}return n})?o.call(t,n,t,e):o)||(e.exports=r)},,function(e,t,n){"use strict";n.d(t,"a",(function(){return d})),n.d(t,"b",(function(){return w}));var o=n(2),r=n(5),a=n(0),i=n.n(a),u=n(4),l=(n(7),n(1)),c=n(6),s=n(3),d=function(e){function t(){for(var t,n=arguments.length,o=new Array(n),r=0;rR.length&&R.push(e)}function A(e,t,n){return null==e?0:function e(t,n,o,r){var u=typeof t;"undefined"!==u&&"boolean"!==u||(t=null);var l=!1;if(null===t)l=!0;else switch(u){case"string":case"number":l=!0;break;case"object":switch(t.$$typeof){case a:case i:l=!0}}if(l)return o(r,t,""===n?"."+z(t,0):n),1;if(l=0,n=""===n?".":n+":",Array.isArray(t))for(var c=0;c