innetjs 1.12.1 → 2.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/README.md +0 -3
  2. package/bin/innet +202 -85
  3. package/constants.d.ts +3 -0
  4. package/declaration.d.ts +39 -0
  5. package/extract.d.ts +1 -0
  6. package/helpers.d.ts +5 -0
  7. package/index.d.ts +6 -2
  8. package/index.es6.js +222 -108
  9. package/index.js +201 -84
  10. package/package.json +19 -14
  11. package/templates/be/.env +0 -1
  12. package/templates/be/README.md +0 -15
  13. package/templates/be/package.json +0 -13
  14. package/templates/be/src/controller/index.tsx +0 -7
  15. package/templates/be/src/declaration.d.ts +0 -4
  16. package/templates/be/src/index.tsx +0 -6
  17. package/templates/be/src/view/App/App.css +0 -12
  18. package/templates/be/src/view/App/App.tsx +0 -15
  19. package/templates/be/src/view/App/index.ts +0 -1
  20. package/templates/be/src/view/Page/Page.css +0 -7
  21. package/templates/be/src/view/Page/Page.tsx +0 -24
  22. package/templates/be/src/view/Page/index.ts +0 -1
  23. package/templates/be/src/view/index.ts +0 -2
  24. package/templates/be/tsconfig.json +0 -31
  25. package/templates/fe/.env +0 -1
  26. package/templates/fe/README.md +0 -84
  27. package/templates/fe/package.json +0 -16
  28. package/templates/fe/public/favicon.ico +0 -0
  29. package/templates/fe/public/index.html +0 -14
  30. package/templates/fe/src/App.scss +0 -48
  31. package/templates/fe/src/App.tsx +0 -36
  32. package/templates/fe/src/componenst/Page/Page.scss +0 -22
  33. package/templates/fe/src/componenst/Page/Page.tsx +0 -18
  34. package/templates/fe/src/componenst/Page/index.ts +0 -1
  35. package/templates/fe/src/declaration.d.ts +0 -9
  36. package/templates/fe/src/index.tsx +0 -6
  37. package/templates/fe/src/pages/HomePage/HomePage.scss +0 -25
  38. package/templates/fe/src/pages/HomePage/HomePage.tsx +0 -24
  39. package/templates/fe/src/pages/HomePage/index.ts +0 -1
  40. package/templates/fe/tsconfig.json +0 -30
