classcard-ui 0.2.282 → 0.2.286
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.
- package/dist/classcard-ui.common.js +89 -69
- package/dist/classcard-ui.common.js.map +1 -1
- package/dist/classcard-ui.umd.js +89 -69
- package/dist/classcard-ui.umd.js.map +1 -1
- package/dist/classcard-ui.umd.min.js +1 -1
- package/dist/classcard-ui.umd.min.js.map +1 -1
- package/package.json +1 -1
- package/src/components/CAnchorTabs/CAnchorTabs.vue +1 -1
- package/src/components/CDatepicker/CDatepicker.vue +1 -0
- package/src/components/CIconDropdown/CIconDropdown.vue +10 -1
- package/src/components/CPagination/CPagination.vue +5 -1
- package/src/icons.js +2 -0
- package/src/stories/CIconDropdown.stories.js +11 -3
- package/src/stories/CPagination.stories.js +9 -1
package/package.json
CHANGED
|
@@ -82,7 +82,7 @@ export default {
|
|
|
82
82
|
console.log("show name", name);
|
|
83
83
|
this.activeTab = name;
|
|
84
84
|
var el = document.getElementById(name);
|
|
85
|
-
el.scrollIntoView({ behavior: "smooth" });
|
|
85
|
+
el.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "start" });
|
|
86
86
|
},
|
|
87
87
|
switchTabForMobile(index) {
|
|
88
88
|
var selectedOption = this.tabs[index];
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
aria-labelledby="option-menu"
|
|
50
50
|
>
|
|
51
51
|
<a
|
|
52
|
-
v-for="item in items"
|
|
52
|
+
v-for="(item, index) in items"
|
|
53
53
|
v-bind:key="item.text"
|
|
54
54
|
@mousedown.stop="dropdownAction(item)"
|
|
55
55
|
class="
|
|
@@ -64,6 +64,12 @@
|
|
|
64
64
|
:class="item.class"
|
|
65
65
|
role="menuitem"
|
|
66
66
|
>
|
|
67
|
+
<c-icon
|
|
68
|
+
v-if="item.icon"
|
|
69
|
+
:name="dropdownIcons[index].name"
|
|
70
|
+
:type="dropdownIcons[index].type"
|
|
71
|
+
:class="dropdownIcons[index].class"
|
|
72
|
+
></c-icon>
|
|
67
73
|
{{ item.text }}
|
|
68
74
|
</a>
|
|
69
75
|
</div>
|
|
@@ -85,6 +91,9 @@ export default {
|
|
|
85
91
|
icon: {
|
|
86
92
|
type: Object,
|
|
87
93
|
},
|
|
94
|
+
dropdownIcons: {
|
|
95
|
+
type: Object,
|
|
96
|
+
},
|
|
88
97
|
classes: {
|
|
89
98
|
type: String,
|
|
90
99
|
},
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div
|
|
3
|
-
class="bg-white px-4 py-3 flex items-center justify-between border-
|
|
3
|
+
class="bg-white px-4 py-3 flex items-center justify-between border-gray-200 sm:px-6"
|
|
4
4
|
>
|
|
5
5
|
<div class="flex-1 flex justify-between sm:hidden">
|
|
6
6
|
<a
|
|
@@ -63,6 +63,7 @@
|
|
|
63
63
|
<div
|
|
64
64
|
v-for="page in pageRange"
|
|
65
65
|
:key="page"
|
|
66
|
+
class="cursor-pointer"
|
|
66
67
|
:class="[
|
|
67
68
|
page == currentPageNumber
|
|
68
69
|
? 'z-10 bg-indigo-50 border-indigo-500 text-indigo-600 relative inline-flex items-center px-4 py-2 border text-sm font-medium'
|
|
@@ -73,6 +74,9 @@
|
|
|
73
74
|
page !== currentPageNumber && page !== '...'
|
|
74
75
|
? 'bg-white border-gray-300 text-gray-500 hover:bg-gray-50 relative inline-flex items-center px-4 py-2 border border-r-0 text-sm font-medium'
|
|
75
76
|
: '',
|
|
77
|
+
page == currentPageNumber + 1
|
|
78
|
+
? 'border-l-0'
|
|
79
|
+
: '',
|
|
76
80
|
]"
|
|
77
81
|
@click="changePage(page)"
|
|
78
82
|
>
|
package/src/icons.js
CHANGED
|
@@ -43,6 +43,8 @@ export default {
|
|
|
43
43
|
"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2",
|
|
44
44
|
package:
|
|
45
45
|
"M12 8v13m0-13V6a2 2 0 112 2h-2zm0 0V5.5A2.5 2.5 0 109.5 8H12zm-7 4h14M5 12a2 2 0 110-4h14a2 2 0 110 4M5 12v7a2 2 0 002 2h10a2 2 0 002-2v-7",
|
|
46
|
+
document:
|
|
47
|
+
"M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z",
|
|
46
48
|
refresh:
|
|
47
49
|
"M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15",
|
|
48
50
|
product: "M20 7l-8-4-8 4m16 0l-8 4m8-4v10l-8 4m0-10L4 7m8 4v10M4 7v10l8 4",
|
|
@@ -8,7 +8,8 @@ export default {
|
|
|
8
8
|
subcomponents: { CIcon },
|
|
9
9
|
argTypes: {
|
|
10
10
|
items: { control: { type: "object" } },
|
|
11
|
-
icon: Object
|
|
11
|
+
icon: Object,
|
|
12
|
+
dropdownIcons: { type: Array }
|
|
12
13
|
},
|
|
13
14
|
};
|
|
14
15
|
|
|
@@ -21,8 +22,15 @@ const Template = (args, { argTypes }) => ({
|
|
|
21
22
|
export const Default = Template.bind({});
|
|
22
23
|
Default.args = {
|
|
23
24
|
items: [
|
|
24
|
-
{ icon:
|
|
25
|
-
{
|
|
25
|
+
{ icon: true, text: "one", action:'alert', class:'hover:bg-red-100 hover:text-red-500 w-56' },
|
|
26
|
+
{ text: "two" },
|
|
27
|
+
],
|
|
28
|
+
dropdownIcons: [
|
|
29
|
+
{
|
|
30
|
+
name:'trash',
|
|
31
|
+
class:'mr-3 h-5 w-5 text-gray-400 hover:text-red-500',
|
|
32
|
+
type:'solid'
|
|
33
|
+
}
|
|
26
34
|
],
|
|
27
35
|
icon:{
|
|
28
36
|
name:'dots-vertical-solid',
|
|
@@ -19,4 +19,12 @@ const Template = (args, { argTypes }) => ({
|
|
|
19
19
|
});
|
|
20
20
|
|
|
21
21
|
export const Default = Template.bind({});
|
|
22
|
-
Default.args = {
|
|
22
|
+
Default.args = {
|
|
23
|
+
setPaginationRecords: {
|
|
24
|
+
currentPage: 1,
|
|
25
|
+
lastPage: 10,
|
|
26
|
+
from: 1,
|
|
27
|
+
to: 10,
|
|
28
|
+
totalRecords: 200,
|
|
29
|
+
}
|
|
30
|
+
};
|