@volverjs/ui-vue 0.0.9-beta.8 → 0.0.9-beta.9

package/src/components/VvAlertGroup/VvAlertGroup.vue

@@ -8,8 +8,10 @@
 	import { useVvAlertGroup, VvAlertGroupEvents, VvAlertGroupProps } from '.'
 	import VvAlert from '../VvAlert/VvAlert.vue'
 
+	// props and emit
 	const props = defineProps(VvAlertGroupProps)
 	const emit = defineEmits(VvAlertGroupEvents)
+
 	const { hasProps, hasTransition } = useVvAlertGroup(props, emit)
 
 	const alertGroupTransitionHandlers = {

package/src/components/VvDialog/VvDialog.vue

@@ -17,7 +17,7 @@
 	// data
 	const modelValue = useVModel(props, 'modelValue', emit)
 	const localModelValue = ref(false)
-	const opened = computed({
+	const isOpened = computed({
 		get: () => modelValue.value ?? localModelValue.value,
 		set: (newValue) => {
 			if (modelValue.value === undefined) {
@@ -80,37 +80,36 @@
 
 	// methods
 	onClickOutside(modalWrapper, () => {
-		if (!props.keepOpen && opened.value) {
-			opened.value = false
+		if (!props.keepOpen) {
+			close()
 		}
 	})
 
 	function close() {
-		opened.value = false
+		isOpened.value = false
 	}
 
 	function open() {
-		opened.value = true
+		isOpened.value = true
 	}
 
 	defineExpose({ close, open })
 
-	// keyboard
-	onKeyStroke('Escape', (e) => {
-		if (opened.value) {
-			e.preventDefault()
+	const onCancel = () => {
+		if (!props.keepOpen) {
 			close()
 		}
-	})
+	}
 </script>
 
 <template>
 	<Transition :name="transitioName" v-on="dialogTransitionHandlers">
 		<dialog
-			v-show="opened"
+			v-show="isOpened"
 			v-bind="dialogAttrs"
 			ref="dialogEl"
 			:class="dialogClass"
+			@cancel.stop.prevent="onCancel"
 		>
 			<article ref="modalWrapper" class="vv-dialog__wrapper">
 				<header v-if="$slots.header || title" class="vv-dialog__header">

package/src/components/common/HintSlot.ts

@@ -40,27 +40,35 @@ export function HintSlotFactory(
 	propsOrRef: HintSlotProps | Ref<HintSlotProps>,
 	slots: Slots,
 ) {
-	const props = unref(propsOrRef)
+	const props = computed(() => {
+		if (isRef(propsOrRef)) {
+			return propsOrRef.value
+		}
+		return propsOrRef
+	})
+
 	// label
-	const invalidLabel = computed(() => joinLines(props.invalidLabel))
-	const validLabel = computed(() => joinLines(props.validLabel))
-	const loadingLabel = computed(() => props.loadingLabel)
-	const hintLabel = computed(() => props.hintLabel)
+	const invalidLabel = computed(() => joinLines(props.value.invalidLabel))
+	const validLabel = computed(() => joinLines(props.value.validLabel))
+	const loadingLabel = computed(() => props.value.loadingLabel)
+	const hintLabel = computed(() => props.value.hintLabel)
 
 	// type
 	const hasLoadingLabelOrSlot = computed(() =>
-		Boolean(props.loading && (slots.loading || loadingLabel.value)),
+		Boolean(props.value.loading && (slots.loading || loadingLabel.value)),
 	)
 	const hasInvalidLabelOrSlot = computed(
 		() =>
 			!hasLoadingLabelOrSlot.value &&
-			Boolean(props.invalid && (slots.invalid || invalidLabel.value)),
+			Boolean(
+				props.value.invalid && (slots.invalid || invalidLabel.value),
+			),
 	)
 	const hasValidLabelOrSlot = computed(
 		() =>
 			!hasLoadingLabelOrSlot.value &&
 			!hasInvalidLabelOrSlot.value &&
-			Boolean(props.valid && (slots.valid || validLabel.value)),
+			Boolean(props.value.valid && (slots.valid || validLabel.value)),
 	)
 	const hasHintLabelOrSlot = computed(
 		() =>
@@ -77,10 +85,10 @@ export function HintSlotFactory(
 			hasHintLabelOrSlot.value,
 	)
 	const hintSlotScope = computed(() => ({
-		modelValue: props.modelValue,
-		valid: props.valid,
-		invalid: props.invalid,
-		loading: props.loading,
+		modelValue: props.value.modelValue,
+		valid: props.value.valid,
+		invalid: props.value.invalid,
+		loading: props.value.loading,
 	}))
 	// component
 	const HintSlot = defineComponent({

package/src/resolvers/unplugin.ts

@@ -60,6 +60,9 @@ export const getStyleNames = function (kebabName: string) {
 			'vv-dropdown-action',
 		]
 	}
+	if (kebabName === 'vv-button-group') {
+		return ['vv-button', 'vv-button-group']
+	}
 	if (kebabName === 'vv-accordion-group') {
 		return ['vv-accordion', 'vv-accordion-group']
 	}