@kizmann/nano-ui 0.9.10 → 1.0.1

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 (294) hide show
  1. package/README.md +1 -1
  2. package/dist/nano-ui.css +1 -2
  3. package/dist/nano-ui.js +3 -3
  4. package/dist/nano-ui.js.map +1 -1
  5. package/dist/themes/dark.css +1 -2
  6. package/dist/themes/light.css +1 -2
  7. package/package.json +25 -12
  8. package/src/alert/src/alert/alert.scss +5 -4
  9. package/src/button/src/button/button.scss +5 -5
  10. package/src/button/src/button-group/button-group.scss +5 -4
  11. package/src/cascader/src/cascader/cascader.scss +5 -4
  12. package/src/cascader/src/cascader-panel/cascader-panel.scss +5 -4
  13. package/src/checkbox/src/checkbox/checkbox.scss +5 -4
  14. package/src/checkbox/src/checkbox-group/checkbox-group.scss +5 -4
  15. package/src/collapse/src/collapse/collapse.scss +5 -4
  16. package/src/collapse/src/collapse-item/collapse-item.scss +5 -4
  17. package/src/config/src/builder/builder.scss +17 -13
  18. package/src/config/src/reference-panel/reference-panel.scss +7 -4
  19. package/src/confirm/src/confirm/confirm.scss +5 -4
  20. package/src/datepicker/src/datepicker/datepicker.scss +5 -4
  21. package/src/datepicker/src/datepicker-panel/datepicker-panel.scss +5 -4
  22. package/src/datetimepicker/src/datetimepicker/datetimepicker.js +0 -4
  23. package/src/datetimepicker/src/datetimepicker/datetimepicker.scss +5 -4
  24. package/src/draggable/src/draggrid/draggrid.scss +5 -4
  25. package/src/draggable/src/draggrid-item/draggrid-item.scss +5 -4
  26. package/src/draggable/src/draglist/draglist.scss +5 -4
  27. package/src/draggable/src/draglist-item/draglist-item.scss +5 -4
  28. package/src/draggable/src/dropzone/dropzone.scss +5 -4
  29. package/src/drawer/index.js +5 -0
  30. package/src/drawer/index.scss +1 -0
  31. package/src/drawer/src/drawer/drawer.js +431 -0
  32. package/src/drawer/src/drawer/drawer.scss +136 -0
  33. package/src/durationpicker/src/durationpicker/durationpicker.scss +5 -4
  34. package/src/empty/src/empty-icon/empty-icon.scss +5 -4
  35. package/src/form/index.js +6 -0
  36. package/src/form/index.scss +2 -0
  37. package/src/form/src/form/form.js +11 -1
  38. package/src/form/src/form-frame/form-frame.js +42 -0
  39. package/src/form/src/form-frame/form-frame.scss +28 -0
  40. package/src/form/src/form-frame-item/form-frame-item.js +114 -0
  41. package/src/form/src/form-group/form-group.js +33 -1
  42. package/src/form/src/form-group/form-group.scss +5 -4
  43. package/src/form/src/form-item/form-item.scss +5 -4
  44. package/src/form/src/form-menu/form-menu.js +89 -0
  45. package/src/form/src/form-menu/form-menu.scss +9 -0
  46. package/src/index.js +1 -0
  47. package/src/index.scss +1 -0
  48. package/src/info/src/info/info.scss +5 -4
  49. package/src/info/src/info-column/info-column.scss +7 -4
  50. package/src/input/src/input/input.scss +5 -4
  51. package/src/input-number/src/input-number/input-number.scss +5 -4
  52. package/src/loader/src/loader/loader.scss +5 -4
  53. package/src/modal/src/modal/modal.scss +5 -4
  54. package/src/notification/src/notification/notification.scss +5 -4
  55. package/src/paginator/src/paginator/paginator.scss +5 -4
  56. package/src/popover/src/popover/popover.scss +5 -4
  57. package/src/radio/src/radio/radio.scss +5 -4
  58. package/src/radio/src/radio-group/radio-group.scss +5 -4
  59. package/src/rating/src/rating/rating.scss +5 -4
  60. package/src/root/vars.scss +84 -81
  61. package/src/select/src/select/select.scss +5 -4
  62. package/src/slider/src/slider/slider.scss +5 -4
  63. package/src/switch/src/switch/switch.scss +6 -4
  64. package/src/table/src/table/table.scss +15 -0
  65. package/src/table/src/table-cell/table-cell.scss +5 -4
  66. package/src/tabs/src/tabs/tabs.scss +5 -4
  67. package/src/tabs/src/tabs-item/tabs-item.scss +5 -4
  68. package/src/tags/src/tags-item/tags-item.scss +5 -4
  69. package/src/textarea/src/textarea/textarea.scss +5 -4
  70. package/src/timepicker/src/timepicker/timepicker.scss +5 -4
  71. package/src/timepicker/src/timepicker-panel/timepicker-panel.scss +5 -4
  72. package/src/transfer/src/transfer/transfer.scss +5 -4
  73. package/themes/macos/alert/src/alert/alert.scss +4 -3
  74. package/themes/macos/button/src/button/button.scss +8 -3
  75. package/themes/macos/cascader/src/cascader/cascader.scss +5 -4
  76. package/themes/macos/checkbox/src/checkbox/checkbox.scss +5 -4
  77. package/themes/macos/collapse/src/collapse/collapse.scss +4 -3
  78. package/themes/macos/collapse/src/collapse-item/collapse-item.scss +4 -3
  79. package/themes/macos/confirm/src/confirm/confirm.scss +4 -3
  80. package/themes/macos/datepicker/src/datepicker/datepicker.scss +5 -4
  81. package/themes/macos/datepicker/src/datepicker-panel/datepicker-panel.scss +4 -3
  82. package/themes/macos/datetimepicker/src/datetimepicker/datetimepicker.scss +14 -12
  83. package/themes/macos/draggable/src/draggrid/draggrid.scss +4 -3
  84. package/themes/macos/draggable/src/draggrid-item/draggrid-item.scss +4 -3
  85. package/themes/macos/draggable/src/draglist/draglist.scss +4 -3
  86. package/themes/macos/draggable/src/draglist-item/draglist-item.scss +6 -5
  87. package/themes/macos/draggable/src/dropzone/dropzone.scss +4 -3
  88. package/themes/macos/drawer/index.scss +1 -0
  89. package/themes/macos/drawer/src/drawer/drawer.scss +35 -0
  90. package/themes/macos/durationpicker/src/durationpicker/durationpicker.scss +5 -4
  91. package/themes/macos/file/src/file/file.scss +4 -3
  92. package/themes/macos/form/src/form-group/form-group.scss +4 -3
  93. package/themes/macos/index-dark.scss +1 -39
  94. package/themes/macos/index-light.scss +1 -39
  95. package/themes/macos/index.scss +1 -2
  96. package/themes/macos/input/src/input/input.scss +6 -5
  97. package/themes/macos/input-number/src/input-number/input-number.scss +6 -5
  98. package/themes/macos/loader/src/loader/loader.scss +4 -3
  99. package/themes/macos/modal/src/modal/modal.scss +6 -5
  100. package/themes/macos/notification/src/notification/notification.scss +4 -3
  101. package/themes/macos/popover/src/popover/popover.scss +9 -8
  102. package/themes/macos/radio/src/radio/radio.scss +5 -4
  103. package/themes/macos/rating/src/rating/rating.scss +4 -3
  104. package/themes/macos/root/vars-dark.scss +87 -74
  105. package/themes/macos/root/vars-light.scss +87 -74
  106. package/themes/macos/root/vars.scss +88 -74
  107. package/themes/macos/select/src/select/select.scss +5 -4
  108. package/themes/macos/switch/src/switch/switch.scss +6 -4
  109. package/themes/macos/table/src/table/table.scss +3 -3
  110. package/themes/macos/table/src/table-cell/table-cell.scss +5 -4
  111. package/themes/macos/tabs/src/tabs/tabs.scss +4 -3
  112. package/themes/macos/tabs/src/tabs-item/tabs-item.scss +4 -3
  113. package/themes/macos/tags/src/tags-item/tags-item.scss +6 -4
  114. package/themes/macos/textarea/src/textarea/textarea.scss +5 -4
  115. package/themes/macos/timepicker/src/timepicker/timepicker.scss +5 -4
  116. package/themes/macos/timepicker/src/timepicker-panel/timepicker-panel.scss +4 -3
  117. package/babel.config.js +0 -17
  118. package/bun.lockb +0 -0
  119. package/demos/builder.html +0 -411
  120. package/demos/button/index.html +0 -129
  121. package/demos/cascader/index.html +0 -127
  122. package/demos/chart/index.html +0 -53
  123. package/demos/checkbox/index.html +0 -97
  124. package/demos/config/index.html +0 -95
  125. package/demos/confirm/index.html +0 -78
  126. package/demos/datepicker/index.html +0 -69
  127. package/demos/draggable/index.html +0 -127
  128. package/demos/form/index.html +0 -83
  129. package/demos/grid.html +0 -321
  130. package/demos/input/index.html +0 -100
  131. package/demos/map/index.html +0 -81
  132. package/demos/matrix/index.html +0 -104
  133. package/demos/modal/index.html +0 -98
  134. package/demos/overview.html +0 -1416
  135. package/demos/paginator/index.html +0 -58
  136. package/demos/popover/index.html +0 -103
  137. package/demos/radio/index.html +0 -71
  138. package/demos/resizer/index.html +0 -106
  139. package/demos/scrollbar.html +0 -328
  140. package/demos/select/index.html +0 -174
  141. package/demos/select.html +0 -164
  142. package/demos/style.css +0 -50
  143. package/demos/switch/index.html +0 -69
  144. package/demos/table/index.html +0 -126
  145. package/demos/tabs/index.html +0 -110
  146. package/demos/tabs.html +0 -293
  147. package/demos/textarea/index.html +0 -77
  148. package/demos/timepicker/index.html +0 -66
  149. package/demos/transfer/index.html +0 -88
  150. package/demos/wysiwyg/index.html +0 -49
  151. package/docs/README.md +0 -34
  152. package/docs/_sidebar.md +0 -36
  153. package/docs/dist/docs.css +0 -2
  154. package/docs/files/data/draggable.md +0 -143
  155. package/docs/files/data/map.md +0 -1
  156. package/docs/files/data/paginator.md +0 -23
  157. package/docs/files/data/table.md +0 -247
  158. package/docs/files/data/virtualscroller.md +0 -2
  159. package/docs/files/form/button.md +0 -122
  160. package/docs/files/form/cascader.md +0 -164
  161. package/docs/files/form/checkbox.md +0 -179
  162. package/docs/files/form/datepicker.md +0 -78
  163. package/docs/files/form/form.md +0 -52
  164. package/docs/files/form/input.md +0 -90
  165. package/docs/files/form/radio.md +0 -150
  166. package/docs/files/form/select.md +0 -202
  167. package/docs/files/form/switch.md +0 -92
  168. package/docs/files/form/textarea.md +0 -102
  169. package/docs/files/form/timepicker.md +0 -78
  170. package/docs/files/form/transfer.md +0 -30
  171. package/docs/files/others/config.md +0 -8
  172. package/docs/files/others/confirm.md +0 -51
  173. package/docs/files/others/loader.md +0 -22
  174. package/docs/files/others/modal.md +0 -32
  175. package/docs/files/others/notification.md +0 -52
  176. package/docs/files/others/popover.md +0 -36
  177. package/docs/files/others/resizer.md +0 -8
  178. package/docs/files/others/scrollbar.md +0 -8
  179. package/docs/files/others/tabs.md +0 -32
  180. package/docs/index.html +0 -176
  181. package/docs/src/scss/docsify/basic/_coverpage.sass +0 -95
  182. package/docs/src/scss/docsify/basic/_layout.sass +0 -472
  183. package/docs/src/scss/docsify/syntax.scss +0 -139
  184. package/docs/src/scss/docsify/vue.sass +0 -250
  185. package/docs/src/scss/index.scss +0 -448
  186. package/docs/src/scss/mixins/base.scss +0 -14
  187. package/docs/src/scss/mixins/grid.scss +0 -212
  188. package/docs/src/scss/mixins/media.scss +0 -34
  189. package/docs/src/scss/mixins/space.scss +0 -61
  190. package/mix-manifest.json +0 -4
  191. package/nano.svg +0 -52
  192. package/postcss.config.js +0 -14
  193. package/themes/light/alert/index.scss +0 -1
  194. package/themes/light/alert/src/alert/alert.scss +0 -26
  195. package/themes/light/button/index.scss +0 -2
  196. package/themes/light/button/src/button/button.scss +0 -46
  197. package/themes/light/button/src/button-group/button-group.scss +0 -1
  198. package/themes/light/cascader/index.scss +0 -2
  199. package/themes/light/cascader/src/cascader/cascader.scss +0 -45
  200. package/themes/light/cascader/src/cascader-panel/cascader-panel.scss +0 -13
  201. package/themes/light/checkbox/index.scss +0 -2
  202. package/themes/light/checkbox/src/checkbox/checkbox.scss +0 -44
  203. package/themes/light/checkbox/src/checkbox-group/checkbox-group.scss +0 -1
  204. package/themes/light/collapse/index.scss +0 -2
  205. package/themes/light/collapse/src/collapse/collapse.scss +0 -21
  206. package/themes/light/collapse/src/collapse-item/collapse-item.scss +0 -21
  207. package/themes/light/confirm/index.scss +0 -1
  208. package/themes/light/confirm/src/confirm/confirm.scss +0 -13
  209. package/themes/light/datepicker/index.scss +0 -2
  210. package/themes/light/datepicker/src/datepicker/datepicker.scss +0 -49
  211. package/themes/light/datepicker/src/datepicker-panel/datepicker-panel.scss +0 -43
  212. package/themes/light/datetimepicker/index.scss +0 -1
  213. package/themes/light/datetimepicker/src/datetimepicker/datetimepicker.scss +0 -49
  214. package/themes/light/demo/index.scss +0 -1
  215. package/themes/light/demo/src/demo/demo.scss +0 -11
  216. package/themes/light/draggable/index.scss +0 -9
  217. package/themes/light/draggable/src/draggrid/draggrid.scss +0 -13
  218. package/themes/light/draggable/src/draggrid-item/draggrid-item.scss +0 -65
  219. package/themes/light/draggable/src/draghandler/draghandler.scss +0 -15
  220. package/themes/light/draggable/src/draglist/draglist.scss +0 -13
  221. package/themes/light/draggable/src/draglist-item/draglist-item.scss +0 -72
  222. package/themes/light/draggable/src/dropzone/dropzone.scss +0 -13
  223. package/themes/light/durationpicker/index.scss +0 -1
  224. package/themes/light/durationpicker/src/durationpicker/durationpicker.scss +0 -49
  225. package/themes/light/empty/index.scss +0 -1
  226. package/themes/light/empty/src/empty-icon/empty-icon.scss +0 -13
  227. package/themes/light/file/index.scss +0 -1
  228. package/themes/light/file/src/file/file.scss +0 -38
  229. package/themes/light/form/index.scss +0 -3
  230. package/themes/light/form/src/form/form.scss +0 -1
  231. package/themes/light/form/src/form-group/form-group.scss +0 -17
  232. package/themes/light/form/src/form-item/form-item.scss +0 -29
  233. package/themes/light/index.scss +0 -38
  234. package/themes/light/info/index.scss +0 -3
  235. package/themes/light/info/src/info/info.scss +0 -5
  236. package/themes/light/info/src/info-column/info-column.scss +0 -5
  237. package/themes/light/info/src/info-field/info-field.scss +0 -5
  238. package/themes/light/input/index.scss +0 -1
  239. package/themes/light/input/src/input/input.scss +0 -37
  240. package/themes/light/input-number/index.scss +0 -1
  241. package/themes/light/input-number/src/input-number/input-number.scss +0 -46
  242. package/themes/light/loader/index.scss +0 -1
  243. package/themes/light/loader/src/loader/loader.scss +0 -21
  244. package/themes/light/map/index.scss +0 -1
  245. package/themes/light/map/src/map/map.scss +0 -1
  246. package/themes/light/modal/index.scss +0 -1
  247. package/themes/light/modal/src/modal/modal.scss +0 -51
  248. package/themes/light/notification/index.scss +0 -1
  249. package/themes/light/notification/src/notification/notification.scss +0 -24
  250. package/themes/light/paginator/index.scss +0 -1
  251. package/themes/light/paginator/src/paginator/paginator.scss +0 -5
  252. package/themes/light/popover/index.scss +0 -1
  253. package/themes/light/popover/src/popover/popover.scss +0 -100
  254. package/themes/light/radio/index.scss +0 -2
  255. package/themes/light/radio/src/radio/radio.scss +0 -44
  256. package/themes/light/radio/src/radio-group/radio-group.scss +0 -1
  257. package/themes/light/rating/index.scss +0 -1
  258. package/themes/light/rating/src/rating/rating.scss +0 -18
  259. package/themes/light/resizer/index.scss +0 -1
  260. package/themes/light/resizer/src/resizer/resizer.scss +0 -5
  261. package/themes/light/root/vars.scss +0 -183
  262. package/themes/light/scrollbar/index.scss +0 -1
  263. package/themes/light/scrollbar/src/scrollbar/scrollbar.scss +0 -6
  264. package/themes/light/select/index.scss +0 -2
  265. package/themes/light/select/src/select/select.scss +0 -46
  266. package/themes/light/select/src/select-option/select-option.scss +0 -1
  267. package/themes/light/switch/index.scss +0 -1
  268. package/themes/light/switch/src/switch/switch.scss +0 -28
  269. package/themes/light/table/index.scss +0 -4
  270. package/themes/light/table/src/table/table.scss +0 -14
  271. package/themes/light/table/src/table-cell/table-cell.scss +0 -50
  272. package/themes/light/table/src/table-column/table-column.scss +0 -32
  273. package/themes/light/table/src/table-filter/table-filter.scss +0 -1
  274. package/themes/light/tabs/index.scss +0 -2
  275. package/themes/light/tabs/src/tabs/tabs.scss +0 -21
  276. package/themes/light/tabs/src/tabs-item/tabs-item.scss +0 -18
  277. package/themes/light/tags/index.scss +0 -2
  278. package/themes/light/tags/src/tags/tags.scss +0 -1
  279. package/themes/light/tags/src/tags-item/tags-item.scss +0 -28
  280. package/themes/light/textarea/index.scss +0 -1
  281. package/themes/light/textarea/src/textarea/textarea.scss +0 -29
  282. package/themes/light/timepicker/index.scss +0 -2
  283. package/themes/light/timepicker/src/timepicker/timepicker.scss +0 -49
  284. package/themes/light/timepicker/src/timepicker-panel/timepicker-panel.scss +0 -26
  285. package/themes/light/transfer/index.scss +0 -1
  286. package/themes/light/transfer/src/transfer/transfer.scss +0 -17
  287. package/themes/light/virtualscroller/index.scss +0 -1
  288. package/themes/light/virtualscroller/src/virtualscroller/virtualscroller.scss +0 -1
  289. package/webpack.config.js +0 -143
  290. package/webservy.json +0 -8
  291. /package/{.nojekyll → dist/.ignore.js} +0 -0
  292. /package/{themes/light → src}/root/image/empty-default.svg +0 -0
  293. /package/{themes/light → src}/root/image/empty-space.svg +0 -0
  294. /package/{themes/light → src}/root/image/star-default.svg +0 -0
