@operato/board 7.1.31 → 7.1.32

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 (87) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/tsconfig.tsbuildinfo +1 -1
  3. package/package.json +14 -14
  4. package/.storybook/main.js +0 -3
  5. package/.storybook/server.mjs +0 -8
  6. package/demo/index-modeller.html +0 -112
  7. package/demo/index-player.html +0 -112
  8. package/demo/index-viewer.html +0 -112
  9. package/demo/index.html +0 -112
  10. package/src/component/3d.ts +0 -29
  11. package/src/component/chart-and-gauge.ts +0 -28
  12. package/src/component/container.ts +0 -63
  13. package/src/component/data-source.ts +0 -30
  14. package/src/component/etc.ts +0 -88
  15. package/src/component/form.ts +0 -42
  16. package/src/component/index.ts +0 -12
  17. package/src/component/iot.ts +0 -52
  18. package/src/component/line.ts +0 -156
  19. package/src/component/register-default-groups.ts +0 -28
  20. package/src/component/shape.ts +0 -156
  21. package/src/component/table.ts +0 -28
  22. package/src/component/text-and-media.ts +0 -125
  23. package/src/component/warehouse.ts +0 -26
  24. package/src/data-storage/data-storage.ts +0 -76
  25. package/src/graphql/board.ts +0 -144
  26. package/src/graphql/data-subscription.ts +0 -30
  27. package/src/graphql/favorite-board.ts +0 -25
  28. package/src/graphql/group.ts +0 -138
  29. package/src/graphql/index.ts +0 -4
  30. package/src/graphql/play-group.ts +0 -225
  31. package/src/graphql/scenario.ts +0 -79
  32. package/src/index.ts +0 -10
  33. package/src/modeller/component-toolbar/component-detail.ts +0 -52
  34. package/src/modeller/component-toolbar/component-menu.ts +0 -196
  35. package/src/modeller/component-toolbar/component-toolbar.ts +0 -196
  36. package/src/modeller/component-toolbar/mode-icons.ts +0 -88
  37. package/src/modeller/edit-toolbar-style.ts +0 -232
  38. package/src/modeller/edit-toolbar.ts +0 -587
  39. package/src/modeller/property-sidebar/abstract-property.ts +0 -69
  40. package/src/modeller/property-sidebar/data-binding/data-binding-mapper.ts +0 -475
  41. package/src/modeller/property-sidebar/data-binding/data-binding-value-map.ts +0 -19
  42. package/src/modeller/property-sidebar/data-binding/data-binding-value-range.ts +0 -19
  43. package/src/modeller/property-sidebar/data-binding/data-binding.ts +0 -480
  44. package/src/modeller/property-sidebar/effects/effects-shared-style.ts +0 -62
  45. package/src/modeller/property-sidebar/effects/effects.ts +0 -69
  46. package/src/modeller/property-sidebar/effects/property-animation.ts +0 -146
  47. package/src/modeller/property-sidebar/effects/property-animations.ts +0 -93
  48. package/src/modeller/property-sidebar/effects/property-event-hover.ts +0 -200
  49. package/src/modeller/property-sidebar/effects/property-event-tap.ts +0 -251
  50. package/src/modeller/property-sidebar/effects/property-event.ts +0 -73
  51. package/src/modeller/property-sidebar/effects/property-shadow.ts +0 -114
  52. package/src/modeller/property-sidebar/effects/value-converter.ts +0 -23
  53. package/src/modeller/property-sidebar/inspector/inspector.ts +0 -404
  54. package/src/modeller/property-sidebar/property-shared-style.ts +0 -136
  55. package/src/modeller/property-sidebar/property-sidebar.ts +0 -326
  56. package/src/modeller/property-sidebar/shapes/box-padding-editor-styles.ts +0 -94
  57. package/src/modeller/property-sidebar/shapes/shapes.ts +0 -432
  58. package/src/modeller/property-sidebar/specifics/specific-properties-builder.ts +0 -152
  59. package/src/modeller/property-sidebar/specifics/specifics.ts +0 -81
  60. package/src/modeller/property-sidebar/styles/styles.ts +0 -577
  61. package/src/modeller/scene-viewer/confidential-overlay.ts +0 -18
  62. package/src/modeller/scene-viewer/ox-scene-handler.ts +0 -40
  63. package/src/modeller/scene-viewer/ox-scene-layer.ts +0 -42
  64. package/src/modeller/scene-viewer/ox-scene-property.ts +0 -10
  65. package/src/modeller/scene-viewer/ox-scene-viewer.ts +0 -263
  66. package/src/ox-board-component-info.ts +0 -236
  67. package/src/ox-board-list.ts +0 -401
  68. package/src/ox-board-modeller.ts +0 -408
  69. package/src/ox-board-player-style.ts +0 -200
  70. package/src/ox-board-player.ts +0 -333
  71. package/src/ox-board-template-list.ts +0 -267
  72. package/src/ox-board-template-viewer.ts +0 -198
  73. package/src/ox-board-viewer.ts +0 -727
  74. package/src/ox-editor-board-selector.ts +0 -91
  75. package/src/ox-property-editor-board-selector.ts +0 -23
  76. package/src/player/ox-board-player-carousel.ts +0 -197
  77. package/src/player/ox-board-player-grid.ts +0 -78
  78. package/src/player/ox-board-wrapper.ts +0 -152
  79. package/src/selector/board-creation-popup.ts +0 -151
  80. package/src/selector/board-thumbnail-card.ts +0 -175
  81. package/src/selector/ox-board-creation-card.ts +0 -98
  82. package/src/selector/ox-board-selector.ts +0 -382
  83. package/src/types.ts +0 -63
  84. package/stories/property-data-binding.stories.ts +0 -34
  85. package/tsconfig.json +0 -24
  86. package/web-dev-server.config.mjs +0 -30
  87. package/web-test-runner.config.mjs +0 -29
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@operato/board",
3
- "version": "7.1.31",
3
+ "version": "7.1.32",
4
4
  "description": "Webcomponent for board following open-wc recommendations",
