npm - @kizmann/nano-ui - Versions diffs - 0.8.37 → 0.9.1 - Mend

@kizmann/nano-ui 0.8.37 → 0.9.1

Files changed (66) hide show

package/bun.lockb +0 -0
package/demos/overview.html +5 -15
package/demos/select.html +164 -0
package/dist/nano-ui.css +1 -1
package/dist/nano-ui.js +2 -2
package/dist/nano-ui.js.map +1 -1
package/dist/themes/light.css +1 -1
package/docs/README.md +1 -2
package/docs/_sidebar.md +19 -21
package/docs/dist/docs.css +2 -0
package/docs/{data → files/data}/table.md +40 -14
package/docs/files/form/button.md +122 -0
package/docs/{form → files/form}/form.md +14 -0
package/docs/files/form/input.md +90 -0
package/docs/files/form/switch.md +92 -0
package/docs/index.html +163 -44
package/docs/src/scss/docsify/basic/_layout.sass +3 -6
package/docs/src/scss/docsify/syntax.scss +139 -0
package/docs/src/scss/docsify/vue.sass +2 -15
package/docs/src/scss/index.scss +428 -16
package/package.json +1 -1
package/src/button/src/button/button.js +1 -9
package/src/mixins/src/ctor.js +0 -6
package/src/popover/src/popover/popover.scss +4 -0
package/src/radio/src/radio-group/radio-group.js +1 -1
package/src/root/vars.scss +10 -10
package/src/scrollbar/src/scrollbar/scrollbar.next.js +21 -1
package/src/select/src/select/select.js +191 -78
package/src/select/src/select/select.scss +4 -0
package/src/select/src/select-option/select-option.js +6 -2
package/src/table/src/table/table.scss +0 -1
package/src/tags/src/tags-item/tags-item.js +17 -1
package/src/virtualscroller/src/virtualscroller/virtualscroller.beta.js +12 -2
package/themes/light/root/vars.scss +10 -10
package/themes/light/switch/src/switch/switch.scss +1 -1
package/themes/light/table/src/table/table.scss +1 -1
package/themes/light/tags/src/tags-item/tags-item.scss +16 -0
package/webpack.config.js +13 -13
package/dist/themes/basic.css +0 -2029
package/dist/themes/flat.css +0 -1806
package/dist/themes/flat.dark.css +0 -1809
package/docs/dist/index.css +0 -6977
package/docs/form/button.md +0 -299
package/docs/form/input.md +0 -205
package/docs/form/switch.md +0 -166
/package/docs/{data → files/data}/draggable.md +0 -0
/package/docs/{data → files/data}/map.md +0 -0
/package/docs/{data → files/data}/paginator.md +0 -0
/package/docs/{data → files/data}/virtualscroller.md +0 -0
/package/docs/{form → files/form}/cascader.md +0 -0
/package/docs/{form → files/form}/checkbox.md +0 -0
/package/docs/{form → files/form}/datepicker.md +0 -0
/package/docs/{form → files/form}/radio.md +0 -0
/package/docs/{form → files/form}/select.md +0 -0
/package/docs/{form → files/form}/textarea.md +0 -0
/package/docs/{form → files/form}/timepicker.md +0 -0
/package/docs/{form → files/form}/transfer.md +0 -0
/package/docs/{others → files/others}/config.md +0 -0
/package/docs/{others → files/others}/confirm.md +0 -0
/package/docs/{others → files/others}/loader.md +0 -0
/package/docs/{others → files/others}/modal.md +0 -0
/package/docs/{others → files/others}/notification.md +0 -0
/package/docs/{others → files/others}/popover.md +0 -0
/package/docs/{others → files/others}/resizer.md +0 -0
/package/docs/{others → files/others}/scrollbar.md +0 -0
/package/docs/{others → files/others}/tabs.md +0 -0

package/bun.lockb ADDED Viewed

Binary file

package/demos/overview.html CHANGED Viewed

@@ -12,7 +12,7 @@
     <link rel="stylesheet" href="../dist/nano-ui.css">
     <link id="theme" rel="stylesheet" href="../dist/themes/light.css">
-    <link rel="stylesheet" href="../docs/dist/index.css">
+    <link rel="stylesheet" href="../style.css">
     <style>
@@ -223,20 +223,7 @@
                 <n-select style="width: 100px;" v-model="n_button.size" :options="sizes"></n-select>
             </div>
             <div class="col--auto">
