@veristone/nuxt-v-app 0.2.8 → 0.2.9

package/app/pages/playground/charts.vue

@@ -13,55 +13,55 @@
       <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartAreaMini</h3>
+              <h3 class="text-sm font-semibold">VAChartAreaMini</h3>
             </template>
             <ClientOnly>
-              <VaChartAreaMini />
+              <VAChartAreaMini />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartBarMini</h3>
+              <h3 class="text-sm font-semibold">VAChartBarMini</h3>
             </template>
             <ClientOnly>
-              <VaChartBarMini />
+              <VAChartBarMini />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartLineMini</h3>
+              <h3 class="text-sm font-semibold">VAChartLineMini</h3>
             </template>
             <ClientOnly>
-              <VaChartLineMini />
+              <VAChartLineMini />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartDonutMini</h3>
+              <h3 class="text-sm font-semibold">VAChartDonutMini</h3>
             </template>
             <ClientOnly>
-              <VaChartDonutMini />
+              <VAChartDonutMini />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartDonutHalf</h3>
+              <h3 class="text-sm font-semibold">VAChartDonutHalf</h3>
             </template>
             <ClientOnly>
-              <VaChartDonutHalf />
+              <VAChartDonutHalf />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartStepMinimal</h3>
+              <h3 class="text-sm font-semibold">VAChartStepMinimal</h3>
             </template>
             <ClientOnly>
-              <VaChartStepMinimal />
+              <VAChartStepMinimal />
             </ClientOnly>
           </UCard>
         </div>
@@ -72,73 +72,73 @@
       <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartRevenue</h3>
+              <h3 class="text-sm font-semibold">VAChartRevenue</h3>
             </template>
             <ClientOnly>
-              <VaChartRevenue />
+              <VAChartRevenue />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartRevenueLine</h3>
+              <h3 class="text-sm font-semibold">VAChartRevenueLine</h3>
             </template>
             <ClientOnly>
-              <VaChartRevenueLine />
+              <VAChartRevenueLine />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartRevenuevsCost</h3>
+              <h3 class="text-sm font-semibold">VAChartRevenuevsCost</h3>
             </template>
             <ClientOnly>
-              <VaChartRevenuevsCost />
+              <VAChartRevenuevsCost />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartFinanceSummary</h3>
+              <h3 class="text-sm font-semibold">VAChartFinanceSummary</h3>
             </template>
             <ClientOnly>
-              <VaChartFinanceSummary />
+              <VAChartFinanceSummary />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartExpensesBar</h3>
+              <h3 class="text-sm font-semibold">VAChartExpensesBar</h3>
             </template>
             <ClientOnly>
-              <VaChartExpensesBar />
+              <VAChartExpensesBar />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartIncomeBar</h3>
+              <h3 class="text-sm font-semibold">VAChartIncomeBar</h3>
             </template>
             <ClientOnly>
-              <VaChartIncomeBar />
+              <VAChartIncomeBar />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartSpendingTrend</h3>
+              <h3 class="text-sm font-semibold">VAChartSpendingTrend</h3>
             </template>
             <ClientOnly>
-              <VaChartSpendingTrend />
+              <VAChartSpendingTrend />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartColorBarChart</h3>
+              <h3 class="text-sm font-semibold">VAChartColorBarChart</h3>
             </template>
             <ClientOnly>
-              <VaChartColorBarChart />
+              <VAChartColorBarChart />
             </ClientOnly>
           </UCard>
         </div>
@@ -149,64 +149,64 @@
       <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartAppPerformanceBar</h3>
+              <h3 class="text-sm font-semibold">VAChartAppPerformanceBar</h3>
             </template>
             <ClientOnly>
-              <VaChartAppPerformanceBar />
+              <VAChartAppPerformanceBar />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartAppPerformanceBarChart</h3>
+              <h3 class="text-sm font-semibold">VAChartAppPerformanceBarChart</h3>
             </template>
             <ClientOnly>
-              <VaChartAppPerformanceBarChart />
+              <VAChartAppPerformanceBarChart />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartWebPerformanceLineChart</h3>
+              <h3 class="text-sm font-semibold">VAChartWebPerformanceLineChart</h3>
             </template>
             <ClientOnly>
