goodteditor-ui 1.0.12 → 1.0.13

package/src/components/ui/Paginator.md

@@ -1,34 +1,34 @@
-```vue
-<template>
-    <div class="pad-l5">
-        <ui-paginator v-bind="props">
-            <template #default="{ page, pages, pageData, setPage }">
-                <div class="mar-bot-l3">
-                    <div class="tile" v-for="item in pageData" :key="item.index">
-                        <div class="tile-body">{{ item.index + 1 }}. {{ item.label }}</div>
-                    </div>
-                </div>
-                <ui-pagination v-bind="{ page, pages }" @change="n => setPage(n)"></ui-pagination>
-            </template>
-        </ui-paginator>
-    </div>
-</template>
-<script>
-import UiPagination from './Pagination.vue';
-import UiPaginator from './Paginator.vue';
-
-export default {
-    components: { UiPagination, UiPaginator },
-    data() {
-        return {
-            props: {
-                data: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis quos corporis obcaecati dolorum distinctio accusantium sapiente, earum non dignissimos quia officia voluptatum, sunt rem voluptate a commodi test'
-                    .split(' ')
-                    .map((label, index) => ({ label, index })),
-                perPage: 5,
-            },
-        };
-    },
-};
-</script>
-```
+```vue
+<template>
+    <div class="pad-l5">
+        <ui-paginator v-bind="props">
+            <template #default="{ page, pages, pageData, setPage }">
+                <div class="mar-bot-l3">
+                    <div class="tile" v-for="item in pageData" :key="item.index">
+                        <div class="tile-body">{{ item.index + 1 }}. {{ item.label }}</div>
+                    </div>
+                </div>
+                <ui-pagination v-bind="{ page, pages }" @change="n => setPage(n)"></ui-pagination>
+            </template>
+        </ui-paginator>
+    </div>
+</template>
+<script>
+import UiPagination from './Pagination.vue';
+import UiPaginator from './Paginator.vue';
+
+export default {
+    components: { UiPagination, UiPaginator },
+    data() {
+        return {
+            props: {
+                data: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis quos corporis obcaecati dolorum distinctio accusantium sapiente, earum non dignissimos quia officia voluptatum, sunt rem voluptate a commodi test'
+                    .split(' ')
+                    .map((label, index) => ({ label, index })),
+                perPage: 5,
+            },
+        };
+    },
+};
+</script>
+```

package/src/components/ui/Paginator.vue

