classcard-ui 0.2.268 → 0.2.269

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 (13) hide show
  1. package/dist/classcard-ui.common.js +39 -78
  2. package/dist/classcard-ui.common.js.map +1 -1
  3. package/dist/classcard-ui.umd.js +39 -78
  4. package/dist/classcard-ui.umd.js.map +1 -1
  5. package/dist/classcard-ui.umd.min.js +1 -1
  6. package/dist/classcard-ui.umd.min.js.map +1 -1
  7. package/package.json +1 -1
  8. package/src/components/CDatepicker/CDatepicker.vue +5 -17
  9. package/src/components/CEditor/CEditor.vue +1 -1
  10. package/src/components/CInput/CInput.vue +1 -1
  11. package/src/components/CInputAddon/CInputAddon.vue +13 -39
  12. package/src/components/CPhoneNumber/CPhoneNumber.vue +2 -6
  13. package/src/components/CTextarea/CTextarea.vue +1 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "classcard-ui",
3
- "version": "0.2.268",
3
+ "version": "0.2.269",
4
4
  "main": "dist/classcard-ui.common.js",
5
5
  "scripts": {
6
6
  "serve": "vue-cli-service serve",
package/src/components/CDatepicker/CDatepicker.vue CHANGED
@@ -17,19 +17,14 @@
17
17
  <button
18
18
  type="button"
19
19
  :class="[
20
- disabled
21
- ? 'border-gray-100 pointer-events-none'
22
- : 'border-gray-300',
23
- 'p-2 bg-blue-100 border hover:bg-blue-200 text-blue-600 rounded-l-md focus:bg-blue-500 focus:text-white focus:border-blue-500 focus:outline-none',
20
+ disabled ? 'border-gray-100 pointer-events-none' : 'border-gray-300',
21
+ 'shadow-sm p-2 bg-blue-100 border hover:bg-blue-200 text-blue-600 rounded-l-md focus:bg-blue-500 focus:text-white focus:border-blue-500 focus:outline-none',
24
22
  ]"
25
23
  @click="togglePopover()"
26
24
  >
27
25
  <c-icon
28
26
  name="calendar-solid"
29
- :class="[
30
- disabled ? 'text-gray-200' : 'text-gray-400',
31
- 'h-5 w-5 ',
32
- ]"
27
+ :class="[disabled ? 'text-gray-200' : 'text-gray-400', 'h-5 w-5 ']"
33
28
  type="solid"
34
29
  ></c-icon>
35
30
  </button>
@@ -39,7 +34,7 @@
39
34
  disabled
40
35
  ? 'border-gray-100 border-l-0 text-gray-400'
41
36
  : 'border-gray-300 border-l-0 text-gray-900',
42
- 'bg-white w-full p-2 appearance-none border rounded-r-md focus:outline-none focus:border-blue-500 text-sm',
37
+ 'shadow-sm bg-white w-full p-2 appearance-none border rounded-r-md focus:outline-none focus:border-blue-500 text-sm',
43
38
  ]"
44
39
  :readonly="disabled"
45
40
  @click="togglePopover()"
@@ -91,14 +86,7 @@ export default {
91
86
  },