5
5
  "author": "heartyoh",
6
6
  "main": "dist/src/index.js",
@@ -99,18 +99,18 @@
99
99
  "dependencies": {
100
100
  "@material/web": "^2.0.0",
101
101
  "@open-wc/scoped-elements": "^2.1.3",
102
- "@operato/app": "^7.1.31",
103
- "@operato/data-grist": "^7.1.31",
104
- "@operato/font": "^7.1.31",
105
- "@operato/graphql": "^7.1.1",
106
- "@operato/i18n": "^7.1.1",
107
- "@operato/input": "^7.1.30",
108
- "@operato/layout": "^7.1.30",
109
- "@operato/markdown": "^7.1.27",
110
- "@operato/popup": "^7.1.30",
111
- "@operato/property-editor": "^7.1.31",
112
- "@operato/styles": "^7.1.27",
113
- "@operato/utils": "^7.1.1",
102
+ "@operato/app": "^7.1.32",
103
+ "@operato/data-grist": "^7.1.32",
104
+ "@operato/font": "^7.1.32",
105
+ "@operato/graphql": "^7.1.32",
106
+ "@operato/i18n": "^7.1.32",
107
+ "@operato/input": "^7.1.32",
108
+ "@operato/layout": "^7.1.32",
109
+ "@operato/markdown": "^7.1.32",
110
+ "@operato/popup": "^7.1.32",
111
+ "@operato/property-editor": "^7.1.32",
112
+ "@operato/styles": "^7.1.32",
113
+ "@operato/utils": "^7.1.32",
114
114
  "@polymer/paper-dropdown-menu": "^3.2.0",
115
115
  "@types/file-saver": "^2.0.4",
116
116
  "@types/sortablejs": "^1.10.7",
@@ -159,5 +159,5 @@
159
159
  "prettier --write"
160
160
  ]
161
161
  },
162
- "gitHead": "c22b92c8fc82a72d6503aa7107df33aab985155a"
162
+ "gitHead": "c4f5ed0b63d49d02c5a155b592c0ecf681c92cf7"
163
163
  }