@@ -1,83 +1,83 @@
-<template>
-    <div class="ui-paginator">
-        <!-- 
-        @slot Page data slot
-        @binding {Number} page      current page number 
-        @binding {Number} pages     total pages number
-        @binding {Array} pageData   current page data
-        @binding {(n:number) => {}} setPage     sets a new page
-        -->
-        <slot v-bind="{ page: currentPage, pages, pageData, setPage }"></slot>
-    </div>
-</template>
-<script>
-export default {
-    props: {
-        /**
-         * Data to be paginated
-         */
-        data: {
-            type: Array,
-            default() {
-                return [];
-            },
-        },
-        /**
-         * Current page (.sync supported)
-         */
-        page: {
-            type: Number,
-            default: 1,
-        },
-        /**
-         * Number of items displayed per page
-         */
-        perPage: {
-            type: Number,
-            default: 10,
-            validator(val) {
-                return val > 0;
-            },
-        },
-    },
-    data() {
-        return { currentPage: 1 };
-    },
-    computed: {
-        pages() {
-            const { data, perPage } = this;
-            return Math.ceil(data.length / perPage);
-        },
-        pageData() {
-            const { data, currentPage, perPage } = this;
-            return data ? data.slice((currentPage - 1) * perPage, currentPage * perPage) : [];
-        },
-    },
-    watch: {
-        'data.length'() {
-            this.setPage(1);
-        },
-        page: {
-            handler(val) {
-                this.setPage(val);
-            },
-            immediate: true,
-        },
-    },
-    methods: {
-        setPage(page) {
-            this.currentPage = page;
-            /**
-             * Page change event (page.sync compatibility)
-             * @property {number} page
-             */
-            this.$emit('update:page', page);
-            /**
-             * Change event
-             * @property {number} page
-             */
-            this.$emit('change', page);
-        },
-    },
-};
-</script>
+<template>
+    <div class="ui-paginator">
+        <!-- 
+        @slot Page data slot
+        @binding {Number} page      current page number 
+        @binding {Number} pages     total pages number
+        @binding {Array} pageData   current page data
+        @binding {(n:number) => {}} setPage     sets a new page
+        -->
+        <slot v-bind="{ page: currentPage, pages, pageData, setPage }"></slot>
+    </div>
+</template>
+<script>
+export default {
+    props: {
+        /**
+         * Data to be paginated
+         */
+        data: {
+            type: Array,
+            default() {
+                return [];
+            },
+        },
+        /**
+         * Current page (.sync supported)
+         */
+        page: {
+            type: Number,
+            default: 1,
+        },
+        /**
+         * Number of items displayed per page
+         */
+        perPage: {
+            type: Number,
+            default: 10,
+            validator(val) {
+                return val > 0;
+            },
+        },
+    },
+    data() {
+        return { currentPage: 1 };
+    },
+    computed: {
+        pages() {
+            const { data, perPage } = this;
+            return Math.ceil(data.length / perPage);
+        },
+        pageData() {
+            const { data, currentPage, perPage } = this;
+            return data ? data.slice((currentPage - 1) * perPage, currentPage * perPage) : [];
+        },
+    },
+    watch: {
+        'data.length'() {
+            this.setPage(1);
+        },
+        page: {
+            handler(val) {
+                this.setPage(val);
+            },
+            immediate: true,
+        },
+    },
+    methods: {
+        setPage(page) {
+            this.currentPage = page;
+            /**
+             * Page change event (page.sync compatibility)
+             * @property {number} page
+             */
+            this.$emit('update:page', page);
+            /**
+             * Change event
+             * @property {number} page
+             */
+            this.$emit('change', page);
+        },
+    },
+};
+</script>

package/src/components/ui/Popover.md

@@ -1,34 +1,34 @@
-```vue
-<template>
-    <div class="pad-l5">
-        <div class="pos-rel">
-            <div id="popover-btn" class="btn btn-primary" @click="show = !show">
-                Button
-            </div>
-            <ui-popover v-bind="props" :show.sync="show">
-                <div class="panel">
-                    <div class="panel-body">Lorem ipsum dolor sit amet.</div>
-                </div>
-            </ui-popover>
-        </div>
-    </div>
-</template>
-<script>
-import UiPopover from './Popover.vue';
-
-export default {
-    components: { UiPopover },
-    data() {
-        return {
-            show: false,
-            props: {
-                target: '#popover-btn',
-                appendToBody: true,
-                autoWidth: false,
-                position: 'bottom-start',
-            },
-        };
-    },
-};
-</script>
-```
+```vue
+<template>
+    <div class="pad-l5">
+        <div class="pos-rel">
+            <div id="popover-btn" class="btn btn-primary" @click="show = !show">
+                Button
+            </div>
+            <ui-popover v-bind="props" :show.sync="show">
+                <div class="panel">
+                    <div class="panel-body">Lorem ipsum dolor sit amet.</div>
+                </div>
+            </ui-popover>
+        </div>
+    </div>
+</template>
+<script>
+import UiPopover from './Popover.vue';
+
+export default {
+    components: { UiPopover },
+    data() {
+        return {
+            show: false,
+            props: {
+                target: '#popover-btn',
+                appendToBody: true,
+                autoWidth: false,
+                position: 'bottom-start',
+            },
+        };
+    },
+};
+</script>
+```