@@ -1,31 +0,0 @@
1
- {
2
- "compilerOptions": {
3
- "baseUrl": ".",
4
- "paths": {
5
- "/": ["src"],
6
- "/*": ["src/*"],
7
- },
8
- "target": "ES6",
9
- "lib": [
10
- "esnext"
11
- ],
12
- "allowJs": true,
13
- "skipLibCheck": true,
14
- "esModuleInterop": true,
15
- "experimentalDecorators": true,
16
- "allowSyntheticDefaultImports": true,
17
- "strict": false,
18
- "forceConsistentCasingInFileNames": true,
19
- "module": "esnext",
20
- "moduleResolution": "node",
21
- "resolveJsonModule": true,
22
- "isolatedModules": false,
23
- "removeComments": true,
24
- "declaration": false,
25
- "noEmit": true,
26
- "jsx": "preserve"
27
- },
28
- "include": [
29
- "src"
30
- ]
31
- }
package/templates/fe/.env DELETED
@@ -1 +0,0 @@
1
- CSS_MODULES=true
@@ -1,84 +0,0 @@
1
- # innet get start
2
- To start developing run this
3
- ```bash
4
- npm start
5
- ```
6
- To build production run this
7
- ```bash
8
- npm run build
9
- ```
10
- *You can find the production bundle in `public` folder*
11
-
12
- ### TypeScript
13
- The main file is `index.js` (`index.ts`, `index.tsx`) from `src` folder.
14
- You can import `.js`, `.ts` or `.tsx` files into any script file.
15
- So you can use `TypeScript` or not or use somewhere.
16
- If you don't want to use `TypeScript`,
17
- you can remove `tsconfig.json` and `declaration.d.ts`.
18
-
19
- ### SCSS
20
- You can import `.css` or `.scss` into a script.
21
- So you can use `SCSS` or not.
22
- ```typescript jsx
23
- import './index.css'
24
- import './index.scss'
25
- ```
26
- ### JSON
27
- You can import `.json` file into a script.
28
- ```typescript jsx
29
- import settings from './settings.json'
30
- ```
31
- ### HTTPS
32
- Add `localhost.crt` and `localhost.key` to the root of the application to use HTTPS.
33
- ### base path of imports
34
- You can use `/` to get root of src.
35
- ```typescript
36
- import App from '/components/App'
37
- ```
38
- The same:
39
- ```typescript
40
- import App from 'src/components/App'
41
- ```
42
- The same for index file.
43
- ```typescript
44
- import App from './components/App'
45
- ```
46
- ### .env
47
- You can create and set up `.env` file to change some features.
48
- These options are used by default.
49
- ```dotenv
50
- # you can use remote API, for example PROXY=https://localhost:9000
51
- PROXY=false
52
-
53
- # you can set remote API URL beginning, for example API=/api/?*
54
- API=*
55
-
56
- # you can change the static server port
57
- PORT=3000
58
-
59
- # you can change directory and file name of ssl certificates
60
- SSL_CRT_FILE=localhost.crt
61
- SSL_KEY_FILE=localhost.key
62
-
63
- # add the next key if you get "Error: self signed certificate"
64
- # NODE_TLS_REJECT_UNAUTHORIZED=0
65
-
66
- # you can generate sourcemap for production build
67
- GENERATE_SOURCEMAP=false
68
-
69
- # by default index.js includes all styles,
70
- # but you can keep styles into index.css with CSS_EXTRACT=true
71
- CSS_IN_JS=false
72
-
73
- # import styles from './App.css'
74
- # you can use css modules with CSS_MODULES=true.
75
- # If CSS_MODULES equals false you still can use css modules,
76
- # just name the css or scss file like App.module.css
77
- CSS_MODULES=false
78
-
79
- # you can change the public folder
80
- PUBLIC_FOLDER=public
81
-
82
- # you can change the folder of scripts
83
- BUILD_FOLDER=public/build
84
- ```
@@ -1,16 +0,0 @@
1
- {
2
- "scripts": {
3
- "build": "npx innetjs build",
4
- "start": "npx innetjs start"
5
- },
6
- "dependencies": {
7
- "innet": "^1.0.0",
8
- "@innet/dom": "^0.4.3",
9
- "@innet/jsx": "^1.0.2",
10
- "html-classes": "^1.2.0",
11
- "watch-state": "^3.4.3"
12
- },
13
- "devDependencies": {
14
- "innetjs": "^1.12.1"
15
- }
16
- }
Binary file
@@ -1,14 +0,0 @@
1
- <!doctype html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport"
6
- content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
7
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
8
- <link rel="stylesheet" href="/build/index.css">
9
- <script type="module" defer src="/build/index.js"></script>
10
- <title>Hello innet</title>
11
- </head>
12
- <body>
13
- </body>
14
- </html>
@@ -1,48 +0,0 @@
1
- html, body {
2
- margin: 0;
3
- padding: 0;
4
- height: 100vh;
5
- background: #2B2B2B;
6
- color: #F7B756;
7
- font-family: sans-serif;
8
- }
9
-
10
- body {
11
- display: flex;
12
- flex-direction: column;
13
- }
14
-
15
- h1 {
16
- font-size: 40px;
17
- }
18
-
19
- .root {
20
- color: #F7B756;
21
- text-decoration: none;
22
- }
23
-
24
- .active {
25
- color: white;
26
- pointer-events: none;
27
- }
28
-
29
- .header {
30
- display: flex;
31
- align-items: center;
32
- justify-content: center;
33
- gap: 20px;
34
- padding: 20px;
35
- }
36
-
37
- .main {
38
- display: flex;
39
- flex-direction: column;
40
- flex: 1;
41
- padding-bottom: 100px;
42
- }
43
-
44
- .content {
45
- max-width: 1024px;
46
- margin: auto;
47
- text-align: center;
48
- }
@@ -1,36 +0,0 @@
1
- import { Page } from '/componenst/Page'
2
-
3
- import { HomePage } from '/pages/HomePage'
4
-
5
- import styles from './App.scss'
6
-
7
- export const App = () => (
8
- <>
9
- <header class={styles.header}>
10
- <a href="/" exact classes={styles}>Home</a>
11
- <a href="/settings" classes={styles}>Settings</a>
12
- <a href="/any-other" classes={styles}>404</a>
13
- </header>
14
- <main class={styles.main}>
15
- <router>
16
- <slot name='/'>
17
- <HomePage />
18
- </slot>
19
- <slot name='settings'>
20
- <Page>
21
- <div class={styles.content}>
22
- <h1>Settings</h1>
23
- This is an example of a page.
24
- </div>
25
- </Page>
26
- </slot>
27
- <Page>
28
- <div class={styles.content}>
29
- <h1 style=''>404</h1>
30
- Not Found
31
- </div>
32
- </Page>
33
- </router>
34
- </main>
35
- </>
36
- )
@@ -1,22 +0,0 @@
1
- @keyframes show {
2
- from {
3
- opacity: 0;
4
- }
5
- to {
6
- opacity: 1;
7
- }
8
- }
9
-
10
- .root {
11
- transition: all 0.3s;
12
- animation: show 0.3s;
13
- opacity: 1;
14
- padding: 0 20px;
15
- flex: 1;
16
- display: flex;
17
- flex-direction: column;
18
- }
19
-
20
- .hidden {
21
- opacity: 0;
22
- }
@@ -1,18 +0,0 @@
1
- import { JsxComponent, useChildren } from '@innet/jsx'
2
- import { Ref } from '@innet/dom'
3
- import { State } from 'watch-state'
4
- import classes from 'html-classes'
5
-
6
- import styles from './Page.scss'
7
-
8
- export const Page: JsxComponent = () => {
9
- const hidden = new Ref<State<boolean>>()
10
-
11
- return (
12
- <delay ref={hidden} show={300} hide={300}>
13
- <div class={() => classes(styles.root, hidden.value.value && styles.hidden)}>
14
- {useChildren()}
15
- </div>
16
- </delay>
17
- )
18
- }
@@ -1 +0,0 @@
1
- export * from './Page'
@@ -1,9 +0,0 @@
1
- declare module '*.scss' {
2
- const content: Record<string, string>
3
- export default content;
4
- }
5
-
6
- declare module '*.css' {
7
- const content: Record<string, string>
8
- export default content;
9
- }
@@ -1,6 +0,0 @@
1
- import innet from 'innet'
2
- import dom from '@innet/dom'
3
-
4
- import { App } from '/App'
5
-
6
- innet(<App />, dom)
@@ -1,25 +0,0 @@
1
- .root {
2
- flex: 1;
3
- display: flex;
4
- flex-direction: column;
5
- text-align: center;
6
- justify-content: center;
7
- }
8
-
9
- .header {
10
- text-align: center;
11
- }
12
-
13
- .input {
14
- display: inherit;
15
- margin: 0 auto;
16
- background: #414141;
17
- color: #ebebeb;
18
- border: none;
19
- border-radius: 5px;
20
- padding: 10px 14px;
21
-
22
- &:focus {
23
- outline: none;
24
- }
25
- }
@@ -1,24 +0,0 @@
1
- import { JsxComponent } from '@innet/jsx'
2
- import { State } from 'watch-state'
3
-
4
- import { Page } from '/componenst/Page'
5
-
6
- import styles from './HomePage.scss'
7
-
8
- const name = new State('World')
9
-
10
- export const HomePage: JsxComponent = () => (
11
- <Page>
12
- <div class={styles.root}>
13
- <h1 class={styles.header}>
14
- Hello{() => name.value ? `, ${name.value}` : ''}!
15
- </h1>
16
- <input
17
- class={styles.input}
18
- value={() => name.value}
19
- oninput={e => name.value = e.target.value}
20
- placeholder='Enter your name'
21
- />
22
- </div>
23
- </Page>
24
- )
@@ -1 +0,0 @@
1
- export * from './HomePage'
@@ -1,30 +0,0 @@
1
- {
2
- "compilerOptions": {
3
- "baseUrl": ".",
4
- "paths": {
5
- "/": ["src"],
6
- "/*": ["src/*"]
7
- },
8
- "target": "ES5",
9
- "lib": [
10
- "dom",
11
- "dom.iterable",
12
- "esnext"
13
- ],
14
- "allowJs": true,
15
- "downlevelIteration": true,
16
- "skipLibCheck": true,
17
- "esModuleInterop": true,
18
- "experimentalDecorators": true,
19
- "allowSyntheticDefaultImports": true,
20
- "strict": false,
21
- "forceConsistentCasingInFileNames": true,
22
- "module": "ESNext",
23
- "moduleResolution": "node",
24
- "resolveJsonModule": true,
25
- "jsx": "preserve"
26
- },
27
- "include": [
28
- "src"
29
- ]
30
- }