@tagplus/components 4.7.0 → 4.7.2

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/package.json CHANGED
@@ -8,7 +8,7 @@
8
8
  "email": "bruno@tagplus.com.br"
9
9
  }
10
10
  ],
11
- "version": "4.7.0",
11
+ "version": "4.7.2",
12
12
  "main": "./dist/tp.common.js",
13
13
  "directories": {
14
14
  "lib": "src/lib"
@@ -92,15 +92,27 @@
92
92
  display: block;
93
93
  }
94
94
 
95
+ .flexContent {
96
+ display: flex;
97
+ }
98
+
95
99
  .justify-between {
96
100
  justify-content: space-between;
97
101
  }
98
102
 
103
+ .justify-content-end {
104
+ justify-content: end;
105
+ }
106
+
99
107
  .text-helper-info {
100
108
  font-size: 13px;
101
109
  color: #565b66;
102
110
  }
103
111
 
112
+ .c-pointer {
113
+ cursor: pointer;
114
+ }
115
+
104
116
  .no-font-weight {
105
117
  font-weight: initial !important;
106
118
  }
@@ -26,33 +26,44 @@
26
26
  />
27
27
  </el-col>
28
28
  </el-row>
29
- <el-row
29
+ <div
30
30
  v-else
31
- :id="`${_id}`"
32
- type="flex"
33
- align="middle"
34
- justify="space-between"
35
- :class="tptipclasses">
36
- <el-col
37
- :span="17"
31
+ class="c-pointer"
32
+ @click="onClick"
33
+ >
34
+ <el-row
35
+ :id="`${_id}`"
36
+ type="flex"
37
+ align="middle"
38
+ justify="space-between"
39
+ :class="tptipclasses"
38
40
  >
39
- <el-row align="middle" type="flex" style="min-width:25px; margin:15px; padding: auto">
40
- <em class="far fa-lightbulb-on" />
41
- <b class="tp-title">{{ title }}</b>
42
- </el-row>
43
- </el-col>
44
- <el-col :span="3" class="flexContent justify-content-end">
45
- <em class="fa fa-ellipsis-h tp-close-button" @click="closed = !closed" />
46
- </el-col>
47
-
48
- <el-col :class="'tp-text ' + (closed ? 'tp-vanish' : '' )" :span="24">
49
- <div
50
- :id="`${_id}-text`"
51
- style="margin:15px; margin-left:0px"
52
- v-html="text"
53
- />
54
- </el-col>
55
- </el-row>
41
+ <!-- Titulo -->
42
+ <el-col
43
+ :span="17"
44
+ >
45
+ <el-row align="middle" type="flex" style="min-width:25px; margin:15px; padding: auto">
46
+ <em class="far fa-lightbulb-on" />
47
+ <b class="tp-title">{{ title }}</b>
48
+ </el-row>
49
+ </el-col>
50
+
51
+ <!-- Close/Open Btn -->
52
+ <el-col :span="3" class="flexContent justify-content-end">
53
+ <em :class="closed ? 'fa fa-plus' : 'fa fa-minus'" class="tp-close-button" />
54
+ </el-col>
55
+
56
+ <!-- Texto -->
57
+ <el-col :class="'tp-text ' + (closed ? 'tp-vanish' : '' )" :span="24">
58
+ <div
59
+ :id="`${_id}-text`"
60
+ data-tp-tip-content
61
+ style="margin:15px; margin-left:0px"
62
+ v-html="text"
63
+ />
64
+ </el-col>
65
+ </el-row>
66
+ </div>
56
67
  </template>
57
68
 
58
69
  <script>
@@ -110,6 +121,21 @@ export default {
110
121
 
111
122
  return classes
112
123
  }
124
+ },
125
+
126
+ methods: {
127
+ onClick (evt) {
128
+ // Permite clicar em link sem fechar Tip
129
+ const isLink = evt.target?.nodeName === 'A'
130
+ // Permite copiar texto sem fechar Tip
131
+ const isContent = evt.target?.closest('[data-tp-tip-content]')
132
+
133
+ if (isLink || isContent) {
134
+ return
135
+ }
136
+
137
+ this.closed = !this.closed
138
+ }
113
139
  }
114
140
  }
115
141
  </script>
@@ -172,7 +198,6 @@ export default {
172
198
 
173
199
  .tp-close-button {
174
200
  padding: 10px;
175
- cursor: pointer;
176
201
  }
177
202
 
178
203
  .tp-title {