-              <VaChartWebPerformanceLineChart />
+              <VAChartWebPerformanceLineChart />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartTrafficOverview</h3>
+              <h3 class="text-sm font-semibold">VAChartTrafficOverview</h3>
             </template>
             <ClientOnly>
-              <VaChartTrafficOverview />
+              <VAChartTrafficOverview />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartRealtimeTraffic</h3>
+              <h3 class="text-sm font-semibold">VAChartRealtimeTraffic</h3>
             </template>
             <ClientOnly>
-              <VaChartRealtimeTraffic />
+              <VAChartRealtimeTraffic />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartGoogleSearchConsole</h3>
+              <h3 class="text-sm font-semibold">VAChartGoogleSearchConsole</h3>
             </template>
             <ClientOnly>
-              <VaChartGoogleSearchConsole />
+              <VAChartGoogleSearchConsole />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartSearchIntent</h3>
+              <h3 class="text-sm font-semibold">VAChartSearchIntent</h3>
             </template>
             <ClientOnly>
-              <VaChartSearchIntent />
+              <VAChartSearchIntent />
             </ClientOnly>
           </UCard>
         </div>
@@ -217,46 +217,46 @@
       <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartCardinalMulti</h3>
+              <h3 class="text-sm font-semibold">VAChartCardinalMulti</h3>
             </template>
             <ClientOnly>
-              <VaChartCardinalMulti />
+              <VAChartCardinalMulti />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartStockComparisonLine</h3>
+              <h3 class="text-sm font-semibold">VAChartStockComparisonLine</h3>
             </template>
             <ClientOnly>
-              <VaChartStockComparisonLine />
+              <VAChartStockComparisonLine />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartStocksPortfolioLine</h3>
+              <h3 class="text-sm font-semibold">VAChartStocksPortfolioLine</h3>
             </template>
             <ClientOnly>
-              <VaChartStocksPortfolioLine />
+              <VAChartStocksPortfolioLine />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartStocksSectorLine</h3>
+              <h3 class="text-sm font-semibold">VAChartStocksSectorLine</h3>
             </template>
             <ClientOnly>
-              <VaChartStocksSectorLine />
+              <VAChartStocksSectorLine />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartStackedHorizontal</h3>
+              <h3 class="text-sm font-semibold">VAChartStackedHorizontal</h3>
             </template>
             <ClientOnly>
-              <VaChartStackedHorizontal />
+              <VAChartStackedHorizontal />
             </ClientOnly>
           </UCard>
         </div>
@@ -267,46 +267,46 @@
       <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartTasksProgress</h3>
+              <h3 class="text-sm font-semibold">VAChartTasksProgress</h3>
             </template>
             <ClientOnly>
-              <VaChartTasksProgress />
+              <VAChartTasksProgress />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartTasksCategories</h3>
+              <h3 class="text-sm font-semibold">VAChartTasksCategories</h3>
             </template>
             <ClientOnly>
-              <VaChartTasksCategories />
+              <VAChartTasksCategories />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartWinLostBar</h3>
+              <h3 class="text-sm font-semibold">VAChartWinLostBar</h3>
             </template>
             <ClientOnly>
-              <VaChartWinLostBar />
+              <VAChartWinLostBar />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartWinLostDonut</h3>
+              <h3 class="text-sm font-semibold">VAChartWinLostDonut</h3>
             </template>
             <ClientOnly>
-              <VaChartWinLostDonut />
+              <VAChartWinLostDonut />
             </ClientOnly>
           </UCard>
 
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartWinLostLine</h3>
+              <h3 class="text-sm font-semibold">VAChartWinLostLine</h3>
             </template>
             <ClientOnly>
-              <VaChartWinLostLine />
+              <VAChartWinLostLine />
             </ClientOnly>
           </UCard>
         </div>
@@ -317,10 +317,10 @@
       <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
           <UCard>
             <template #header>
-              <h3 class="text-sm font-semibold">VaChartLegend</h3>
+              <h3 class="text-sm font-semibold">VAChartLegend</h3>
             </template>
             <ClientOnly>
-              <VaChartLegend :items="legendItems" />
+              <VAChartLegend :items="legendItems" />
             </ClientOnly>
            </UCard>
          </div>

