ep-lib-ts 1.1.2 → 1.1.3
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.
|
@@ -1,12 +1,13 @@
|
|
|
1
|
-
import { defineComponent, computed, createElementBlock, openBlock, normalizeClass, Fragment, renderList, createBlock,
|
|
1
|
+
import { defineComponent, computed, createElementBlock, openBlock, normalizeClass, Fragment, renderList, createElementVNode, createBlock, createCommentVNode, mergeProps, toDisplayString, unref, createVNode } from "vue";
|
|
2
2
|
import _sfc_main$1 from "./EpAvatar.vue.js";
|
|
3
3
|
import _sfc_main$2 from "./EpIcon.vue.js";
|
|
4
4
|
import { useRenderText } from "../../composables/useRenderText.js";
|
|
5
5
|
import { roundedType } from "../../types/StackedList.js";
|
|
6
|
-
const _hoisted_1 =
|
|
7
|
-
const _hoisted_2 = { class: "
|
|
8
|
-
const _hoisted_3 =
|
|
9
|
-
const _hoisted_4 =
|
|
6
|
+
const _hoisted_1 = ["onClick"];
|
|
7
|
+
const _hoisted_2 = { class: "col-span-1 sm:col-span-5 justify-self-start" };
|
|
8
|
+
const _hoisted_3 = { class: "font-semibold" };
|
|
9
|
+
const _hoisted_4 = ["innerHTML"];
|
|
10
|
+
const _hoisted_5 = {
|
|
10
11
|
key: 1,
|
|
11
12
|
class: "flex items-center justify-center sm:justify-start col-span-1 sm:col-span-4"
|
|
12
13
|
};
|
|
@@ -18,72 +19,61 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
18
19
|
rounded: { default: "small" },
|
|
19
20
|
restricted: { type: Boolean, default: false },
|
|
20
21
|
cropped: { type: Boolean, default: false },
|
|
21
|
-
avatarStyle: { default: () => {
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
};
|
|
25
|
-
} },
|
|
22
|
+
avatarStyle: { default: () => ({
|
|
23
|
+
size: "middle"
|
|
24
|
+
}) },
|
|
26
25
|
iconSize: { default: 36 }
|
|
27
26
|
},
|
|
28
27
|
setup(__props) {
|
|
29
28
|
const props = __props;
|
|
30
29
|
const className = computed(() => {
|
|
31
|
-
const border = props.border
|
|
32
|
-
const rounded = roundedType[props.rounded
|
|
30
|
+
const border = props.border ? "border" : "border-0";
|
|
31
|
+
const rounded = roundedType[props.rounded];
|
|
33
32
|
const padding = props.restricted ? "p-0" : "p-2";
|
|
34
33
|
return `${border} ${rounded} ${padding}`;
|
|
35
34
|
});
|
|
36
35
|
const elementSpacing = computed(() => props.restricted ? "p-3" : "mx-6 py-4");
|
|
36
|
+
const handleClick = (elem) => {
|
|
37
|
+
if (elem.url) {
|
|
38
|
+
window.open(elem.url, "_blank", "noopener,noreferrer");
|
|
39
|
+
}
|
|
40
|
+
};
|
|
37
41
|
return (_ctx, _cache) => {
|
|
38
42
|
return openBlock(), createElementBlock("ul", {
|
|
39
|
-
class: normalizeClass(`${className.value} border-
|
|
43
|
+
class: normalizeClass(`${className.value} dark:border-surface-2 border-surface-2-dark flex flex-col lg:mx-28`)
|
|
40
44
|
}, [
|
|
41
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.elements, (elem) => {
|
|
45
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.elements, (elem, index) => {
|
|
42
46
|
return openBlock(), createElementBlock("li", {
|
|
43
|
-
key:
|
|
44
|
-
class:
|
|
47
|
+
key: index,
|
|
48
|
+
class: "list-none py-4 sm:py-2 border-t border-surface-2-dark dark:border-surface-2 first:border-t-0"
|
|
45
49
|
}, [
|
|
46
|
-
(
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
50
|
+
createElementVNode("div", {
|
|
51
|
+
class: normalizeClass([
|
|
52
|
+
elementSpacing.value,
|
|
53
|
+
"grid grid-cols-1 sm:grid-cols-11 gap-2 justify-items-start items-center p-2",
|
|
54
|
+
elem.url ? "hover:bg-neutral-200 dark:hover:bg-surface-2-dark cursor-pointer" : ""
|
|
55
|
+
]),
|
|
56
|
+
onClick: ($event) => handleClick(elem)
|
|
57
|
+
}, [
|
|
58
|
+
elem.avatar ? (openBlock(), createBlock(_sfc_main$1, mergeProps({
|
|
59
|
+
key: 0,
|
|
60
|
+
src: elem.avatar
|
|
61
|
+
}, { ref_for: true }, _ctx.avatarStyle, { class: "col-span-1 sm:col-span-2 self-center justify-self-center sm:justify-self-start" }), null, 16, ["src"])) : createCommentVNode("", true),
|
|
62
|
+
createElementVNode("div", _hoisted_2, [
|
|
63
|
+
createElementVNode("h3", _hoisted_3, toDisplayString(elem.title), 1),
|
|
56
64
|
createElementVNode("div", {
|
|
57
|
-
class: normalizeClass(
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
grid grid-cols-1 sm:grid-cols-11 gap-2
|
|
61
|
-
justify-items-start items-center
|
|
62
|
-
border-gray-200 dark:border-slate-700
|
|
63
|
-
`)
|
|
64
|
-
}, [
|
|
65
|
-
elem.avatar ? (openBlock(), createBlock(_sfc_main$1, mergeProps({
|
|
66
|
-
key: 0,
|
|
67
|
-
src: elem.avatar
|
|
68
|
-
}, { ref_for: true }, _ctx.avatarStyle, { class: "col-span-1 sm:col-span-2 self-center justify-self-center sm:justify-self-start" }), null, 16, ["src"])) : createCommentVNode("", true),
|
|
69
|
-
createElementVNode("div", _hoisted_1, [
|
|
70
|
-
createElementVNode("h3", _hoisted_2, toDisplayString(elem.title), 1),
|
|
71
|
-
createElementVNode("div", {
|
|
72
|
-
class: normalizeClass(`${_ctx.cropped ? "line-clamp-3" : ""}`),
|
|
73
|
-
innerHTML: unref(useRenderText)(elem.description)
|
|
74
|
-
}, null, 10, _hoisted_3)
|
|
75
|
-
]),
|
|
76
|
-
elem.icon ? (openBlock(), createElementBlock("div", _hoisted_4, [
|
|
77
|
-
createVNode(_sfc_main$2, {
|
|
78
|
-
"icon-path": elem.icon,
|
|
79
|
-
size: _ctx.iconSize
|
|
80
|
-
}, null, 8, ["icon-path", "size"])
|
|
81
|
-
])) : createCommentVNode("", true)
|
|
82
|
-
], 2)
|
|
65
|
+
class: normalizeClass(_ctx.cropped ? "line-clamp-3" : ""),
|
|
66
|
+
innerHTML: unref(useRenderText)(elem.description)
|
|
67
|
+
}, null, 10, _hoisted_4)
|
|
83
68
|
]),
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
69
|
+
elem.icon ? (openBlock(), createElementBlock("div", _hoisted_5, [
|
|
70
|
+
createVNode(_sfc_main$2, {
|
|
71
|
+
"icon-path": elem.icon,
|
|
72
|
+
size: _ctx.iconSize
|
|
73
|
+
}, null, 8, ["icon-path", "size"])
|
|
74
|
+
])) : createCommentVNode("", true)
|
|
75
|
+
], 10, _hoisted_1)
|
|
76
|
+
]);
|
|
87
77
|
}), 128))
|
|
88
78
|
], 2);
|
|
89
79
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EpStackedList.vue.js","sources":["../../../src/components/basics/EpStackedList.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed
|
|
1
|
+
{"version":3,"file":"EpStackedList.vue.js","sources":["../../../src/components/basics/EpStackedList.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport EpAvatar from \"./EpAvatar.vue\";\nimport EpIcon from \"./EpIcon.vue\";\nimport { useRenderText } from \"../../composables/useRenderText\";\n\nimport {\n type ListItem,\n type AvatarStyle,\n type RoundedStyle,\n roundedType,\n} from \"../../types/StackedList\";\n\ninterface Props {\n elements: ListItem[];\n border?: boolean;\n rounded?: RoundedStyle;\n restricted?: boolean;\n cropped?: boolean;\n avatarStyle?: AvatarStyle;\n iconSize?: number | string;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n elements: () => [],\n avatarStyle: () => ({\n size: \"middle\",\n }),\n border: true,\n rounded: \"small\",\n restricted: false,\n cropped: false,\n iconSize: 36,\n});\n\nconst className = computed(() => {\n const border = props.border ? \"border\" : \"border-0\";\n const rounded = roundedType[props.rounded];\n const padding = props.restricted ? \"p-0\" : \"p-2\";\n return `${border} ${rounded} ${padding}`;\n});\n\nconst elementSpacing = computed(() => props.restricted ? \"p-3\" : \"mx-6 py-4\");\n\nconst handleClick = (elem: ListItem) => {\n if (elem.url) {\n window.open(elem.url, '_blank', 'noopener,noreferrer');\n }\n};\n</script>\n\n<template>\n <ul :class=\"`${className} dark:border-surface-2 border-surface-2-dark flex flex-col lg:mx-28`\">\n <li v-for=\"(elem, index) in elements\" :key=\"index\"\n class=\"list-none py-4 sm:py-2 border-t border-surface-2-dark dark:border-surface-2 first:border-t-0\">\n <div :class=\"[\n elementSpacing,\n 'grid grid-cols-1 sm:grid-cols-11 gap-2 justify-items-start items-center p-2',\n elem.url ? 'hover:bg-neutral-200 dark:hover:bg-surface-2-dark cursor-pointer' : ''\n ]\" @click=\"handleClick(elem)\">\n <EpAvatar v-if=\"elem.avatar\" :src=\"elem.avatar\" v-bind=\"avatarStyle\"\n class=\"col-span-1 sm:col-span-2 self-center justify-self-center sm:justify-self-start\" />\n\n <div class=\"col-span-1 sm:col-span-5 justify-self-start\">\n <h3 class=\"font-semibold\">{{ elem.title }}</h3>\n <div :class=\"cropped ? 'line-clamp-3' : ''\" v-html=\"useRenderText(elem.description)\" />\n </div>\n\n <div v-if=\"elem.icon\"\n class=\"flex items-center justify-center sm:justify-start col-span-1 sm:col-span-4\">\n <EpIcon :icon-path=\"elem.icon\" :size=\"iconSize\" />\n </div>\n </div>\n </li>\n </ul>\n</template>"],"names":["_createElementBlock","_openBlock","_Fragment","_renderList","elements","_createElementVNode","_normalizeClass","_createBlock","EpAvatar","_mergeProps","avatarStyle","_toDisplayString","cropped","_unref","_createVNode","EpIcon","iconSize"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBA,UAAM,QAAQ;AAYd,UAAM,YAAY,SAAS,MAAM;AAC7B,YAAM,SAAS,MAAM,SAAS,WAAW;AACzC,YAAM,UAAU,YAAY,MAAM,OAAO;AACzC,YAAM,UAAU,MAAM,aAAa,QAAQ;AAC3C,aAAO,GAAG,MAAM,IAAI,OAAO,IAAI,OAAO;AAAA,IAC1C,CAAC;AAED,UAAM,iBAAiB,SAAS,MAAM,MAAM,aAAa,QAAQ,WAAW;AAE5E,UAAM,cAAc,CAAC,SAAmB;AACpC,UAAI,KAAK,KAAK;AACV,eAAO,KAAK,KAAK,KAAK,UAAU,qBAAqB;AAAA,MACzD;AAAA,IACJ;;0BAIIA,mBAsBK,MAAA;AAAA,QAtBA,yBAAU,UAAA,KAAS,qEAAA;AAAA,MAAA;SACpBC,UAAA,IAAA,GAAAD,mBAoBKE,UAAA,MAAAC,WApBuBC,KAAAA,UAAQ,CAAxB,MAAM,UAAK;8BAAvBJ,mBAoBK,MAAA;AAAA,YApBkC,KAAK;AAAA,YACxC,OAAM;AAAA,UAAA;YACNK,mBAiBM,OAAA;AAAA,cAjBA,OAAKC,eAAA;AAAA,gBAAoB,eAAA;AAAA;gBAA+H,KAAK,MAAG,qEAAA;AAAA,cAAA;cAIlK,SAAK,CAAA,WAAE,YAAY,IAAI;AAAA,YAAA;cACP,KAAK,UAArBL,UAAA,GAAAM,YAC6FC,aAD7FC,WAC6F;AAAA;gBAD/D,KAAK,KAAK;AAAA,cAAA,sBAAgBC,KAAAA,aAAW,EAC/D,OAAM,iFAAA,CAAgF,GAAA,MAAA,IAAA,CAAA,KAAA,CAAA;cAE1FL,mBAGM,OAHN,YAGM;AAAA,gBAFFA,mBAA+C,MAA/C,YAA+CM,gBAAlB,KAAK,KAAK,GAAA,CAAA;AAAA,gBACvCN,mBAAuF,OAAA;AAAA,kBAAjF,sBAAOO,KAAAA,UAAO,iBAAA,EAAA;AAAA,kBAAwB,WAAQC,MAAA,aAAA,EAAc,KAAK,WAAW;AAAA,gBAAA;;cAG3E,KAAK,QAAhBZ,UAAA,GAAAD,mBAGM,OAHN,YAGM;AAAA,gBADFc,YAAkDC,aAAA;AAAA,kBAAzC,aAAW,KAAK;AAAA,kBAAO,MAAMC,KAAAA;AAAAA,gBAAAA;;;;;;;;;"}
|
package/dist/style.css
CHANGED
|
@@ -1,42 +1,30 @@
|
|
|
1
1
|
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
z-index: 6998;
|
|
5
|
-
top: 0;
|
|
6
|
-
left: 0;
|
|
7
|
-
width: 100%;
|
|
8
|
-
height: 100%;
|
|
9
|
-
background-color: rgba(0, 0, 0, 0.5);
|
|
10
|
-
display: flex;
|
|
11
|
-
transition: opacity 0.3s ease;
|
|
12
|
-
}
|
|
13
|
-
.ep-modal-container {
|
|
14
|
-
margin: auto;
|
|
15
|
-
max-height: 95%;
|
|
16
|
-
transition: all 0.3s ease;
|
|
17
|
-
z-index: 7000;
|
|
2
|
+
pre {
|
|
3
|
+
white-space: break-spaces;
|
|
18
4
|
}
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
.perspective-1000[data-v-edc221ae] { perspective: 1000px
|
|
22
8
|
}
|
|
23
|
-
.
|
|
24
|
-
margin: 20px 0;
|
|
9
|
+
.preserve-3d[data-v-edc221ae] { transform-style: preserve-3d
|
|
25
10
|
}
|
|
26
|
-
.
|
|
27
|
-
float: right;
|
|
11
|
+
.backface-hidden[data-v-edc221ae] { backface-visibility: hidden
|
|
28
12
|
}
|
|
29
|
-
.
|
|
30
|
-
opacity: 0;
|
|
13
|
+
.rotate-y-180[data-v-edc221ae] { transform: rotateY(180deg)
|
|
31
14
|
}
|
|
32
|
-
|
|
33
|
-
|
|
15
|
+
|
|
16
|
+
/* simple fade for the helper badge */
|
|
17
|
+
.fade-enter-active[data-v-edc221ae], .fade-leave-active[data-v-edc221ae] { transition: opacity .3s
|
|
34
18
|
}
|
|
35
|
-
.
|
|
36
|
-
.ep-modal-leave-to .ep-modal-container {
|
|
37
|
-
transform: scale(1.1);
|
|
19
|
+
.fade-enter-from[data-v-edc221ae], .fade-leave-to[data-v-edc221ae] { opacity: 0
|
|
38
20
|
}
|
|
21
|
+
/*$vite$:1*/
|
|
39
22
|
|
|
23
|
+
.ep-accordeon-content[data-v-9a4f2570] {
|
|
24
|
+
transition: max-height 0.2s ease-out;
|
|
25
|
+
overflow: hidden;
|
|
26
|
+
}
|
|
27
|
+
/*$vite$:1*/
|
|
40
28
|
|
|
41
29
|
@keyframes fade-6f6eb558 {
|
|
42
30
|
0% {
|
|
@@ -79,19 +67,47 @@
|
|
|
79
67
|
}
|
|
80
68
|
/*$vite$:1*/
|
|
81
69
|
|
|
82
|
-
|
|
83
|
-
|
|
70
|
+
.ep-modal-mask {
|
|
71
|
+
position: fixed;
|
|
72
|
+
z-index: 6998;
|
|
73
|
+
top: 0;
|
|
74
|
+
left: 0;
|
|
75
|
+
width: 100%;
|
|
76
|
+
height: 100%;
|
|
77
|
+
background-color: rgba(0, 0, 0, 0.5);
|
|
78
|
+
display: flex;
|
|
79
|
+
transition: opacity 0.3s ease;
|
|
84
80
|
}
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
transition:
|
|
89
|
-
|
|
81
|
+
.ep-modal-container {
|
|
82
|
+
margin: auto;
|
|
83
|
+
max-height: 95%;
|
|
84
|
+
transition: all 0.3s ease;
|
|
85
|
+
z-index: 7000;
|
|
86
|
+
}
|
|
87
|
+
.ep-modal-header h3 {
|
|
88
|
+
margin-top: 0;
|
|
89
|
+
color: #42b983;
|
|
90
|
+
}
|
|
91
|
+
.ep-modal-body {
|
|
92
|
+
margin: 20px 0;
|
|
93
|
+
}
|
|
94
|
+
.ep-modal-default-button {
|
|
95
|
+
float: right;
|
|
96
|
+
}
|
|
97
|
+
.ep-modal-enter-from {
|
|
98
|
+
opacity: 0;
|
|
99
|
+
}
|
|
100
|
+
.ep-modal-leave-to {
|
|
101
|
+
opacity: 0;
|
|
102
|
+
}
|
|
103
|
+
.ep-modal-enter-from .ep-modal-container,
|
|
104
|
+
.ep-modal-leave-to .ep-modal-container {
|
|
105
|
+
transform: scale(1.1);
|
|
90
106
|
}
|
|
91
107
|
/*$vite$:1*/
|
|
92
108
|
|
|
93
|
-
.
|
|
94
|
-
|
|
109
|
+
.katex[data-v-a9b6227c] {
|
|
110
|
+
font-size: 1.6em;
|
|
95
111
|
}
|
|
96
112
|
/*$vite$:1*/
|
|
97
113
|
|
|
@@ -106,30 +122,9 @@ pre {
|
|
|
106
122
|
}
|
|
107
123
|
/*$vite$:1*/
|
|
108
124
|
|
|
109
|
-
.
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
/*$vite$:1*/
|
|
113
|
-
|
|
114
|
-
.perspective-1000[data-v-edc221ae] { perspective: 1000px
|
|
115
|
-
}
|
|
116
|
-
.preserve-3d[data-v-edc221ae] { transform-style: preserve-3d
|
|
117
|
-
}
|
|
118
|
-
.backface-hidden[data-v-edc221ae] { backface-visibility: hidden
|
|
119
|
-
}
|
|
120
|
-
.rotate-y-180[data-v-edc221ae] { transform: rotateY(180deg)
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
/* simple fade for the helper badge */
|
|
124
|
-
.fade-enter-active[data-v-edc221ae], .fade-leave-active[data-v-edc221ae] { transition: opacity .3s
|
|
125
|
-
}
|
|
126
|
-
.fade-enter-from[data-v-edc221ae], .fade-leave-to[data-v-edc221ae] { opacity: 0
|
|
127
|
-
}
|
|
128
|
-
/*$vite$:1*/
|
|
129
|
-
|
|
130
|
-
.ep-info-box[data-v-cb6ebbdc] a {
|
|
131
|
-
text-decoration: underline;
|
|
132
|
-
font-weight: 500;
|
|
125
|
+
.shape[data-v-4a99873e] {
|
|
126
|
+
height: var(--e4ec2c0a);
|
|
127
|
+
width: var(--3f346a72);
|
|
133
128
|
}
|
|
134
129
|
/*$vite$:1*/
|
|
135
130
|
|
|
@@ -143,16 +138,14 @@ pre {
|
|
|
143
138
|
}
|
|
144
139
|
/*$vite$:1*/
|
|
145
140
|
|
|
146
|
-
.
|
|
147
|
-
|
|
148
|
-
|
|
141
|
+
.ep-info-box[data-v-cb6ebbdc] a {
|
|
142
|
+
text-decoration: underline;
|
|
143
|
+
font-weight: 500;
|
|
149
144
|
}
|
|
150
145
|
/*$vite$:1*/
|
|
151
146
|
|
|
152
|
-
.ep-
|
|
153
|
-
|
|
154
|
-
position: absolute;
|
|
155
|
-
right: 12rem;
|
|
147
|
+
.ep-sensible-content[data-v-0098bf11] {
|
|
148
|
+
position: relative;
|
|
156
149
|
}
|
|
157
150
|
/*$vite$:1*/
|
|
158
151
|
|
|
@@ -167,6 +160,13 @@ pre {
|
|
|
167
160
|
}
|
|
168
161
|
/*$vite$:1*/
|
|
169
162
|
|
|
163
|
+
.ep-display-box[data-v-4e1d2bd1] {
|
|
164
|
+
z-index: 9999;
|
|
165
|
+
position: absolute;
|
|
166
|
+
right: 12rem;
|
|
167
|
+
}
|
|
168
|
+
/*$vite$:1*/
|
|
169
|
+
|
|
170
170
|
.ep-content-timeline-item[data-v-6a472392] {
|
|
171
171
|
max-height: 0;
|
|
172
172
|
overflow: hidden;
|