92
87
  data() {
93
88
  const masks = {
94
- input: [
95
- "MMM DD, YYYY",
96
- "YYYY/MM/DD",
97
- "DD-MM-YYYY",
98
- "DD/MM/YYYY",
99
- "YYYY-MM-DD",
100
- "L",
101
- ],
89
+ input: ["MMM DD, YYYY", "YYYY/MM/DD", "DD-MM-YYYY", "DD/MM/YYYY", "YYYY-MM-DD", "L"],
102
90
  };
103
91
  return {
104
92
  masks,
package/src/components/CEditor/CEditor.vue CHANGED
@@ -5,7 +5,7 @@
5
5
  <p class="text-sm text-gray-500" v-if="hint">{{ hint }}</p>
6
6
  </div>
7
7
  <quill-editor
8
- class="mt-1 text-sm"
8
+ class="mt-1 text-sm shadow-sm"
9
9
  :value="content"
10
10
  :options="editorOption"
11
11
  @change="onChange($event)"
package/src/components/CInput/CInput.vue CHANGED
@@ -19,7 +19,7 @@
19
19
  @input="$emit('input', $event.target.value)"
20
20
  @blur="$emit('blur', $event.target.value)"
21
21
  :class="errorClasses"
22
- class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-md sm:text-sm disabled:opacity-50 text-gray-900"
22
+ class="shadow-sm focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-md sm:text-sm disabled:opacity-50 text-gray-900"
23
23
  :placeholder="placeholder"
24
24
  :disabled="disabled"
25
25
  />
package/src/components/CInputAddon/CInputAddon.vue CHANGED
@@ -11,10 +11,7 @@
11
11
  </div>
12
12
  <span v-if="hint" class="text-sm text-gray-500">{{ hint }}</span>
13
13
  </div>
14
- <div
15
- v-if="!inlineAddon && addonType == 'leading'"
16
- class="relative mt-1 flex rounded-md"
17
- >
14
+ <div v-if="!inlineAddon && addonType == 'leading'" class="relative mt-1 flex rounded-md">
18
15
  <span
19
16
  :class="disabled ? 'opacity-50' : ''"
20
17
  v-if="addon"
@@ -28,7 +25,7 @@
28
25
  @input="$emit('input', $event.target.value)"
29
26
  @blur="$emit('blur', $event.target.value)"
30
27
  :class="{ ...errorClasses, 'rounded-l-md': !addon }"
31
- class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-r-md sm:text-sm disabled:opacity-50 text-gray-900"
28
+ class="shadow-sm focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-r-md sm:text-sm disabled:opacity-50 text-gray-900"
32
29
  :placeholder="placeholder"
33
30
  :disabled="disabled"
34
31
  />
@@ -39,17 +36,14 @@
39
36
  <c-icon name="exclamation-circle" type="solid" class="h-5 w-5"></c-icon>
40
37
  </div>
41
38
  </div>
42
- <div
43
- v-if="!inlineAddon && addonType == 'trailing'"
44
- class="relative mt-1 flex rounded-md"
45
- >
39
+ <div v-if="!inlineAddon && addonType == 'trailing'" class="relative mt-1 flex rounded-md">
46
40
  <input
47
41
  :type="inputType"
48
42
  :value="inputValue"
49
43
  @input="$emit('input', $event.target.value)"
50
44
  @blur="$emit('blur', $event.target.value)"
51
45
  :class="errorClasses"
52
- class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-l-md sm:text-sm disabled:opacity-50 text-gray-900"
46
+ class="shadow-sm focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-l-md sm:text-sm disabled:opacity-50 text-gray-900"
53
47
  :placeholder="placeholder"
54
48
  :disabled="disabled"
55
49
  />
@@ -66,48 +60,31 @@
66
60
  {{ addon }}
67
61
  </span>
68
62
  </div>
69
- <div
70
- v-if="inlineAddon && addonType == 'trailing'"
71
- class="relative mt-1 flex rounded-md"
72
- >
63
+ <div v-if="inlineAddon && addonType == 'trailing'" class="relative mt-1 flex rounded-md">
73
64
  <input
74
65
  :type="inputType"
75
66
  :value="inputValue"
76
67
  @input="$emit('input', $event.target.value)"
77
68
  @blur="$emit('blur', $event.target.value)"
78
69
  :class="errorClasses"
79
- class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-md sm:text-sm disabled:opacity-50 text-gray-900"
70
+ class="shadow-sm focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-md sm:text-sm disabled:opacity-50 text-gray-900"
80
71
  :placeholder="placeholder"
81
72
  :disabled="disabled"
82
73
  />
83
- <div
84
- class="absolute inset-y-0 right-3 flex items-center pointer-events-none"
85
- >
74
+ <div class="absolute inset-y-0 right-3 flex items-center pointer-events-none">
86
75
  <div
87
76
  v-if="!isValidate"
88
77
  class="right-0 pr-2 flex items-center pointer-events-none text-red-600"
89
78
  >
90
- <c-icon
91
- name="exclamation-circle"
92
- type="solid"
93
- class="h-5 w-5"
94
- ></c-icon>
79
+ <c-icon name="exclamation-circle" type="solid" class="h-5 w-5"></c-icon>
95
80
  </div>
96
- <span
97
- class="text-gray-500 sm:text-sm"
98
- :class="disabled ? 'opacity-50' : ''"
99
- >
81
+ <span class="text-gray-500 sm:text-sm" :class="disabled ? 'opacity-50' : ''">
100
82
  {{ addon }}
101
83
  </span>
102
84
  </div>
103
85
  </div>
104
- <div
105
- v-if="inlineAddon && addonType == 'leading'"
106
- class="relative mt-1 flex rounded-md"
107
- >
108
- <div
109
- class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none"
110
- >
86
+ <div v-if="inlineAddon && addonType == 'leading'" class="relative mt-1 flex rounded-md">
87
+ <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
111
88
  <span class="text-gray-500 sm:text-sm">{{ addon }}</span>
112
89
  </div>
113
90
  <input
@@ -117,7 +94,7 @@
117
94
  @blur="$emit('blur', $event.target.value)"
118
95
  :class="errorClasses"
119
96
  :style="`padding-left:${leftPaddingStyle}`"
120
- class="focus:ring-indigo-500 focus:border-indigo-500 block w-full rounded-md sm:text-sm disabled:opacity-50 text-gray-900"
97
+ class="shadow-sm focus:ring-indigo-500 focus:border-indigo-500 block w-full rounded-md sm:text-sm disabled:opacity-50 text-gray-900"
121
98
  :placeholder="placeholder"
122
99
  :disabled="disabled"
123
100
  />
@@ -131,10 +108,7 @@
131
108
  <p v-if="!isValidate" class="mt-2 text-sm text-red-600 text-left">
132
109
  {{ errorMessage }}
133
110
  </p>
134
- <p
135
- v-if="helpText && isValidate == true"
136
- :class="`mt-2 text-sm ${helpTextColorStyles}`"
137
- >
111
+ <p v-if="helpText && isValidate == true" :class="`mt-2 text-sm ${helpTextColorStyles}`">
138
112
  {{ helpText }}
139
113
  </p>
140
114
  </div>
package/src/components/CPhoneNumber/CPhoneNumber.vue CHANGED
@@ -1,12 +1,8 @@
1
1
  <template>
2
2
  <div>
3
3
  <label class="text-sm text-gray-900">{{ label }}</label>
4
- <div class="w-full mt-1">
5
- <vue-tel-input
6
- v-bind="bindProps"
7
- :autoFormat="false"
8
- v-model="value"
9
- ></vue-tel-input>
4
+ <div class="w-full mt-1 shadow-sm">
5
+ <vue-tel-input v-bind="bindProps" :autoFormat="false" v-model="value"></vue-tel-input>
10
6
  </div>
11
7
  </div>
12
8
  </template>
package/src/components/CTextarea/CTextarea.vue CHANGED
@@ -16,7 +16,7 @@
16
16
  :rows="rows"
17
17
  :class="errorClasses"
18
18
  :disabled="disabled"
19
- class="focus:ring-indigo-500 focus:border-indigo-500 block w-full sm:text-sm rounded-md disabled:opacity-50 text-gray-900"
19
+ class="shadow-sm focus:ring-indigo-500 focus:border-indigo-500 block w-full sm:text-sm rounded-md disabled:opacity-50 text-gray-900"
20
20
  ></textarea>
21
21
  <div
22
22
  v-if="!isValidate"