-                <n-select style="width: 200px;" v-model="n_button.icon" placeholder="Icon" :clearable="true" :options="demoIcons">
-                    <n-select-option :disabled="true" value="foo1" label="foo1"></n-select-option>
-                    <n-select-option value="bar1" label="bar1"></n-select-option>
-                    <n-select-option value="foo2" label="foo2"></n-select-option>
-                    <n-select-option value="bar2" label="bar2"></n-select-option>
-                    <n-select-option value="foo3" label="foo3"></n-select-option>
-                    <n-select-option value="bar3" label="bar3"></n-select-option>
-                    <n-select-option value="foo4" label="foo4"></n-select-option>
-                    <n-select-option value="bar4" label="bar4"></n-select-option>
-                    <n-select-option value="foo5" label="foo5"></n-select-option>
-                    <n-select-option value="bar5" label="bar5"></n-select-option>
-                    <n-select-option value="foo6" label="foo6"></n-select-option>
-                    <n-select-option value="bar6" label="bar6"></n-select-option>
-                </n-select>
+                <n-select style="width: 200px;" v-model="n_button.icon" placeholder="Icon" :clearable="true" :options="demoIcons" />
             </div>
             <div class="col--auto">
                 <n-checkbox v-model="n_button.square">Square</n-checkbox>
@@ -403,6 +390,9 @@
         </div>
         <div class="grid grid--row grid--wrap grid--10-10">
+            <div class="col--1-1 col--1-3@md">
+                <n-select v-bind="n_select" type="secondary" :options="icons" :lazy="true"></n-select>
+            </div>
             <div class="col--1-1 col--1-3@md">
                 <n-select v-bind="n_select" v-model="foobar" :multiple="true" type="primary" :options="icons"></n-select>
             </div>

package/demos/select.html ADDED Viewed

@@ -0,0 +1,164 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Nano UI</title>
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap">
+    <link rel="stylesheet" href="https://unpkg.com/backpack.css@2.0.0/lib/backpack.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css">
+    <link rel="stylesheet" href="../dist/nano-ui.css">
+    <link id="theme" rel="stylesheet" href="../dist/themes/light.css">
+    <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/3.0.5/vue.global.prod.js"></script> -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
+    <script src="https://unpkg.com/vue@3.4.6"></script>
+    <!-- <script src="../node_modules/pico-js/dist/pico-js.js"></script> -->
+    <script src="https://vankizmann.github.io/pico-js/dist/pico-js.js"></script>
+    <script src="../dist/nano-ui.js"></script>
+    <link rel="stylesheet" href="./style.css">
+    <style>
+        body {
+            font-family: 'Helvetica', 'Roboto', 'Arial', sans-serif;
+            font-size: 14px;
+            height: 100%;
+            overflow-x: hidden;
+        }
+        #app {
+            overflow-x: hidden;
+        }
+        .app-scrollbar {
+            width: 100vw;
+            height: 100vh;
+        }
+        .app-container {
+            max-width: 1440px;
+            margin: 0 auto;
+            padding: 20px 30px 40px 30px;
+        }
+        .app-options {
+            border-bottom: 1px solid #eee;
+            margin-bottom: 20px;
+        }
+        h2 {
+            font-size: 32px;
+            font-weight: bold;
+            padding-bottom: 10px;
+            margin: 50px 0 15px;
+            border-bottom: 1px solid #eee;
+        }
+    </style>
+</head>
+<body>
+<div id="app">
+    <div class="app-container">
+        <h2>NSelect</h2>
+        <div class="grid grid--row grid--wrap grid--10-10">
+            <div class="col--auto">
+                <n-select type="secondary" :multiple="true" :options="virtualData" :lazy="true"></n-select>
+            </div>
+        </div>
+    </div>
+</div>
+<script>
+    (function (nano) {
+        'use strict';
+        pi.Dom.ready(function () {
+            let data = {};
+            data.sizes = {
+                xs: 'XS',
+                sm: 'SM',
+                md: 'MD',
+                lg: 'LG'
+            };
+            data.types = {
+                primary: 'Primary',
+                secondary: 'Secondary',
+                success: 'Success',
+                warning: 'Warning',
+                danger: 'Danger',
+                info: 'Info'
+            };
+            data.modals = {
+                default: 'Default',
+                preview: 'Preview',
+            };
+            let itemGenerator = function (count = 100, index = 0) {
+                let list = {};
+                pi.Arr.each(pi.Arr.make(count), function () {
+                    return list[pi.UUID()] = `Item ${index ++}`;
+                });
+                return list;
+            };
+            data.virtualData = itemGenerator(1000);
+            let methods = {};
+            methods.log = function (val) {
+                console.log(val || 'Log fired');
+            };
+            methods.notify = function (type) {
+                this.Notify('Lorem ipsum dolore', type);
+            };
+            var config = {
+                data: function () {
+                    this.icons = pi.Obj.assign(nano.Icons, {
+                        ghost: 'fa fa-ghost'
+                    });
+                    data.demoIcons = pi.Arr.reduce(pi.Obj.values(nano.Icons), function (merge, icon) {
+                        return pi.Obj.assign(merge, { [icon]: icon });
+                    }, {});
+                    return data;
+                },
+                methods: methods
+            };
+            window.App = Vue.createApp(config);
+            window.App.config.devtools = true;
+            window.App.use(function (App) {
+                nano.Install(App);
+            });
+            window.App.mount('#app');
+            window.DEBUG_NDLIST = true;
+        });
+    })(window.nano);
+</script>
+</body>
+</html>