package/app/pages/playground/dashboard.vue

@@ -7,20 +7,20 @@
           Dashboard-specific components for navigation, KPIs, pricing, and usage visualization.
         </p>
 
-        <!-- VaDashboardNavigation -->
-        <h2 class="text-2xl font-semibold mb-4 mt-8">VaDashboardNavigation</h2>
+        <!-- VADashboardNavigation -->
+        <h2 class="text-2xl font-semibold mb-4 mt-8">VADashboardNavigation</h2>
         <p class="text-gray-600 dark:text-gray-400 mb-4">Navigation component for dashboard sidebars and top menus with icon support.</p>
         <UCard>
           <template #header>
             <h3 class="font-semibold">Standard Navigation</h3>
           </template>
           <ClientOnly>
-            <VaDashboardNavigation :sections="mockNavSections" />
+            <VADashboardNavigation :sections="mockNavSections" />
           </ClientOnly>
         </UCard>
 
-        <!-- VaDashboardKPICard -->
-        <h2 class="text-2xl font-semibold mb-4 mt-8">VaDashboardKPICard</h2>
+        <!-- VADashboardKPICard -->
+        <h2 class="text-2xl font-semibold mb-4 mt-8">VADashboardKPICard</h2>
         <p class="text-gray-600 dark:text-gray-400 mb-4">KPI cards displaying metrics with trend indicators, icons, and percentage changes.</p>
         <UCard>
           <template #header>
@@ -28,7 +28,7 @@
           </template>
           <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
             <ClientOnly>
-              <VaDashboardKPICard
+              <VADashboardKPICard
                 title="Total Revenue"
                 :value="125000"
                 :change="12.5"
@@ -38,7 +38,7 @@
             </ClientOnly>
 
             <ClientOnly>
-              <VaDashboardKPICard
+              <VADashboardKPICard
                 title="Active Users"
                 :value="8432"
                 :change="-3.2"
@@ -48,7 +48,7 @@
             </ClientOnly>
 
             <ClientOnly>
-              <VaDashboardKPICard
+              <VADashboardKPICard
                 title="Conversion Rate"
                 :value="3.45"
                 :change="0.8"
@@ -59,7 +59,7 @@
             </ClientOnly>
 
             <ClientOnly>
-              <VaDashboardKPICard
+              <VADashboardKPICard
                 title="Avg Order Value"
                 :value="89.50"
                 :change="5.2"
@@ -124,8 +124,8 @@
           </div>
         </UCard>
 
-        <!-- VaDashboardPricePlan -->
-        <h2 class="text-2xl font-semibold mb-4 mt-8">VaDashboardPricePlan</h2>
+        <!-- VADashboardPricePlan -->
+        <h2 class="text-2xl font-semibold mb-4 mt-8">VADashboardPricePlan</h2>
         <p class="text-gray-600 dark:text-gray-400 mb-4">Pricing plan cards with features list and call-to-action buttons.</p>
         <UCard>
           <template #header>
@@ -133,7 +133,7 @@
           </template>
           <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
             <ClientOnly>
-              <VaDashboardPricePlan
+              <VADashboardPricePlan
                 name="Starter"
                 :price="9.99"
                 period="month"
@@ -143,7 +143,7 @@
             </ClientOnly>
 
             <ClientOnly>
-              <VaDashboardPricePlan
+              <VADashboardPricePlan
                 name="Pro"
                 :price="29.99"
                 period="month"
@@ -154,7 +154,7 @@
             </ClientOnly>
 
             <ClientOnly>
-              <VaDashboardPricePlan
+              <VADashboardPricePlan
                 name="Enterprise"
                 :price="99.99"
                 period="month"
@@ -165,15 +165,15 @@
           </div>
         </UCard>
 
-        <!-- VaDashboardUsageChart -->
-        <h2 class="text-2xl font-semibold mb-4 mt-8">VaDashboardUsageChart</h2>
+        <!-- VADashboardUsageChart -->
+        <h2 class="text-2xl font-semibold mb-4 mt-8">VADashboardUsageChart</h2>
         <p class="text-gray-600 dark:text-gray-400 mb-4">Usage chart showing current consumption against limits.</p>
         <UCard>
           <template #header>
             <h3 class="font-semibold">API Usage Example</h3>
           </template>
           <ClientOnly>
