adrema/resources/js/views/formtemplate/Asideform.vue

<template>
    <ui-box class="relative" :heading="heading" container-class="grid gap-3">
        <slot></slot>
        <template #in-title>
            <div class="flex ml-3 space-x-3 absolute right-0 top-0 mr-4 mt-4">
                <a v-if="storeable" href="#" @click.prevent="$emit('submit')">
                    <ui-sprite src="save" class="text-zinc-400 w-4 h-4"></ui-sprite>
                </a>
                <a v-if="closeable" href="#" @click.prevent="$emit('close')">
                    <ui-sprite src="close" class="text-zinc-400 w-4 h-4"></ui-sprite>
                </a>
            </div>
        </template>
    </ui-box>
</template>

<script lang="js" setup>
const emit = defineEmits(['close', 'submit']);

const props = defineProps({
    heading: {},
    closeable: {
        default: () => true,
        type: Boolean,
    },
    storeable: {
        default: () => true,
        type: Boolean,
    },
});
</script>