@@ -1,3 +0,0 @@
1
- module.exports = {
2
- stories: ['../dist/stories/**/*.stories.{js,md,mdx}']
3
- }
@@ -1,8 +0,0 @@
1
- import { storybookPlugin } from '@web/dev-server-storybook'
2
- import baseConfig from '../web-dev-server.config.mjs'
3
-
4
- export default /** @type {import('@web/dev-server').DevServerConfig} */ ({
5
- ...baseConfig,
6
- open: '/',
7
- plugins: [storybookPlugin({ type: 'web-components' }), ...baseConfig.plugins]
8
- })
@@ -1,112 +0,0 @@
1
- <!doctype html>
2
- <html lang="en-GB">
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
6
- <style>
7
- body {
8
- margin: 0;
9
- padding: 0;
10
- overflow: hidden;
11
-
12
- /* This is a font-stack that tries to use the system-default sans-serifs first */
13
- font-family: Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
14
- line-height: 1.5;
15
- -webkit-font-smoothing: antialiased;
16
- }
17
-
18
- ox-board-modeller {
19
- width: 100vw;
20
- height: 100dvh;
21
- }
22
- </style>
23
- <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
24
- <link
25
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
26
- rel="stylesheet"
27
- />
28
- <link
29
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
30
- rel="stylesheet"
31
- />
32
- <link
33
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
34
- rel="stylesheet"
35
- />
36
- </head>
37
- <body>
38
- <div id="demo"></div>
39
- <script type="module">
40
- import { html, render } from 'lit'
41
- import '../dist/src/ox-board-modeller.js'
42
- import { ReferenceMap, create, error } from '@hatiolab/things-scene'
43
-
44
- const colors = ['red', 'blue', 'orange', 'yellow', 'magenta', 'violet', 'navy', 'green', 'cyan', 'lime']
45
- const boards = colors.map((color, idx) => {
46
- var to = colors[(idx + 1) % colors.length]
47
- return {
48
- id: color,
49
- model: {
50
- width: 400,
51
- height: 300,
52
- fillStyle: color,
53
- components: [
54
- {
55
- type: 'text',
56
- left: 100,
57
- top: 100,
58
- width: 200,
59
- height: 30,
60
- text: `Click to move to ${to}`,
61
- event: {
62
- tap: {
63
- action: 'goto',
64
- target: to
65
- }
66
- }
67
- }
68
- ]
69
- }
70
- }
71
- })
72
-
73
- var provider = new ReferenceMap(
74
- async (boardId, resolve, reject) => {
75
- try {
76
- const board = boards.find(board => {
77
- return board.id === boardId
78
- })
79
- if (!board) {
80
- throw `no board named as ${boardId}`
81
- }
82
-
83
- var scene
84
-
85
- try {
86
- scene = await provider.get(boardId)
87
- console.warn('Board fetched more than twice.', boardId)
88
- } catch (e) {
89
- scene = create({
90
- model: JSON.parse(JSON.stringify(board.model)),
91
- mode: 0,
92
- refProvider: provider
93
- })
94
- }
95
- resolve(scene, board)
96
- } catch (e) {
97
- error(e)
98
- reject(e)
99
- }
100
- },
101
- async (id, ref) => {
102
- ref.dispose()
103
- }
104
- )
105
-
106
- render(
107
- html` <ox-board-modeller .board=${boards[0]} .provider=${provider}> </ox-board-modeller> `,
108
- document.querySelector('#demo')
109
- )
110
- </script>
111
- </body>
112
- </html>
@@ -1,112 +0,0 @@
1
- <!doctype html>
2
- <html lang="en-GB">
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
6
- <style>
7
- body {
8
- margin: 0;
9
- padding: 0;
10
- overflow: hidden;
11
-
12
- /* This is a font-stack that tries to use the system-default sans-serifs first */
13
- font-family: Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
14
- line-height: 1.5;
15
- -webkit-font-smoothing: antialiased;
16
- }
17
-
18
- ox-board-player {
19
- width: 100vw;
20
- height: 100dvh;
21
- }
22
- </style>
23
- <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
24
- <link
25
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
26
- rel="stylesheet"
27
- />
28
- <link
29
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
30
- rel="stylesheet"
31
- />
32
- <link
33
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
34
- rel="stylesheet"
35
- />
36
- </head>
37
- <body>
38
- <div id="demo"></div>
39
- <script type="module">
40
- import { html, render } from 'lit'
41
- import '../dist/src/index.js'
42
- import { ReferenceMap, create, error } from '@hatiolab/things-scene'
43
-
44
- const colors = ['red', 'blue', 'orange', 'yellow', 'magenta', 'violet', 'navy', 'green', 'cyan', 'lime']
45
- const boards = colors.map((color, idx) => {
46
- var to = colors[(idx + 1) % colors.length]
47
- return {
48
- id: color,
49
- model: {
50
- width: 400,
51
- height: 300,
52
- fillStyle: color,
53
- components: [
54
- {
55
- type: 'text',
56
- left: 100,
57
- top: 100,
58
- width: 200,
59
- height: 30,
60
- text: `Click to move to ${to}`,
61
- event: {
62
- tap: {
63
- action: 'goto',
64
- target: to
65
- }
66
- }
67
- }
68
- ]
69
- }
70
- }
71
- })
72
-
73
- var provider = new ReferenceMap(
74
- async (boardId, resolve, reject) => {
75
- try {
76
- const board = boards.find(board => {
77
- return board.id === boardId
78
- })
79
- if (!board) {
80
- throw `no board named as ${boardId}`
81
- }
82
-
83
- var scene
84
-
85
- try {
86
- scene = await provider.get(boardId)
87
- console.warn('Board fetched more than twice.', boardId)
88
- } catch (e) {
89
- scene = create({
90
- model: JSON.parse(JSON.stringify(board.model)),
91
- mode: 0,
92
- refProvider: provider
93
- })
94
- }
95
- resolve(scene, board)
96
- } catch (e) {
97
- error(e)
98
- reject(e)
99
- }
100
- },
101
- async (id, ref) => {
102
- ref.dispose()
103
- }
104
- )
105
-
106
- render(
107
- html` <ox-board-player .boards=${boards} .provider=${provider}></ox-board-player> `,
108
- document.querySelector('#demo')
109
- )
110
- </script>
111
- </body>
112
- </html>
@@ -1,112 +0,0 @@
1
- <!doctype html>
2
- <html lang="en-GB">
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
6
- <style>
7
- body {
8
- margin: 0;
9
- padding: 0;
10
- overflow: hidden;
11
-
12
- /* This is a font-stack that tries to use the system-default sans-serifs first */
13
- font-family: Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
14
- line-height: 1.5;
15
- -webkit-font-smoothing: antialiased;
16
- }
17
-
18
- ox-board-viewer {
19
- width: 100vw;
20
- height: 100dvh;
21
- }
22
- </style>
23
- <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
24
- <link
25
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
26
- rel="stylesheet"
27
- />
28
- <link
29
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
30
- rel="stylesheet"
31
- />
32
- <link
33
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
34
- rel="stylesheet"
35
- />
36
- </head>
37
- <body>
38
- <div id="demo"></div>
39
- <script type="module">
40
- import { html, render } from 'lit'
41
- import '../dist/src/ox-board-viewer.js'
42
- import { ReferenceMap, create, error } from '@hatiolab/things-scene'
43
-
44
- const colors = ['red', 'blue', 'orange', 'yellow', 'magenta', 'violet', 'navy', 'green', 'cyan', 'lime']
45
- const boards = colors.map((color, idx) => {
46
- var to = colors[(idx + 1) % colors.length]
47
- return {
48
- id: color,
49
- model: {
50
- width: 400,
51
- height: 300,
52
- fillStyle: color,
53
- components: [
54
- {
55
- type: 'text',
56
- left: 100,
57
- top: 100,
58
- width: 200,
59
- height: 30,
60
- text: `Click to move to ${to}`,
61
- event: {
62
- tap: {
63
- action: 'goto',
64
- target: to
65
- }
66
- }
67
- }
68
- ]
69
- }
70
- }
71
- })
72
-
73
- var provider = new ReferenceMap(
74
- async (boardId, resolve, reject) => {
75
- try {
76
- const board = boards.find(board => {
77
- return board.id === boardId
78
- })
79
- if (!board) {
80
- throw `no board named as ${boardId}`
81
- }
82
-
83
- var scene
84
-
85
- try {
86
- scene = await provider.get(boardId)
87
- console.warn('Board fetched more than twice.', boardId)
88
- } catch (e) {
89
- scene = create({
90
- model: JSON.parse(JSON.stringify(board.model)),
91
- mode: 0,
92
- refProvider: provider
93
- })
94
- }
95
- resolve(scene, board)
96
- } catch (e) {
97
- error(e)
98
- reject(e)
99
- }
100
- },
101
- async (id, ref) => {
102
- ref.dispose()
103
- }
104
- )
105
-
106
- render(
107
- html` <ox-board-viewer .board=${boards[0]} .provider=${provider}></ox-board-viewer> `,
108
- document.querySelector('#demo')
109
- )
110
- </script>
111
- </body>
112
- </html>
package/demo/index.html DELETED
@@ -1,112 +0,0 @@
1
- <!doctype html>
2
- <html lang="en-GB">
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
6
- <style>
7
- body {
8
- margin: 0;
9
- padding: 0;
10
- overflow: hidden;
11
-
12
- /* This is a font-stack that tries to use the system-default sans-serifs first */
13
- font-family: Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
14
- line-height: 1.5;
15
- -webkit-font-smoothing: antialiased;
16
- }
17
-
18
- ox-board-viewer {
19
- width: 100vw;
20
- height: 100dvh;
21
- }
22
- </style>
23
- <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
24
- <link
25
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
26
- rel="stylesheet"
27
- />
28
- <link
29
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
30
- rel="stylesheet"
31
- />
32
- <link
33
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
34
- rel="stylesheet"
35
- />
36
- </head>
37
- <body>
38
- <div id="demo"></div>
39
- <script type="module">
40
- import { html, render } from 'lit'
41
- import '../dist/src/ox-board-viewer.js'
42
- import { ReferenceMap, create, error } from '@hatiolab/things-scene'
43
-
44
- const colors = ['red', 'blue', 'orange', 'yellow', 'magenta', 'violet', 'navy', 'green', 'cyan', 'lime']
45
- const boards = colors.map((color, idx) => {
46
- var to = colors[(idx + 1) % colors.length]
47
- return {
48
- id: color,
49
- model: {
50
- width: 400,
51
- height: 300,
52
- fillStyle: color,
53
- components: [
54
- {
55
- type: 'text',
56
- left: 100,
57
- top: 100,
58
- width: 200,
59
- height: 30,
60
- text: `Click to move to ${to}`,
61
- event: {
62
- tap: {
63
- action: 'goto',
64
- target: to
65
- }
66
- }
67
- }
68
- ]
69
- }
70
- }
71
- })
72
-
73
- var provider = new ReferenceMap(
74
- async (boardId, resolve, reject) => {
75
- try {
76
- const board = boards.find(board => {
77
- return board.id === boardId
78
- })
79
- if (!board) {
80
- throw `no board named as ${boardId}`
81
- }
82
-
83
- var scene
84
-
85
- try {
86
- scene = await provider.get(boardId)
87
- console.warn('Board fetched more than twice.', boardId)
88
- } catch (e) {
89
- scene = create({
90
- model: JSON.parse(JSON.stringify(board.model)),
91
- mode: 0,
92
- refProvider: provider
93
- })
94
- }
95
- resolve(scene, board)
96
- } catch (e) {
97
- error(e)
98
- reject(e)
99
- }
100
- },
101
- async (id, ref) => {
102
- ref.dispose()
103
- }
104
- )
105
-
106
- render(
107
- html` <ox-board-viewer .board=${boards[0]} .provider=${provider}></ox-board-viewer> `,
108
- document.querySelector('#demo')
109
- )
110
- </script>
111
- </body>
112
- </html>
@@ -1,29 +0,0 @@
1
- import { ComponentGroup } from '../types'
2
-
3
- const icon = `
4
- <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 30 30" style="enable-background:new 0 0 30 30;" xml:space="preserve">
5
- <style type="text/css">
6
- .st0{fill:{{strokeColor}};}
7
- .st7{fill:none;stroke:{{strokeColor}};stroke-width:1.5;stroke-miterlimit:10;}
8
- .st9{fill:none;stroke:{{strokeColor}};stroke-miterlimit:10;}
9
- </style>
10
- <g>
11
- <polygon class="st7" points="15.3,10.5 7.3,13.6 7.3,22.8 15,26.1 22.9,22.8 22.9,14.1"/>
12
- <polygon class="st0" points="22.2,22.5 14.8,26.1 14.5,16.6 22.2,14.1"/>
13
- <line class="st9" x1="15.1" y1="4.2" x2="15.1" y2="10.4"/>
14
- <polyline class="st9" points="13.3,5.6 15.1,3.8 17,5.6"/>
15
- <line class="st9" x1="27.9" y1="25.2" x2="22.4" y2="22.4"/>
16
- <polyline class="st9" points="27.5,22.9 28.3,25.4 25.8,26.2"/>
17
- <line class="st9" x1="2.1" y1="25.2" x2="7.6" y2="22.4"/>
18
- <polyline class="st9" points="2.5,22.9 1.7,25.4 4.2,26.2"/>
19
- <line class="st9" x1="7.9" y1="14.1" x2="15.5" y2="17.4"/>
20
- </g>
21
- </svg>
22
- `
23
-
24
- export const threed: ComponentGroup = {
25
- name: '3D',
26
- description: 'a group of various 3D base components',
27
- icon,
28
- templates: []
29
- }
@@ -1,28 +0,0 @@
1
- import { ComponentGroup } from '../types'
2
-
3
- const icon = `
4
- <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 30 30" style="enable-background:new 0 0 30 30;" xml:space="preserve">
5
- <style type="text/css">
6
- .st7{fill:none;stroke:{{strokeColor}};stroke-width:1.5;stroke-miterlimit:10;}
7
- .st8{fill:none;stroke:{{strokeColor}};stroke-width:3;stroke-miterlimit:10;}
8
- .st9{fill:none;stroke:{{strokeColor}};stroke-miterlimit:10;}
9
- </style>
10
- <g>
11
- <line class="st7" x1="1.9" y1="25" x2="28.1" y2="25"/>
12
- <line class="st8" x1="5.3" y1="22.8" x2="5.3" y2="18.1"/>
13
- <line class="st8" x1="10.2" y1="22.8" x2="10.2" y2="15.1"/>
14
- <line class="st8" x1="15.1" y1="22.8" x2="15.1" y2="18.1"/>
15
- <line class="st8" x1="20" y1="22.8" x2="20" y2="13.1"/>
16
- <line class="st8" x1="25" y1="22.8" x2="25" y2="10.1"/>
17
- <polyline class="st9" points="4.7,15.7 9.6,9.7 14.9,15.1 25.2,5"/>
18
- </g>
19
- </svg>
20
-
21
- `
22
-
23
- export const chartAndGauge: ComponentGroup = {
24
- name: 'chartAndGauge',
25
- description: 'a group of various charts and gauges',
26
- icon,
27
- templates: []
28
- }
@@ -1,63 +0,0 @@
1
- import { ComponentGroup } from '../types'
2
-
3
- const iconContainer = new URL('../../../icons/components/container.png', import.meta.url).href
4
- const popup = new URL('../../../icons/components/popup.png', import.meta.url).href
5
-
6
- const icon = `
7
- <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 30 30" style="enable-background:new 0 0 30 30;" xml:space="preserve">
8
- <style type="text/css">
9
- .st0{fill:{{strokeColor}};}
10
- .st3{fill:none;stroke:{{strokeColor}};stroke-width:2;stroke-linecap:round;stroke-miterlimit:10;}
11
- .st9{fill:none;stroke:{{strokeColor}};stroke-miterlimit:10;}
12
- </style>
13
- <g>
14
- <rect x="2.8" y="10.3" class="st9" width="24.4" height="13.8"/>
15
- <polygon class="st0" points="27.7,9.8 2.3,9.8 7.8,5.9 22.2,5.9"/>
16
- <line class="st3" x1="10.9" y1="15.5" x2="19.1" y2="15.5"/>
17
- </g>
18
- </svg>
19
- `
20
-
21
- export const container: ComponentGroup = {
22
- name: 'container',
23
- description: 'a group of various containers',
24
- icon,
25
- templates: [
26
- {
27
- type: 'container',
28
- description: 'general container',
29
- icon: iconContainer,
30
- group: 'container',
31
- model: {
32
- type: 'container',
33
- left: 100,
34
- top: 100,
35
- width: 100,
36
- height: 100,
37
- fillStyle: '#fff',
38
- strokeStyle: '#999',
39
- alpha: 1,
40
- hidden: false,
41
- lineWidth: 1,
42
- lineDash: 'solid',
43
- lineCap: 'butt'
44
- }
45
- },
46
- {
47
- type: 'popup',
48
- description: 'popup window',
49
- icon: popup,
50
- group: 'container',
51
- model: {
52
- type: 'popup',
53
- left: 100,
54
- top: 100,
55
- width: 100,
56
- height: 100,
57
- fillStyle: '#fff',
58
- strokeStyle: 'DarkGoldenRod',
59
- hidden: true
60
- }
61
- }
62
- ]
63
- }
@@ -1,30 +0,0 @@
1
- import { ComponentGroup } from '../types'
2
-
3
- const icon = `
4
- <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 30 30" style="enable-background:new 0 0 30 30;" xml:space="preserve">
5
- <style type="text/css">
6
- .st0{fill:none;stroke:{{strokeColor}};stroke-width:1.5;stroke-miterlimit:10;}
7
- .st1{fill:{{strokeColor}};stroke:{{strokeColor}};stroke-width:0.5;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
8
- .st2{fill:{{strokeColor}};stroke:{{strokeColor}};stroke-width:0.5;stroke-miterlimit:10;}
9
- .st3{fill:{{strokeColor}};}
10
- </style>
11
- <g>
12
- <path class="st0" d="M11.9,22.4H4.6c-4.9,0-4.2-8.5,0.2-9.3c0,0,1.3-6.5,6.2-3c0,0,2.3-5.7,7.5-4.7c0,0,6.3,0.3,6,7.3
13
- c0-0.1,2.1,0.9,2.3,1c3.1,1.9,2.9,7.3-0.6,8.7h-7"/>
14
- <path class="st1" d="M12.6,20c-0.1-0.1-0.1-0.2,0-0.3c0.8-0.7,1.8-1.2,2.9-1.2s2.1,0.4,2.9,1.2c0.1,0.1,0.1,0.2,0,0.3
15
- c-0.1,0.1-0.2,0.1-0.3,0c-0.7-0.7-1.6-1-2.6-1s-1.9,0.4-2.6,1.1C12.7,20.2,12.6,20.1,12.6,20z"/>
16
- <path class="st1" d="M10.8,17.9c-0.1-0.1-0.1-0.2,0-0.3c1.3-1.2,3-1.9,4.8-1.9s3.5,0.7,4.8,1.9c0.1,0.1,0.1,0.2,0,0.3
17
- C20.2,18,20.1,18,20,18c-1.2-1.1-2.8-1.8-4.5-1.8S12.2,16.8,11,18C11,18,10.8,18,10.8,17.9z"/>
18
- <path class="st2" d="M9.5,15.8c-0.1-0.1-0.1-0.2,0-0.3c1.6-1.6,3.8-2.4,6.1-2.4s4.4,0.9,6,2.4c0.1,0.1,0.1,0.2,0,0.3
19
- s-0.2,0.1-0.3,0c-1.6-1.5-3.6-2.3-5.8-2.3s-4.2,0.8-5.8,2.3C9.7,15.9,9.5,15.9,9.5,15.8z"/>
20
- <circle class="st3" cx="15.5" cy="23.2" r="1.5"/>
21
- </g>
22
- </svg>
23
- `
24
-
25
- export const dataSource: ComponentGroup = {
26
- name: 'dataSource',
27
- description: 'a group of various data sources',
28
- icon,
29
- templates: []
30
- }