-            <VaDashboardUsageChart
+            <VADashboardUsageChart
               title="API Usage"
               :data="mockUsageData"
               :limit="10000"
@@ -182,15 +182,15 @@
           </ClientOnly>
         </UCard>
 
-        <!-- VaDashboardUsageRequestChart -->
-        <h2 class="text-2xl font-semibold mb-4 mt-8">VaDashboardUsageRequestChart</h2>
+        <!-- VADashboardUsageRequestChart -->
+        <h2 class="text-2xl font-semibold mb-4 mt-8">VADashboardUsageRequestChart</h2>
         <p class="text-gray-600 dark:text-gray-400 mb-4">Request volume chart showing traffic patterns over time.</p>
         <UCard>
           <template #header>
             <h3 class="font-semibold">Request Volume Example</h3>
           </template>
           <ClientOnly>
-            <VaDashboardUsageRequestChart
+            <VADashboardUsageRequestChart
               title="Request Volume"
               :data="mockRequestData"
               :total="125000"
@@ -253,7 +253,7 @@
               <ClientOnly>
                 <VACard title="Revenue Trend" icon="i-lucide-trending-up">
                   <ClientOnly>
-                    <VaChartRevenueLine />
+                    <VAChartRevenueLine />
                   </ClientOnly>
                 </VACard>
               </ClientOnly>
@@ -261,7 +261,7 @@
               <ClientOnly>
                 <VACard title="Sales Distribution" icon="i-lucide-pie-chart">
                   <ClientOnly>
-                    <VaChartDonutHalf />
+                    <VAChartDonutHalf />
                   </ClientOnly>
                 </VACard>
               </ClientOnly>

package/app/pages/playground/layout.vue