package/demos/chart/index.html DELETED
@@ -1,53 +0,0 @@
1
- <!doctype html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
6
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
7
- <title>Nano UI Chart</title>
8
-
9
- <link rel="stylesheet" href="https://unpkg.com/backpack.css@2.0.0/lib/backpack.css">
10
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css">
11
- <link rel="stylesheet" href="../../dist/nano-ui.css">
12
- <link rel="stylesheet" href="../style.css">
13
-
14
- <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.min.js"></script>
15
- <script src="https://vankizmann.github.io/@kizmann/pico-js/dist/@kizmann/pico-js.js"></script>
16
- <script src="../../dist/nano-ui.js"></script>
17
-
18
- </head>
19
- <body>
20
-
21
- <div id="app">
22
- <n-form :form="form">
23
-
24
- <n-form-item label="Test">
25
- <n-chart />
26
- </n-form-item>
27
-
28
- </n-form>
29
- </div>
30
-
31
- <script>
32
- pi.Dom.ready(() => {
33
-
34
- Vue.config.devtools = true;
35
-
36
- var config = {
37
- data: function() {
38
-
39
- var form = {
40
- test: false
41
- };
42
-
43
- return {
44
- form: form, inverse: false
45
- };
46
- }
47
- };
48
-
49
- window.App = new Vue(config).$mount('#app');
50
- })
51
- </script>
52
- </body>
53
- </html>
package/demos/checkbox/index.html DELETED
@@ -1,97 +0,0 @@
1
- <!doctype html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
6
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
7
- <title>Nano UI Checkbox</title>
8
-
9
- <link rel="stylesheet" href="https://unpkg.com/backpack.css@2.0.0/lib/backpack.css">
10
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css">
11
- <link rel="stylesheet" href="../../dist/nano-ui.css">
12
- <link rel="stylesheet" href="../style.css">
13
-
14
- <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.min.js"></script>
15
- <script src="https://vankizmann.github.io/@kizmann/pico-js/dist/@kizmann/pico-js.js"></script>
16
- <script src="../../dist/nano-ui.js"></script>
17
-
18
- </head>
19
- <body>
20
-
21
- <div id="app">
22
- <n-form :form="form" :class="{ 'n-inverse': inverse }">
23
-
24
- <n-form-item label="Inverse">
25
- <n-checkbox v-model="inverse">Inverse</n-checkbox>
26
- </n-form-item>
27
-
28
- <n-form-item label="Small">
29
- <n-checkbox v-model="form.option" size="small">Option</n-checkbox>
30
- </n-form-item>
31
-
32
- <n-form-item label="Default">
33
- <n-checkbox v-model="form.option" size="default">Option</n-checkbox>
34
- </n-form-item>
35
-
36
- <n-form-item label="Large">
37
- <n-checkbox v-model="form.option" size="large">Option</n-checkbox>
38
- </n-form-item>
39
-
40
- <n-form-item label="Disabled">
41
- <n-checkbox v-model="form.option" :disabled="true">Option</n-checkbox>
42
- </n-form-item>
43
-
44
- <n-form-item label="Group Vertical">
45
- <n-checkbox-group align="vertical" v-model="form.options">
46
- <n-checkbox :global="true">Check all</n-checkbox>
47
- <n-checkbox value="foo">Foo</n-checkbox>
48
- <n-checkbox value="bar">Bar</n-checkbox>
49
- <n-checkbox value="james">James</n-checkbox>
50
- <n-checkbox value="bond">Bond</n-checkbox>
51
- <n-checkbox value="chuck">Chuck</n-checkbox>
52
- <n-checkbox value="norris">Norris</n-checkbox>
53
- </n-checkbox-group>
54
- </n-form-item>
55
-
56
- <n-form-item label="Group Horizontal">
57
- <n-checkbox-group align="horizontal" v-model="form.options">
58
- <n-checkbox :global="true">Check all</n-checkbox>
59
- <n-checkbox value="foo">Foo</n-checkbox>
60
- <n-checkbox value="bar">Bar</n-checkbox>
61
- <n-checkbox value="james">James</n-checkbox>
62
- <n-checkbox value="bond">Bond</n-checkbox>
63
- <n-checkbox value="chuck">Chuck</n-checkbox>
64
- <n-checkbox value="norris">Norris</n-checkbox>
65
- </n-checkbox-group>
66
- </n-form-item>
67
-
68
- <n-form-item label="Object">
69
- <pre>{{ form }}</pre>
70
- </n-form-item>
71
-
72
- </n-form>
73
- </div>
74
-
75
- <script>
76
- pi.Dom.ready(() => {
77
-
78
- Vue.config.devtools = true;
79
-
80
- var config = {
81
- data: function() {
82
-
83
- var form = {
84
- option: false, options: []
85
- };
86
-
87
- return {
88
- form: form, inverse: false
89
- };
90
- }
91
- };
92
-
93
- window.App = new Vue(config).$mount('#app');
94
- })
95
- </script>
96
- </body>
97
- </html>
package/demos/config/index.html DELETED
@@ -1,95 +0,0 @@
1
- <!doctype html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
6
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
7
- <title>Nano UI Draggable</title>
8
-
9
- <link rel="stylesheet" href="https://unpkg.com/backpack.css@2.0.0/lib/backpack.css">
10
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css">
11
- <link rel="stylesheet" href="../../dist/nano-ui.css">
12
- <link rel="stylesheet" href="../style.css">
13
-
14
- <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.js"></script>
15
- <script src="https://vankizmann.github.io/@kizmann/pico-js/dist/@kizmann/pico-js.js"></script>
16
- <script src="../../dist/nano-ui.js"></script>
17
-
18
- </head>
19
- <body>
20
-
21
- <div id="app">
22
- <n-config :value="value" :config="config"></n-config>
23
- </div>
24
-
25
- <script>
26
- (function (Nano) {
27
-
28
- 'use strict';
29
-
30
- pi.Dom.ready(function () {
31
-
32
- Vue.config.devtools = true;
33
-
34
- var config = {
35
- data: function() {
36
-
37
- let config = {
38
- 'NForm': {
39
- content: {
40
- 'NFormItem:1': {
41
- vIf: function (value) {
42
- console.log(this);
43
- return value.test3 === 'two';
44
- },
45
- props: {
46
- label: 'Test 1'
47
- },
48
- content: {
49
- 'NInput': {
50
- model: {
51
- path: 'test1'
52
- }
53
- }
54
- }
55
- },
56
- 'NFormItem:3': {
57
- props: {
58
- label: 'Test 3'
59
- },
60
- content: {
61
- 'NInput': {
62
- model: {
63
- path: 'test3'
64
- }
65
- }
66
- }
67
- },
68
- 'NFormItem:2': {
69
- props: {
70
- label: 'Test 2'
71
- },
72
- content: {
73
- 'NInput': {
74
- model: {
75
- path: 'test2'
76
- }
77
- }
78
- }
79
- },
80
- }
81
- }
82
- };
83
-
84
- return { value: {}, config: config };
85
- }
86
- };
87
-
88
- window.App = new Vue(config).$mount('#app');
89
-
90
- });
91
-
92
- })(window.Nano);
93
- </script>
94
- </body>
95
- </html>
package/demos/confirm/index.html DELETED
@@ -1,78 +0,0 @@
1
- <!doctype html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
6
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
7
- <title>Nano UI Confirm</title>
8
-
9
- <link rel="stylesheet" href="https://unpkg.com/backpack.css@2.0.0/lib/backpack.css">
10
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css">
11
- <link rel="stylesheet" href="../../dist/nano-ui.css">
12
- <link rel="stylesheet" href="../style.css">
13
-
14
- <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.js"></script>
15
- <script src="https://vankizmann.github.io/@kizmann/pico-js/dist/@kizmann/pico-js.js"></script>
16
- <script src="../../dist/nano-ui.js"></script>
17
-
18
- </head>
19
- <body style="position: relative;">
20
-
21
- <div id="app">
22
- <div class="n-form">
23
-
24
-
25
- <n-button type="primary">
26
- Confirm
27
- </n-button>
28
- <n-confirm type="primary">
29
- Hello 01!
30
- </n-confirm>
31
-
32
- <n-button type="success">
33
- Confirm
34
- </n-button>
35
- <n-confirm type="success">
36
- Hello 01!
37
- </n-confirm>
38
-
39
- <n-button type="warning">
40
- Confirm
41
- </n-button>
42
- <n-confirm type="warning">
43
- Hello 01!
44
- </n-confirm>
45
-
46
- <n-button type="danger">
47
- Confirm
48
- </n-button>
49
- <n-confirm type="danger" :closable="true">
50
- Hello 01!
51
- </n-confirm>
52
-
53
- <n-button type="info">
54
- Confirm
55
- </n-button>
56
- <n-confirm type="info" :closable="true">
57
- Hello 01!
58
- </n-confirm>
59
- </div>
60
- </div>
61
-
62
- <script>
63
- pi.Dom.ready(function () {
64
-
65
- Vue.config.devtools = true;
66
-
67
- var config = {
68
- data: function() {
69
- return { };
70
- }
71
- };
72
-
73
- window.App = new Vue(config).$mount('#app');
74
-
75
- });
76
- </script>
77
- </body>
78
- </html>
package/demos/datepicker/index.html DELETED
@@ -1,69 +0,0 @@
1
- <!doctype html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
6
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
7
- <title>Nano UI Datepicker</title>
8
-
9
- <link rel="stylesheet" href="https://unpkg.com/backpack.css@2.0.0/lib/backpack.css">
10
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css">
11
- <link rel="stylesheet" href="../../dist/nano-ui.css">
12
- <link rel="stylesheet" href="../style.css">
13
-
14
- <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.min.js"></script>
15
- <script src="https://vankizmann.github.io/@kizmann/pico-js/dist/@kizmann/pico-js.js"></script>
16
- <script src="../../dist/nano-ui.js"></script>
17
-
18
- </head>
19
- <body>
20
-
21
- <div id="app">
22
- <n-form :form="form" :class="{ 'n-inverse': inverse }">
23
-
24
- <n-form-item label="Inverse">
25
- <n-checkbox v-model="inverse">Inverse</n-checkbox>
26
- </n-form-item>
27
-
28
- <n-form-item label="Test">
29
- <n-button-group>
30
- <n-datepicker v-model="form.date" :clearable="true"></n-datepicker>
31
- <n-timepicker v-model="form.date" :clearable="true"></n-timepicker>
32
- </n-button-group>
33
- </n-form-item>
34
-
35
- <n-form-item label="Test">
36
- <n-datepicker :arrive.sync="form.arrive" :depart.sync="form.depart" :range="true" :clearable="true" />
37
- </n-form-item>
38
-
39
- <n-form-item label="Object">
40
- <pre>{{ form }}</pre>
41
- </n-form-item>
42
-
43
- </n-form>
44
- </div>
45
-
46
- <script>
47
- pi.Dom.ready(() => {
48
-
49
- Vue.config.devtools = true;
50
-
51
- var config = {
52
-
53
- data: function() {
54
-
55
- var form = {
56
- date: 'now+2days', arrive: 'now', depart: 'now+2days'
57
- };
58
-
59
- return {
60
- form: form, inverse: false
61
- };
62
- }
63
- };
64
-
65
- window.App = new Vue(config).$mount('#app');
66
- })
67
- </script>
68
- </body>
69
- </html>
package/demos/draggable/index.html DELETED
@@ -1,127 +0,0 @@
1
- <!doctype html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
6
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
7
- <title>Nano UI Draggable</title>
8
-
9
- <link rel="stylesheet" href="https://unpkg.com/backpack.css@2.0.0/lib/backpack.css">
10
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css">
11
- <link rel="stylesheet" href="../../dist/nano-ui.css">
12
- <link rel="stylesheet" href="../style.css">
13
-
14
- <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.js"></script>
15
- <script src="https://vankizmann.github.io/@kizmann/pico-js/dist/@kizmann/pico-js.js"></script>
16
- <script src="../../dist/nano-ui.js"></script>
17
-
18
- </head>
19
- <body>
20
-
21
- <div id="app">
22
- <n-form :form="form" :class="{ 'n-inverse': inverse }">
23
-
24
- <n-form-item label="Inverse">
25
- <n-checkbox v-model="inverse">Inverse</n-checkbox>
26
- </n-form-item>
27
-
28
- <n-form-item label="List">
29
- <div style="display: block; border: 2px solid #000;">
30
- <div>
31
- <n-draglist ref="drag" style="height: 500px; overflow: hidden;" :items="form.value" :viewport-height="true" :render-expand="true" :render-select="true" :expanded="['value-1']" :threshold="800">
32
- <div slot-scope="props" style="line-height: 32px;">
33
- {{ props.value.label }}
34
- </div>
35
- </n-draglist>
36
- </div>
37
- </div>
38
-
39
- <div style="display: block; border: 2px solid #000;">
40
- <div>
41
- <n-draggrid style="height: 500px; overflow: hidden;" :items="form.value" :viewport-height="true" :render-expand="true" :render-select="true" :threshold="800">
42
- <div slot-scope="props" style="line-height: 32px;">
43
- {{ props.value.label }}
44
- </div>
45
- </n-draggrid>
46
- </div>
47
- </div>
48
-
49
- <n-form-item v-if="false" label="Tree">
50
- <n-draglist-tree :items="form.value" unique-prop="id" :cascade.sync="form.cascade">
51
- <div slot-scope="props">{{ props.value.label }}</div>
52
- </n-draglist-tree>
53
- </n-form-item>
54
-
55
- </n-form>
56
- </div>
57
-
58
- <script>
59
- (function (Nano) {
60
-
61
- 'use strict';
62
-
63
- pi.Dom.ready(function () {
64
-
65
- Vue.config.devtools = true;
66
-
67
- var config = {
68
- data: function() {
69
-
70
- let total = 0;
71
-
72
- let childGenerator = function(count, depth, current) {
73
-
74
- if ( count === undefined ) {
75
- count = 3;
76
- }
77
-
78
- if ( depth === undefined ) {
79
- depth = 2;
80
- }
81
-
82
- if ( current === undefined ) {
83
- current = 1;
84
- }
85
-
86
- let children = Array(count).fill(null);
87
-
88
- pi.Arr.map(children, function (item) {
89
-
90
- total++;
91
-
92
- item = {
93
- label: 'Item ' + total,
94
- id: 'value-' + total,
95
- children: []
96
- };
97
-
98
- if ( current < depth ) {
99
- item.children = childGenerator(30, depth, current + 1);
100
- }
101
-
102
- return item;
103
- });
104
-
105
- return children;
106
- };
107
-
108
- var form = {
109
- value: []//childGenerator(2, 2)
110
- };
111
-
112
- return { form: form, inverse: false };
113
- },
114
-
115
- mounted: function() {
116
- console.log(this.$refs.drag.getParentById('value-20'));
117
- }
118
- };
119
-
120
- window.App = new Vue(config).$mount('#app');
121
-
122
- });
123
-
124
- })(window.Nano);
125
- </script>
126
- </body>
127
- </html>
package/demos/form/index.html DELETED
@@ -1,83 +0,0 @@
1
- <!doctype html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
6
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
7
- <title>Nano UI Form</title>
8
-
9
- <link rel="stylesheet" href="https://unpkg.com/backpack.css@2.0.0/lib/backpack.css">
10
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css">
11
- <link rel="stylesheet" href="../../dist/nano-ui.css">
12
- <link rel="stylesheet" href="../style.css">
13
-
14
- <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.min.js"></script>
15
- <script src="https://vankizmann.github.io/@kizmann/pico-js/dist/@kizmann/pico-js.js"></script>
16
- <script src="../../dist/nano-ui.js"></script>
17
-
18
- </head>
19
- <body>
20
-
21
- <div id="app">
22
- <n-form :form="form" :errors="errors" :class="{ 'n-inverse': inverse }">
23
-
24
- <n-form-item label="Inverse">
25
- <n-checkbox v-model="inverse">Inverse</n-checkbox>
26
- </n-form-item>
27
-
28
- <n-form-group icon="fa fa-key" legend="With legend" :checkable="true">
29
-
30
- <n-form-item label="Default">
31
- <n-input v-model="form.name" />
32
- </n-form-item>
33
-
34
- </n-form-group>
35
-
36
- <n-form-group align="horizontal" legend="With legend" tooltip="Im a legend tooltip">
37
-
38
- <n-form-item label="Default">
39
- <n-input v-model="form.name" />
40
- </n-form-item>
41
-
42
- </n-form-group>
43
-
44
- <n-form-item label="With tooltip" tooltip="Im a label tooltip">
45
- <n-input v-model="form.name" />
46
- </n-form-item>
47
-
48
- <n-form-item prop="name" label="Error">
49
- <n-textarea v-model="form.name" :auto-rows="true" />
50
- </n-form-item>
51
-
52
- </n-form>
53
- </div>
54
-
55
- <script>
56
- pi.Dom.ready(() => {
57
-
58
- Vue.config.devtools = true;
59
-
60
- var config = {
61
-
62
- data: function() {
63
-
64
- var form = {
65
- name: '',
66
- password: ''
67
- };
68
-
69
- var errors = {
70
- name: 'My custom error'
71
- };
72
-
73
- return {
74
- form: form, errors: errors, inverse: false
75
- };
76
- }
77
- };
78
-
79
- window.App = new Vue(config).$mount('#app');
80
- })
81
- </script>
82
- </body>
83
- </html>