ep-lib-ts 1.0.89 → 1.0.92
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/components/interactions/EpFlipCard.vue.js +1 -1
- package/dist/components/interactions/EpFlipCard.vue2.js +8 -4
- package/dist/components/interactions/EpFlipCard.vue2.js.map +1 -1
- package/dist/style.css +75 -75
- package/dist/types/Avatar.d.ts +6 -0
- package/dist/types/Avatar.js +15 -9
- package/dist/types/Avatar.js.map +1 -1
- package/dist/types/StackedList.d.ts +3 -1
- package/dist/types/StackedList.js +3 -1
- package/dist/types/StackedList.js.map +1 -1
- package/dist/types/basics/EpAvatar.d.ts +1 -1
- package/dist/types/interactions/EpFlipCard.d.ts +3 -1
- package/package.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _sfc_main from "./EpFlipCard.vue2.js";
|
|
2
2
|
/* empty css */
|
|
3
3
|
import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
|
|
4
|
-
const Comp = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-
|
|
4
|
+
const Comp = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-888bce6b"]]);
|
|
5
5
|
export {
|
|
6
6
|
Comp as default
|
|
7
7
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { defineComponent, ref, computed, createElementBlock, createCommentVNode, openBlock, normalizeClass, createElementVNode, createVNode, normalizeStyle, toDisplayString, unref, Transition, withCtx } from "vue";
|
|
2
2
|
import { mdiRotate360 } from "@mdi/js";
|
|
3
3
|
import _sfc_main$1 from "../basics/EpIcon.vue.js";
|
|
4
|
-
import { density_style } from "../../types/Card.js";
|
|
4
|
+
import { density_style, sizeCardThumbnailStyle } from "../../types/Card.js";
|
|
5
5
|
import { useColorMode } from "@vueuse/core";
|
|
6
6
|
import { useRenderText } from "../../composables/useRenderText.js";
|
|
7
7
|
const _hoisted_1 = {
|
|
@@ -46,7 +46,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
46
46
|
noIndicator: { type: Boolean, default: false },
|
|
47
47
|
density: { default: "default" },
|
|
48
48
|
maxWidth: { default: "max-w-xl" },
|
|
49
|
-
height: { default: "medium" }
|
|
49
|
+
height: { default: "medium" },
|
|
50
|
+
thumbnail: { type: Boolean, default: false },
|
|
51
|
+
sizeThumbnail: { default: "medium" }
|
|
50
52
|
},
|
|
51
53
|
setup(__props) {
|
|
52
54
|
const props = __props;
|
|
@@ -78,12 +80,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
78
80
|
const color = darkMode.value === "dark" ? "rgba(0,0,0,0.75)" : "rgba(255,255,255,0.8)";
|
|
79
81
|
return `linear-gradient(to bottom, ${color}, ${color}), url(${props.back.bgImg})`;
|
|
80
82
|
});
|
|
83
|
+
const styleSizeThumbnail = computed(() => {
|
|
84
|
+
return sizeCardThumbnailStyle[props.sizeThumbnail];
|
|
85
|
+
});
|
|
81
86
|
return (_ctx, _cache) => {
|
|
82
87
|
var _a, _b, _c, _d;
|
|
83
88
|
return hasContent.value ? (openBlock(), createElementBlock("div", {
|
|
84
89
|
key: 0,
|
|
85
|
-
class: normalizeClass(`relative perspective-1000 cursor-pointer flex items-center justify-center
|
|
86
|
-
w-full ${heightStyle.value} my-3`),
|
|
90
|
+
class: normalizeClass(`relative perspective-1000 cursor-pointer ${heightStyle.value} my-3 ${_ctx.thumbnail ? "inline-block m-3 " + styleSizeThumbnail.value : "flex items-center justify-center w-full"}`),
|
|
87
91
|
onClick: _cache[2] || (_cache[2] = () => {
|
|
88
92
|
if (_ctx.trigger === "click") toggle();
|
|
89
93
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EpFlipCard.vue2.js","sources":["../../../src/components/interactions/EpFlipCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref} from 'vue'\n\nimport type { EpFlipCardProps } from \"~/types/interactions/EpFlipCard\";\nimport { mdiRotate360 } from '@mdi/js';\nimport EpIcon from '../basics/EpIcon.vue';\nimport { density_style } from '~/types/Card';\nimport { useColorMode } from '@vueuse/core';\nimport { useRenderText } from '~/composables/useRenderText';\n\nconst props = withDefaults(defineProps<EpFlipCardProps>(), {\n trigger: \"click\",\n noIndicator: false,\n density: \"default\",\n maxWidth: \"max-w-xl\",\n height: \"medium\",\n front: () => ({\n content: \"\",\n bgImg: \"\",\n bgColor: null,\n textColor: null,\n }),\n back: () => ({\n content: \"\",\n bgImg: \"\",\n bgColor: null,\n textColor: null,\n })\n});\n\nconst flipped = ref(false);\nconst toggle = () => {\n flipped.value = !flipped.value\n}\n\n\nconst stylesCard = computed(() => {\n return `\n shadow-lg \n ${density_style[props.density]}\n rounded-md\n `;\n});\n\nconst heightStyle = computed(() => {\n return (props.height === \"small\") ? \"h-72\" : (props.height === \"medium\") ? \"h-96\" : \"h-[612px]\" \n});\n\n\nconst hasContent = computed(() => {\n return !!props.front.content || !!props.back.content || !!props.front.title || !!props.front.subtitle || !!props.back.title || !!props.back.subtitle;\n});\n\n\nconst darkMode = useColorMode();\n\nconst gradientFront = computed(() => {\n if (!props.front.bgImg) return undefined;\n const color = (darkMode.value === \"dark\") ? \"rgba(0,0,0,0.75)\" : \"rgba(255,255,255,0.8)\";\n return `linear-gradient(to bottom, ${color}, ${color}), url(${props.front.bgImg})`;\n});\n\nconst gradientBack = computed(() => {\n if (!props.back.bgImg) return undefined;\n const color = (darkMode.value === \"dark\") ? \"rgba(0,0,0,0.75)\" : \"rgba(255,255,255,0.8)\";\n return `linear-gradient(to bottom, ${color}, ${color}), url(${props.back.bgImg})`;\n});\n\n</script>\n\n<template>\n <div \n :class=\"`relative perspective-1000 cursor-pointer flex items-center justify-center
|
|
1
|
+
{"version":3,"file":"EpFlipCard.vue2.js","sources":["../../../src/components/interactions/EpFlipCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref} from 'vue'\n\nimport type { EpFlipCardProps } from \"~/types/interactions/EpFlipCard\";\nimport { mdiRotate360 } from '@mdi/js';\nimport EpIcon from '../basics/EpIcon.vue';\nimport { density_style, sizeCardThumbnailStyle } from '~/types/Card';\nimport { useColorMode } from '@vueuse/core';\nimport { useRenderText } from '~/composables/useRenderText';\n\nconst props = withDefaults(defineProps<EpFlipCardProps>(), {\n trigger: \"click\",\n noIndicator: false,\n density: \"default\",\n maxWidth: \"max-w-xl\",\n height: \"medium\",\n front: () => ({\n content: \"\",\n bgImg: \"\",\n bgColor: null,\n textColor: null,\n }),\n back: () => ({\n content: \"\",\n bgImg: \"\",\n bgColor: null,\n textColor: null,\n }),\n thumbnail: false,\n sizeThumbnail: \"medium\"\n});\n\nconst flipped = ref(false);\nconst toggle = () => {\n flipped.value = !flipped.value\n}\n\n\nconst stylesCard = computed(() => {\n return `\n shadow-lg \n ${density_style[props.density]}\n rounded-md\n `;\n});\n\nconst heightStyle = computed(() => {\n return (props.height === \"small\") ? \"h-72\" : (props.height === \"medium\") ? \"h-96\" : \"h-[612px]\" \n});\n\n\nconst hasContent = computed(() => {\n return !!props.front.content || !!props.back.content || !!props.front.title || !!props.front.subtitle || !!props.back.title || !!props.back.subtitle;\n});\n\n\nconst darkMode = useColorMode();\n\nconst gradientFront = computed(() => {\n if (!props.front.bgImg) return undefined;\n const color = (darkMode.value === \"dark\") ? \"rgba(0,0,0,0.75)\" : \"rgba(255,255,255,0.8)\";\n return `linear-gradient(to bottom, ${color}, ${color}), url(${props.front.bgImg})`;\n});\n\nconst gradientBack = computed(() => {\n if (!props.back.bgImg) return undefined;\n const color = (darkMode.value === \"dark\") ? \"rgba(0,0,0,0.75)\" : \"rgba(255,255,255,0.8)\";\n return `linear-gradient(to bottom, ${color}, ${color}), url(${props.back.bgImg})`;\n});\n\nconst styleSizeThumbnail = computed(() => {\n return sizeCardThumbnailStyle[props.sizeThumbnail];\n});\n\n</script>\n\n<template>\n <div \n :class=\"`relative perspective-1000 cursor-pointer ${heightStyle} my-3 ${thumbnail? 'inline-block m-3 ' + styleSizeThumbnail : 'flex items-center justify-center w-full'}`\" \n v-if=\"hasContent\"\n @click=\"() => {if(trigger === 'click') toggle()}\"\n > \n <div \n :class=\"`${maxWidth} h-full relative w-full`\"\n @mouseenter=\"() => { if (trigger === 'hover') flipped = true }\"\n @mouseleave=\"() => { if (trigger === 'hover') flipped = false }\"\n >\n <!-- Rotator -->\n <div\n :class=\"`relative w-full h-full transition-transform duration-500 preserve-3d\n ${flipped ? 'rotate-y-180' : ''}`\"\n >\n <!-- Front card -->\n <div \n :class=\"`${stylesCard} ${(!props.front.bgImg && !props.front.bgColor) ? 'bg-surface-2 dark:bg-surface-2-dark' : ''} absolute inset-0 w-full h-full backface-hidden overflow-y-auto\n bg-cover bg-center dark:text-white`\"\n :style=\"{ color: (front.textColor) ?? undefined, backgroundImage: gradientFront, backgroundColor: (front.bgImg || !front.bgColor)? undefined : front.bgColor}\"\n >\n <div\n v-if=\"front.title || front.subtitle\"\n class=\"mb-2\"\n >\n <h3 class=\"text-2xl font-bold\">{{ front.title }}</h3>\n <h4 :class=\"`text-xs`\">\n {{ front.subtitle }}\n </h4>\n </div>\n <div v-html=\"useRenderText(front.content ?? '')\"></div>\n </div>\n <!-- Back card -->\n <div\n :class=\"`${stylesCard} ${(!props.back.bgImg && !props.back.bgColor) ? 'bg-surface-2 dark:bg-surface-2-dark' : ''} absolute inset-0 w-full h-full rotate-y-180 backface-hidden overflow-y-auto\n bg-cover bg-center dark:text-white`\"\n :style=\"{ color: (back.textColor) ?? undefined, backgroundImage: gradientBack, backgroundColor: (back.bgImg || !back.bgColor)? undefined : back.bgColor}\"\n >\n <div\n v-if=\"back.title || back.subtitle\"\n class=\"mb-2\"\n >\n <h3 class=\"text-2xl font-bold\">{{ back.title }}</h3>\n <h4 :class=\"`text-xs`\">\n {{ back.subtitle }}\n </h4>\n </div>\n <div v-html=\"useRenderText(back.content ?? '')\"></div>\n </div>\n </div>\n\n <!-- Indicator -->\n <transition name=\"fade\">\n <div v-if=\"!noIndicator\"\n class=\"absolute bottom-2 right-2 flex items-center gap-1\n px-2 py-1 rounded-full bg-black/70 text-white text-[10px] font-medium\n pointer-events-none select-none\">\n <EpIcon\n :icon-path=\"mdiRotate360\"\n :class=\"`w-3.5 h-3.5 shrink-0 transition-transform duration-500\n ${flipped ? 'rotate-180' : ''}`\"\n />\n <span class=\"leading-none\">\n {{ trigger==='hover' ? 'Survoler' : 'Cliquer' }}\n </span>\n </div>\n </transition>\n </div>\n </div>\n</template>\n\n<style scoped>\n.perspective-1000 { perspective: 1000px }\n.preserve-3d { transform-style: preserve-3d }\n.backface-hidden { backface-visibility: hidden }\n.rotate-y-180 { transform: rotateY(180deg) }\n\n/* simple fade for the helper badge */\n.fade-enter-active, .fade-leave-active { transition: opacity .3s }\n.fade-enter-from, .fade-leave-to { opacity: 0 }\n</style>\n"],"names":["_createElementBlock","_normalizeClass","thumbnail","trigger","_createElementVNode","maxWidth","_normalizeStyle","front","_openBlock","_toDisplayString","_unref","back","_createVNode","_Transition","noIndicator","EpIcon"],"mappings":"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"}
|
package/dist/style.css
CHANGED
|
@@ -1,4 +1,9 @@
|
|
|
1
1
|
|
|
2
|
+
.katex[data-v-a9b6227c] {
|
|
3
|
+
font-size: 1.6em;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
|
|
2
7
|
.eptimeline-list-enter-active[data-v-6ad2fc60],
|
|
3
8
|
.eptimeline-list-leave-active[data-v-6ad2fc60] {
|
|
4
9
|
transition: all 0.5s ease;
|
|
@@ -8,67 +13,27 @@
|
|
|
8
13
|
opacity: 0;
|
|
9
14
|
transform: translateX(30px);
|
|
10
15
|
}
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
.ep-tree-wrapper[data-v-482cff9d] {
|
|
14
|
-
overflow: auto;
|
|
15
|
-
border: 1px solid #ddd;
|
|
16
|
-
}
|
|
17
|
-
.ep-tree-container[data-v-482cff9d] {
|
|
18
|
-
width: 100%;
|
|
19
|
-
overflow-x: auto;
|
|
20
|
-
}
|
|
21
16
|
/*$vite$:1*/
|
|
22
17
|
|
|
23
|
-
|
|
24
|
-
0% {
|
|
25
|
-
opacity: 0;
|
|
18
|
+
.perspective-1000[data-v-888bce6b] { perspective: 1000px
|
|
26
19
|
}
|
|
27
|
-
|
|
28
|
-
opacity: 1;
|
|
20
|
+
.preserve-3d[data-v-888bce6b] { transform-style: preserve-3d
|
|
29
21
|
}
|
|
22
|
+
.backface-hidden[data-v-888bce6b] { backface-visibility: hidden
|
|
30
23
|
}
|
|
31
|
-
|
|
32
|
-
0% {
|
|
33
|
-
transform: scale(0.5);
|
|
34
|
-
opacity: 0;
|
|
35
|
-
}
|
|
36
|
-
100% {
|
|
37
|
-
transform: scale(1);
|
|
38
|
-
opacity: 1;
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
@keyframes slideY-6f6eb558 {
|
|
42
|
-
0% {
|
|
43
|
-
transform: translateY(-100%);
|
|
44
|
-
opacity: 0;
|
|
45
|
-
}
|
|
46
|
-
100% {
|
|
47
|
-
transform: translateY(0);
|
|
48
|
-
opacity: 1;
|
|
49
|
-
}
|
|
24
|
+
.rotate-y-180[data-v-888bce6b] { transform: rotateY(180deg)
|
|
50
25
|
}
|
|
51
26
|
|
|
52
|
-
/*
|
|
53
|
-
.fade[data-v-
|
|
54
|
-
animation: fade-6f6eb558 1s;
|
|
55
|
-
}
|
|
56
|
-
.scale[data-v-6f6eb558] {
|
|
57
|
-
animation: scale-6f6eb558 1s;
|
|
58
|
-
}
|
|
59
|
-
.slideY[data-v-6f6eb558] {
|
|
60
|
-
animation: slideY-6f6eb558 1s;
|
|
27
|
+
/* simple fade for the helper badge */
|
|
28
|
+
.fade-enter-active[data-v-888bce6b], .fade-leave-active[data-v-888bce6b] { transition: opacity .3s
|
|
61
29
|
}
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
pre {
|
|
65
|
-
white-space: break-spaces;
|
|
30
|
+
.fade-enter-from[data-v-888bce6b], .fade-leave-to[data-v-888bce6b] { opacity: 0
|
|
66
31
|
}
|
|
67
32
|
/*$vite$:1*/
|
|
68
33
|
|
|
69
|
-
.ep-
|
|
70
|
-
|
|
71
|
-
|
|
34
|
+
.ep-accordeon-content[data-v-9a4f2570] {
|
|
35
|
+
transition: max-height 0.2s ease-out;
|
|
36
|
+
overflow: hidden;
|
|
72
37
|
}
|
|
73
38
|
/*$vite$:1*/
|
|
74
39
|
|
|
@@ -111,41 +76,76 @@ pre {
|
|
|
111
76
|
}
|
|
112
77
|
/*$vite$:1*/
|
|
113
78
|
|
|
114
|
-
.
|
|
115
|
-
|
|
116
|
-
width: var(--3f346a72);
|
|
79
|
+
.ep-sensible-content[data-v-1ec08c6f] {
|
|
80
|
+
position: relative;
|
|
117
81
|
}
|
|
118
82
|
/*$vite$:1*/
|
|
119
83
|
|
|
120
|
-
.ep-
|
|
121
|
-
|
|
122
|
-
|
|
84
|
+
.ep-tree-wrapper[data-v-482cff9d] {
|
|
85
|
+
overflow: auto;
|
|
86
|
+
border: 1px solid #ddd;
|
|
123
87
|
}
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
position: relative;
|
|
88
|
+
.ep-tree-container[data-v-482cff9d] {
|
|
89
|
+
width: 100%;
|
|
90
|
+
overflow-x: auto;
|
|
128
91
|
}
|
|
129
92
|
/*$vite$:1*/
|
|
130
93
|
|
|
131
|
-
|
|
132
|
-
|
|
94
|
+
pre {
|
|
95
|
+
white-space: break-spaces;
|
|
133
96
|
}
|
|
134
97
|
/*$vite$:1*/
|
|
135
98
|
|
|
136
|
-
|
|
99
|
+
@keyframes fade-6f6eb558 {
|
|
100
|
+
0% {
|
|
101
|
+
opacity: 0;
|
|
137
102
|
}
|
|
138
|
-
|
|
103
|
+
100% {
|
|
104
|
+
opacity: 1;
|
|
139
105
|
}
|
|
140
|
-
.backface-hidden[data-v-51e4a299] { backface-visibility: hidden
|
|
141
106
|
}
|
|
142
|
-
|
|
107
|
+
@keyframes scale-6f6eb558 {
|
|
108
|
+
0% {
|
|
109
|
+
transform: scale(0.5);
|
|
110
|
+
opacity: 0;
|
|
111
|
+
}
|
|
112
|
+
100% {
|
|
113
|
+
transform: scale(1);
|
|
114
|
+
opacity: 1;
|
|
115
|
+
}
|
|
116
|
+
}
|
|
117
|
+
@keyframes slideY-6f6eb558 {
|
|
118
|
+
0% {
|
|
119
|
+
transform: translateY(-100%);
|
|
120
|
+
opacity: 0;
|
|
121
|
+
}
|
|
122
|
+
100% {
|
|
123
|
+
transform: translateY(0);
|
|
124
|
+
opacity: 1;
|
|
125
|
+
}
|
|
143
126
|
}
|
|
144
127
|
|
|
145
|
-
/*
|
|
146
|
-
.fade
|
|
128
|
+
/* Transition animation */
|
|
129
|
+
.fade[data-v-6f6eb558] {
|
|
130
|
+
animation: fade-6f6eb558 1s;
|
|
131
|
+
}
|
|
132
|
+
.scale[data-v-6f6eb558] {
|
|
133
|
+
animation: scale-6f6eb558 1s;
|
|
134
|
+
}
|
|
135
|
+
.slideY[data-v-6f6eb558] {
|
|
136
|
+
animation: slideY-6f6eb558 1s;
|
|
137
|
+
}
|
|
138
|
+
/*$vite$:1*/
|
|
139
|
+
|
|
140
|
+
.ep-info-box[data-v-64f3d0d8] a {
|
|
141
|
+
text-decoration: underline;
|
|
142
|
+
font-weight: 500;
|
|
147
143
|
}
|
|
148
|
-
|
|
144
|
+
/*$vite$:1*/
|
|
145
|
+
|
|
146
|
+
.shape[data-v-4a99873e] {
|
|
147
|
+
height: var(--e4ec2c0a);
|
|
148
|
+
width: var(--3f346a72);
|
|
149
149
|
}
|
|
150
150
|
/*$vite$:1*/
|
|
151
151
|
|
|
@@ -160,15 +160,15 @@ pre {
|
|
|
160
160
|
}
|
|
161
161
|
/*$vite$:1*/
|
|
162
162
|
|
|
163
|
-
.ep-content-timeline-item[data-v-5f6c3e06] {
|
|
164
|
-
max-height: 0;
|
|
165
|
-
overflow: hidden;
|
|
166
|
-
}
|
|
167
|
-
/*$vite$:1*/
|
|
168
|
-
|
|
169
163
|
.ep-display-box[data-v-4e1d2bd1] {
|
|
170
164
|
z-index: 9999;
|
|
171
165
|
position: absolute;
|
|
172
166
|
right: 12rem;
|
|
173
167
|
}
|
|
168
|
+
/*$vite$:1*/
|
|
169
|
+
|
|
170
|
+
.ep-content-timeline-item[data-v-5f6c3e06] {
|
|
171
|
+
max-height: 0;
|
|
172
|
+
overflow: hidden;
|
|
173
|
+
}
|
|
174
174
|
/*$vite$:1*/
|
package/dist/types/Avatar.d.ts
CHANGED
|
@@ -3,16 +3,22 @@ export declare const typeAvatar: {
|
|
|
3
3
|
small: string;
|
|
4
4
|
middle: string;
|
|
5
5
|
big: string;
|
|
6
|
+
bigger: string;
|
|
7
|
+
biggest: string;
|
|
6
8
|
};
|
|
7
9
|
square: {
|
|
8
10
|
small: string;
|
|
9
11
|
middle: string;
|
|
10
12
|
big: string;
|
|
13
|
+
bigger: string;
|
|
14
|
+
biggest: string;
|
|
11
15
|
};
|
|
12
16
|
rounded: {
|
|
13
17
|
small: string;
|
|
14
18
|
middle: string;
|
|
15
19
|
big: string;
|
|
20
|
+
bigger: string;
|
|
21
|
+
biggest: string;
|
|
16
22
|
};
|
|
17
23
|
};
|
|
18
24
|
export type TypeAvatar = keyof typeof typeAvatar;
|
package/dist/types/Avatar.js
CHANGED
|
@@ -1,18 +1,24 @@
|
|
|
1
1
|
const typeAvatar = {
|
|
2
2
|
circle: {
|
|
3
|
-
small: "
|
|
4
|
-
middle: "rounded-full
|
|
5
|
-
big: "rounded-full
|
|
3
|
+
small: "rounded-full w-12 h-12 text-5xl",
|
|
4
|
+
middle: "rounded-full w-14 h-14 text-6xl",
|
|
5
|
+
big: "rounded-full w-16 h-16 text-7xl",
|
|
6
|
+
bigger: "rounded-full w-20 h-20 text-8xl",
|
|
7
|
+
biggest: "rounded-full w-24 h-24 text-9xl"
|
|
6
8
|
},
|
|
7
9
|
square: {
|
|
8
|
-
small: "w-12 h-12
|
|
9
|
-
middle: "w-14 h-14
|
|
10
|
-
big: "w-16 h-16
|
|
10
|
+
small: "w-12 h-12 text-5xl",
|
|
11
|
+
middle: "w-14 h-14 text-6xl",
|
|
12
|
+
big: "w-16 h-16 text-7xl",
|
|
13
|
+
bigger: "w-20 h-20 text-8xl",
|
|
14
|
+
biggest: "w-24 h-24 text-9xl"
|
|
11
15
|
},
|
|
12
16
|
rounded: {
|
|
13
|
-
small: "rounded
|
|
14
|
-
middle: "rounded
|
|
15
|
-
big: "rounded
|
|
17
|
+
small: "rounded w-12 h-12 text-5xl",
|
|
18
|
+
middle: "rounded w-14 h-14 text-6xl",
|
|
19
|
+
big: "rounded w-16 h-16 text-7xl",
|
|
20
|
+
bigger: "rounded w-20 h-20 text-8xl",
|
|
21
|
+
biggest: "rounded w-24 h-24 text-9xl"
|
|
16
22
|
}
|
|
17
23
|
};
|
|
18
24
|
export {
|
package/dist/types/Avatar.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.js","sources":["../../src/types/Avatar.ts"],"sourcesContent":["export const typeAvatar = {\n
|
|
1
|
+
{"version":3,"file":"Avatar.js","sources":["../../src/types/Avatar.ts"],"sourcesContent":["export const typeAvatar = {\n circle: {\n small: 'rounded-full w-12 h-12 text-5xl',\n middle: 'rounded-full w-14 h-14 text-6xl',\n big: 'rounded-full w-16 h-16 text-7xl',\n bigger: 'rounded-full w-20 h-20 text-8xl',\n biggest: 'rounded-full w-24 h-24 text-9xl',\n },\n square: {\n small: 'w-12 h-12 text-5xl',\n middle: 'w-14 h-14 text-6xl',\n big: 'w-16 h-16 text-7xl',\n bigger: 'w-20 h-20 text-8xl',\n biggest: 'w-24 h-24 text-9xl',\n },\n rounded: {\n small: 'rounded w-12 h-12 text-5xl',\n middle: 'rounded w-14 h-14 text-6xl',\n big: 'rounded w-16 h-16 text-7xl',\n bigger: 'rounded w-20 h-20 text-8xl',\n biggest: 'rounded w-24 h-24 text-9xl',\n },\n};\n\nexport type TypeAvatar = keyof typeof typeAvatar;\n"],"names":[],"mappings":"AAAO,MAAM,aAAa;AAAA,EACxB,QAAQ;AAAA,IACN,OAAS;AAAA,IACT,QAAS;AAAA,IACT,KAAS;AAAA,IACT,QAAS;AAAA,IACT,SAAS;AAAA,EAAA;AAAA,EAEX,QAAQ;AAAA,IACN,OAAS;AAAA,IACT,QAAS;AAAA,IACT,KAAS;AAAA,IACT,QAAS;AAAA,IACT,SAAS;AAAA,EAAA;AAAA,EAEX,SAAS;AAAA,IACP,OAAS;AAAA,IACT,QAAS;AAAA,IACT,KAAS;AAAA,IACT,QAAS;AAAA,IACT,SAAS;AAAA,EAAA;AAEb;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
type Color = "primary" | "secondary" | "error" | "warning" | "success" | "info" | "question" | "tip";
|
|
2
2
|
type Variant = "circle" | "square" | "rounded";
|
|
3
|
-
type Size = "small" | "middle" | "big";
|
|
3
|
+
type Size = "small" | "middle" | "big" | "bigger" | "biggest";
|
|
4
4
|
export interface ListItem {
|
|
5
5
|
uid?: string;
|
|
6
6
|
avatar?: string;
|
|
@@ -20,6 +20,8 @@ export declare const roundedType: {
|
|
|
20
20
|
small: string;
|
|
21
21
|
middle: string;
|
|
22
22
|
big: string;
|
|
23
|
+
bigger: string;
|
|
24
|
+
biggest: string;
|
|
23
25
|
};
|
|
24
26
|
export type RoundedStyle = keyof typeof roundedType;
|
|
25
27
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StackedList.js","sources":["../../src/types/StackedList.ts"],"sourcesContent":["type Color = \"primary\" | \"secondary\" | \"error\" | \"warning\" | \"success\" | \"info\" | \"question\" | \"tip\";\ntype Variant = \"circle\" | \"square\" | \"rounded\";\ntype Size = \"small\" | \"middle\" | \"big\";\nimport type { ContentComponents } from \"./Component\";\n\ninterface Avatar {\n src?: string;\n alt: string;\n name?:string\n}\n\nexport interface ListItem {\n uid?:string;\n avatar?: string;\n title: string;\n description: string;\n url?:string;\n icon?:string;\n}\n\nexport interface AvatarStyle {\n color?: Color;\n size?: Size;\n variant?: Variant;\n name?: string\n}\n\nexport const roundedType = {\n none: \"rounded-none\",\n small: \"rounded-md\",\n middle: \"rounded-lg\",\n big: \"rounded-2xl\",\n}\n//show to josue\nexport type RoundedStyle = keyof typeof roundedType\n\n\n\n"],"names":[],"mappings":"AA2BO,MAAM,cAAc;AAAA,EACvB,MAAM;AAAA,EACN,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,KAAK;
|
|
1
|
+
{"version":3,"file":"StackedList.js","sources":["../../src/types/StackedList.ts"],"sourcesContent":["type Color = \"primary\" | \"secondary\" | \"error\" | \"warning\" | \"success\" | \"info\" | \"question\" | \"tip\";\ntype Variant = \"circle\" | \"square\" | \"rounded\";\ntype Size = \"small\" | \"middle\" | \"big\" | \"bigger\" | \"biggest\";\nimport type { ContentComponents } from \"./Component\";\n\ninterface Avatar {\n src?: string;\n alt: string;\n name?:string\n}\n\nexport interface ListItem {\n uid?:string;\n avatar?: string;\n title: string;\n description: string;\n url?:string;\n icon?:string;\n}\n\nexport interface AvatarStyle {\n color?: Color;\n size?: Size;\n variant?: Variant;\n name?: string\n}\n\nexport const roundedType = {\n none: \"rounded-none\",\n small: \"rounded-md\",\n middle: \"rounded-lg\",\n big: \"rounded-2xl\",\n bigger: \"rounded-3xl\",\n biggest: \"rounded-full\",\n}\n//show to josue\nexport type RoundedStyle = keyof typeof roundedType\n\n\n\n"],"names":[],"mappings":"AA2BO,MAAM,cAAc;AAAA,EACvB,MAAM;AAAA,EACN,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,QAAQ;AAAA,EACR,SAAS;AACb;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { MaxWidth } from './../Hover';
|
|
2
|
-
import { Density } from '../Card';
|
|
2
|
+
import { Density, SizeCardThumbnail } from '../Card';
|
|
3
3
|
import { Color } from '../Colors';
|
|
4
4
|
interface CardSide {
|
|
5
5
|
title?: string | null;
|
|
@@ -18,4 +18,6 @@ export interface EpFlipCardProps {
|
|
|
18
18
|
density?: Density;
|
|
19
19
|
maxWidth?: MaxWidth;
|
|
20
20
|
height?: "small" | "medium" | "large";
|
|
21
|
+
thumbnail?: boolean;
|
|
22
|
+
sizeThumbnail?: SizeCardThumbnail
|
|
21
23
|
}
|