Skip to content

Commit d1c1682

Browse files
smolenski-mikolajsmolenski-mikolaj
committed
release 3.1.1
1 parent 8453605 commit d1c1682

File tree

73 files changed

+648
-489
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

73 files changed

+648
-489
lines changed

‎README.txt‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
MDB 5 Vue
22

3-
Version: FREE 3.1.0
3+
Version: FREE 3.1.1
44

55
Documentation:
66
https://mdbootstrap.com/docs/b5/vue/

‎js/mdb.es.min.js‎

Lines changed: 56 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1053,7 +1053,9 @@ const _sfc_main$K = /* @__PURE__ */ defineComponent({
10531053
tag: {
10541054
type: String,
10551055
default: "ul"
1056-
}
1056+
},
1057+
light: Boolean,
1058+
small: Boolean
10571059
},
10581060
setup(__props) {
10591061
const props = __props;
@@ -1062,7 +1064,9 @@ const _sfc_main$K = /* @__PURE__ */ defineComponent({
10621064
"list-group",
10631065
props.horizontal && horizontalClass.value,
10641066
props.flush && "list-group-flush",
1065-
props.numbered && "list-group-numbered"
1067+
props.numbered && "list-group-numbered",
1068+
props.light && "list-group-light",
1069+
props.small && "list-group-small"
10661070
];
10671071
});
10681072
const horizontalClass = computed(() => {
@@ -1105,21 +1109,38 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
11051109
type: Boolean,
11061110
default: false
11071111
},
1108-
color: String
1112+
color: String,
1113+
noBorder: Boolean,
1114+
spacing: {
1115+
type: [Boolean, String],
1116+
default: false
1117+
},
1118+
ripple: {
1119+
type: [Object, Boolean],
1120+
default: false
1121+
}
11091122
},
11101123
setup(__props) {
11111124
const props = __props;
1125+
const spacingClass = computed(() => {
1126+
if (!props.spacing) {
1127+
return;
1128+
}
1129+
return props.spacing !== true ? props.spacing : "px-3";
1130+
});
11121131
const className = computed(() => {
11131132
return [
11141133
"list-group-item",
11151134
props.active && "active",
11161135
props.disabled && "disabled",
11171136
props.action && "list-group-item-action",
1118-
props.color && `list-group-item-${props.color}`
1137+
props.color && `list-group-item-${props.color}`,
1138+
props.noBorder && `border-0`,
1139+
props.spacing && spacingClass.value
11191140
];
11201141
});
11211142
return (_ctx, _cache) => {
1122-
return openBlock(), createBlock(resolveDynamicComponent(__props.tag), {
1143+
return withDirectives((openBlock(), createBlock(resolveDynamicComponent(__props.tag), {
11231144
class: normalizeClass(unref(className)),
11241145
"aria-current": __props.active ? true : null,
11251146
"aria-disabled": __props.disabled ? true : null,
@@ -1129,7 +1150,9 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
11291150
renderSlot(_ctx.$slots, "default")
11301151
]),
11311152
_: 3
1132-
}, 8, ["class", "aria-current", "aria-disabled", "disabled"]);
1153+
}, 8, ["class", "aria-current", "aria-disabled", "disabled"])), [
1154+
[unref(RippleDirective), props.ripple]
1155+
]);
11331156
};
11341157
}
11351158
});
@@ -3457,6 +3480,7 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
34573480
},
34583481
setup(__props) {
34593482
const props = __props;
3483+
const animationDuration = 550;
34603484
const className = computed(() => {
34613485
return [
34623486
"dropdown-menu",
@@ -3482,7 +3506,7 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
34823506
}
34833507
setTimeout(() => {
34843508
fadeClass.value = false;
3485-
}, 300);
3509+
}, animationDuration);
34863510
};
34873511
const setMenuMountedState = inject("setMenuMountedState", () => false);
34883512
const isActive = inject("isActive", false);
@@ -3498,7 +3522,7 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
34983522
setInactive();
34993523
setTimeout(() => {
35003524
setMenuMountedState(false);
3501-
}, 300);
3525+
}, animationDuration);
35023526
}
35033527
}
35043528
);
@@ -3518,7 +3542,7 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
35183542
} else if (isActive && !isActive.value && isPopperActive && !isPopperActive.value) {
35193543
setTimeout(() => {
35203544
return false;
3521-
}, 300);
3545+
}, animationDuration);
35223546
}
35233547
return false;
35243548
});
@@ -4376,9 +4400,12 @@ function useMDBModal(props, emit) {
43764400
el.style.opacity = "0";
43774401
el.style.display = "block";
43784402
setScrollbar();
4379-
document.body.style.paddingRight = `${scrollbarWidth.value}px`;
4380-
el.style.paddingRight = `${scrollbarWidth.value}px`;
4381-
document.body.classList.add("modal-open");
4403+
isOnlyNonInvasiveModal();
4404+
if (onlyNonInvasiveModal.value) {
4405+
document.body.style.paddingRight = `${scrollbarWidth.value}px`;
4406+
el.style.paddingRight = `${scrollbarWidth.value}px`;
4407+
document.body.classList.add("modal-open");
4408+
}
43824409
emit("show", root.value);
43834410
};
43844411
const afterEnter = (el) => {
@@ -4403,11 +4430,13 @@ function useMDBModal(props, emit) {
44034430
const child = el.childNodes[0];
44044431
child.style.transform = dialogTransform.value;
44054432
el.style.opacity = "0";
4406-
setTimeout(() => {
4407-
el.style.paddingRight = "";
4408-
document.body.style.paddingRight = "";
4409-
document.body.classList.remove("modal-open");
4410-
}, 200);
4433+
if (onlyNonInvasiveModal.value) {
4434+
setTimeout(() => {
4435+
el.style.paddingRight = "";
4436+
document.body.style.paddingRight = "";
4437+
document.body.classList.remove("modal-open");
4438+
}, 200);
4439+
}
44114440
emit("hide", thisElement.value);
44124441
if (props.keyboard) {
44134442
off(window, "keyup", handleEscKeyUp);
@@ -4423,6 +4452,10 @@ function useMDBModal(props, emit) {
44234452
onBeforeUnmount(() => {
44244453
off(window, "keyup", handleEscKeyUp);
44254454
});
4455+
const onlyNonInvasiveModal = ref(true);
4456+
const isOnlyNonInvasiveModal = () => {
4457+
onlyNonInvasiveModal.value = document.body.classList.contains("modal-open") ? document.querySelector(".modal.non-invasive") ? true : false : true;
4458+
};
44264459
return {
44274460
wrapperClass,
44284461
dialogClass,
@@ -4447,7 +4480,9 @@ function useMDBModal(props, emit) {
44474480
dialogTransform,
44484481
animateStaticModal,
44494482
fullscreenClass,
4450-
clickFromBackdrop
4483+
clickFromBackdrop,
4484+
isOnlyNonInvasiveModal,
4485+
onlyNonInvasiveModal
44514486
};
44524487
}
44534488
const __default__$y = {
@@ -7224,10 +7259,11 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
72247259
});
72257260
const _hoisted_1$2 = ["for"];
72267261
const _hoisted_2$2 = ["id"];
7262+
const MDBFileList = typeof FileList !== "undefined" ? FileList : Object;
72277263
const __default__$2 = {
72287264
name: "MDBFile"
72297265
};
7230-
const _sfc_main$2 = /* @__PURE__ */ defineComponent({
7266+
const _sfc_main$2 = defineComponent({
72317267
...__default__$2,
72327268
props: {
72337269
id: String,
@@ -7239,7 +7275,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
72397275
label: String,
72407276
labelClass: String,
72417277
modelValue: {
7242-
type: [FileList, Array],
7278+
type: [MDBFileList, Array],
72437279
default: () => []
72447280
},
72457281
size: String,

‎js/mdb.umd.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "mdb-vue-ui-kit",
3-
"version": "3.1.0",
3+
"version": "3.1.1",
44
"type": "module",
55
"main": "js/mdb.umd.min.js",
66
"module": "js/mdb.es.min.js",

‎src/components/free/components/MDBDropdownMenu.vue‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -88,6 +88,8 @@ const props = defineProps({
8888
},
8989
});
9090
91+
const animationDuration = 550;
92+
9193
const className = computed(() => {
9294
return [
9395
"dropdown-menu",
@@ -118,7 +120,7 @@ const handleAnimation = () => {
118120
119121
setTimeout(() => {
120122
fadeClass.value = false;
121-
}, 300);
123+
}, animationDuration);
122124
};
123125
124126
// ------------------- isActive -------------------
@@ -143,7 +145,7 @@ if (isActive) {
143145
144146
setTimeout(() => {
145147
setMenuMountedState(false);
146-
}, 300);
148+
}, animationDuration);
147149
}
148150
}
149151
);
@@ -179,7 +181,7 @@ const isMounted = computed(() => {
179181
/* eslint-disable */
180182
setTimeout(() => {
181183
return false;
182-
}, 300);
184+
}, animationDuration);
183185
/* eslint-enable */
184186
}
185187

‎src/components/free/components/MDBListGroup.vue‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,13 +27,17 @@ const props = defineProps({
2727
type: String,
2828
default: "ul",
2929
},
30+
light: Boolean,
31+
small: Boolean,
3032
});
3133
const className = computed(() => {
3234
return [
3335
"list-group",
3436
props.horizontal && horizontalClass.value,
3537
props.flush && "list-group-flush",
3638
props.numbered && "list-group-numbered",
39+
props.light && "list-group-light",
40+
props.small && "list-group-small",
3741
];
3842
});
3943

‎src/components/free/components/MDBListGroupItem.vue‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
:aria-current="active ? true : null"
66
:aria-disabled="disabled ? true : null"
77
:disabled="disabled ? true : null"
8+
v-mdb-ripple="props.ripple"
89
>
910
<slot />
1011
</component>
@@ -18,6 +19,7 @@ export default {
1819

1920
<script setup lang="ts">
2021
import { computed } from "vue";
22+
import vMdbRipple from "../../../directives/free/mdbRipple";
2123
2224
const props = defineProps({
2325
tag: {
@@ -37,6 +39,22 @@ const props = defineProps({
3739
default: false,
3840
},
3941
color: String,
42+
noBorder: Boolean,
43+
spacing: {
44+
type: [Boolean, String],
45+
default: false,
46+
},
47+
ripple: {
48+
type: [Object, Boolean],
49+
default: false,
50+
},
51+
});
52+
53+
const spacingClass = computed(() => {
54+
if (!props.spacing) {
55+
return;
56+
}
57+
return props.spacing !== true ? props.spacing : "px-3";
4058
});
4159
4260
const className = computed(() => {
@@ -46,6 +64,8 @@ const className = computed(() => {
4664
props.disabled && "disabled",
4765
props.action && "list-group-item-action",
4866
props.color && `list-group-item-${props.color}`,
67+
props.noBorder && `border-0`,
68+
props.spacing && spacingClass.value,
4969
];
5070
});
5171
</script>

‎src/components/free/forms/MDBFile.vue‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,8 @@
1616
</template>
1717

1818
<script lang="ts">
19+
export const MDBFileList = typeof FileList !== "undefined" ? FileList : Object;
20+
1921
export default {
2022
name: "MDBFile",
2123
};
@@ -35,7 +37,7 @@ const props = defineProps({
3537
label: String,
3638
labelClass: String,
3739
modelValue: {
38-
type: [FileList, Array] as PropType<FileList | File[]>,
40+
type: [MDBFileList, Array] as PropType<FileList | File[]>,
3941
default: () => [],
4042
},
4143
size: String,

‎src/components/utils/useScrollbarWidth.ts‎

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,12 @@ import { ref } from "vue";
22

33
const debounce = ref(false);
44

5+
const onlyModal = ref<boolean>(null);
6+
7+
const isOnlyModal = () => {
8+
onlyModal.value = !document.body.classList.contains("modal-open");
9+
};
10+
511
export const useScrollbarWidth = () => {
612
// Animation
713
const defaultPaddingRight = document.body.style.paddingRight;
@@ -16,19 +22,24 @@ export const useScrollbarWidth = () => {
1622
};
1723
const beforeEnter = () => {
1824
if (document.body.scrollHeight > window.innerHeight) {
25+
!onlyModal.value && isOnlyModal();
1926
debounce.value = true;
2027
document.body.classList.add("modal-open");
21-
const paddingRightWhenActive = Number(getScrollbarWidth().toFixed(2));
22-
if (paddingRightWhenActive > 0) {
23-
document.body.style.paddingRight = `${paddingRightWhenActive}px`;
28+
if (onlyModal.value) {
29+
const paddingRightWhenActive = Number(getScrollbarWidth().toFixed(2));
30+
if (paddingRightWhenActive > 0) {
31+
document.body.style.paddingRight = `${paddingRightWhenActive}px`;
32+
}
33+
setTimeout(() => (debounce.value = false), 500);
2434
}
25-
setTimeout(() => (debounce.value = false), 500);
2635
}
2736
};
2837
const afterLeave = () => {
2938
if (debounce.value) return;
30-
document.body.classList.remove("modal-open");
31-
document.body.style.paddingRight = defaultPaddingRight;
39+
if (onlyModal.value) {
40+
document.body.classList.remove("modal-open");
41+
document.body.style.paddingRight = defaultPaddingRight;
42+
}
3243
};
3344

3445
return {

0 commit comments

Comments
 (0)