@@ -5,7 +5,7 @@ definePageMeta({
 
 const { isNotificationsSlideoverOpen } = useDashboard()
 
-// Mock Data for VaLayoutSideNav
+// Mock Data for VALayoutSideNav
 const mockNavItems = [
   {
     label: 'Management',
@@ -26,20 +26,20 @@ const mockNavItems = [
   }
 ]
 
-// Mock Data for VaLayoutUserMenu (Note: Component currently uses internal data)
+// Mock Data for VALayoutUserMenu (Note: Component currently uses internal data)
 const mockUser = {
   name: 'Jane Doe',
   email: 'jane@example.com',
   avatar: 'https://i.pravatar.cc/150?img=5'
 }
 
-// Mock Data for VaLayoutTeamsMenu (Note: Component currently uses internal data)
+// Mock Data for VALayoutTeamsMenu (Note: Component currently uses internal data)
 const mockTeams = [
   { label: 'Engineering', avatar: { src: 'https://placehold.co/100', alt: 'Eng' } },
   { label: 'Marketing', avatar: { src: 'https://placehold.co/100', alt: 'Mkt' } }
 ]
 
-// Mock Data for VaLayoutNotificationsSlideover (Note: Component currently fetches from API)
+// Mock Data for VALayoutNotificationsSlideover (Note: Component currently fetches from API)
 const mockNotifications = [
   { id: 1, title: 'New message', time: '5 min ago', type: 'message' },
   { id: 2, title: 'Task completed', time: '1 hour ago', type: 'success' }
@@ -55,8 +55,8 @@ const mockNotifications = [
           Essential layout building blocks including navigation, menus, and side panels.
         </p>
 
-        <!-- VaLayoutSideNav -->
-        <h2 class="text-2xl font-semibold mb-4 mt-8">VaLayoutSideNav</h2>
+        <!-- VALayoutSideNav -->
+        <h2 class="text-2xl font-semibold mb-4 mt-8">VALayoutSideNav</h2>
         <p class="text-gray-600 dark:text-gray-400 mb-4">Side navigation component for dashboard layouts with collapsible menu items.</p>
         <UCard>
           <template #header>
@@ -66,20 +66,20 @@ const mockNotifications = [
             <div class="border border-gray-200 dark:border-gray-800 rounded-md bg-white dark:bg-gray-900 p-2 max-w-[250px]">
               <p class="text-xs text-gray-500 mb-2 px-2">Expanded</p>
               <ClientOnly>
-                <VaLayoutSideNav :items="mockNavItems" />
+                <VALayoutSideNav :items="mockNavItems" />
               </ClientOnly>
             </div>
             <div class="border border-gray-200 dark:border-gray-800 rounded-md bg-white dark:bg-gray-900 p-2 max-w-[80px]">
               <p class="text-xs text-gray-500 mb-2 text-center">Collapsed</p>
               <ClientOnly>
-                <VaLayoutSideNav :items="mockNavItems" collapsed />
+                <VALayoutSideNav :items="mockNavItems" collapsed />
               </ClientOnly>
             </div>
           </div>
         </UCard>
 
-        <!-- VaLayoutUserMenu -->
-        <h2 class="text-2xl font-semibold mb-4 mt-8">VaLayoutUserMenu</h2>
+        <!-- VALayoutUserMenu -->
+        <h2 class="text-2xl font-semibold mb-4 mt-8">VALayoutUserMenu</h2>
         <p class="text-gray-600 dark:text-gray-400 mb-4">User menu dropdown with avatar, profile info, and action items.</p>
         <UCard>
           <template #header>
@@ -90,7 +90,7 @@ const mockNotifications = [
               <p class="text-sm text-gray-500 mb-2">Standard</p>
               <ClientOnly>
                 <div class="w-64">
-                  <VaLayoutUserMenu />
+                  <VALayoutUserMenu />
                 </div>
               </ClientOnly>
             </div>
@@ -98,15 +98,15 @@ const mockNotifications = [
               <p class="text-sm text-gray-500 mb-2">Collapsed</p>
               <ClientOnly>
                 <div class="w-16">
-                  <VaLayoutUserMenu collapsed />
+                  <VALayoutUserMenu collapsed />
                 </div>
               </ClientOnly>
             </div>
           </div>
         </UCard>
 
-        <!-- VaLayoutTeamsMenu -->
-        <h2 class="text-2xl font-semibold mb-4 mt-8">VaLayoutTeamsMenu</h2>
+        <!-- VALayoutTeamsMenu -->
+        <h2 class="text-2xl font-semibold mb-4 mt-8">VALayoutTeamsMenu</h2>
         <p class="text-gray-600 dark:text-gray-400 mb-4">Team switching menu for multi-tenant applications.</p>
         <UCard>
           <template #header>
@@ -117,7 +117,7 @@ const mockNotifications = [
               <p class="text-sm text-gray-500 mb-2">Standard</p>
               <ClientOnly>
                 <div class="w-64">
-                  <VaLayoutTeamsMenu />
+                  <VALayoutTeamsMenu />
                 </div>
               </ClientOnly>
             </div>
@@ -125,15 +125,15 @@ const mockNotifications = [
               <p class="text-sm text-gray-500 mb-2">Collapsed</p>
               <ClientOnly>
                 <div class="w-16">
-                  <VaLayoutTeamsMenu collapsed />
+                  <VALayoutTeamsMenu collapsed />
                 </div>
               </ClientOnly>
             </div>
           </div>
         </UCard>
 
-        <!-- VaLayoutNotificationsSlideover -->
-        <h2 class="text-2xl font-semibold mb-4 mt-8">VaLayoutNotificationsSlideover</h2>
+        <!-- VALayoutNotificationsSlideover -->
+        <h2 class="text-2xl font-semibold mb-4 mt-8">VALayoutNotificationsSlideover</h2>
         <p class="text-gray-600 dark:text-gray-400 mb-4">Notifications slideover panel with list of recent activities.</p>
         <UCard>
           <template #header>
@@ -148,7 +148,7 @@ const mockNotifications = [
               @click="isNotificationsSlideoverOpen = true"
             />
             <ClientOnly>
-              <VaLayoutNotificationsSlideover />
+              <VALayoutNotificationsSlideover />
             </ClientOnly>
           </div>
         </UCard>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veristone/nuxt-v-app",
-  "version": "0.2.8",
+  "version": "0.2.9",
   "description": "Veristone Nuxt App Layer - Shared components, composables, and layouts",
   "type": "module",
   "private": false,