@webdelo_org/blockstack v1.0.0

Webdelo BlockStack V3

webdelo-blockstack-v3 is a Vue 3 component package that provides an interactive block stack interface for managing content blocks. It integrates with PrimeVue, offering a flexible and customizable solution for building content-based applications.

Installation

To install webdelo-blockstack-v3 and its required dependencies, run the following command:

npm install webdelo-blockstack-v3 primevue @primevue/themes

Configuration

import { createApp } from 'vue'
import App from './App.vue'
import BlockStackV3 from 'webdelo-blockstack-v3'
import PrimeVue from 'primevue/config'
import { Aura } from '@primevue/themes'
import { ConfirmationService } from 'primevue/confirmationservice'

const app = createApp(App)

// PrimeVue configuration
app.use(PrimeVue, {
theme: {
preset: Aura,
options: { darkModeSelector: '.fake-dark-selector' },
},
})

// Register services and BlockStackV3 plugin globally
app.use(ConfirmationService)
app.use(BlockStackV3)

app.mount('#app')

Usage

<template>
  <TabPanel value="3" v-if="product">
    <BlockStackV3 :blocks="product.blocks" @updateBlocks="updateBlocks" @reload="() => emit('reload')" />
  </TabPanel>
</template>

<script setup>
const emit = defineEmits(['reload'])

const props = defineProps({
  product: {
    type: Object,
    required: true
  }
})

// Handle updated blocks
const updateBlocks = (blocks) => {
  props.product.blocks = blocks
}
</script>