@tekkare/auriga 0.2.192 → 0.2.198

package/dist/runtime/components/argNoLicense.vue

@@ -0,0 +1,75 @@
+<template>
+  <div class="arg_no_license_landing">
+    <!-- Animated background blobs -->
+    <div class="arg_no_license_background">
+      <div class="arg_no_license_blob arg_no_license_blob_1"></div>
+      <div class="arg_no_license_blob arg_no_license_blob_2"></div>
+      <div class="arg_no_license_blob arg_no_license_blob_3"></div>
+      <div class="arg_no_license_blob arg_no_license_blob_4"></div>
+      <div class="arg_no_license_blob arg_no_license_blob_5"></div>
+      <div class="arg_no_license_blob arg_no_license_blob_6"></div>
+      <div class="arg_no_license_blob arg_no_license_blob_7"></div>
+    </div>
+
+    <div class="arg_no_license_content">
+      <div class="arg_no_license_card">
+        <!-- Icon -->
+        <div class="arg_no_license_icon_container">
+          <slot name="icon">
+            <svg
+              class="arg_no_license_icon"
+              fill="none"
+              stroke="currentColor"
+              viewBox="0 0 24 24"
+            >
+              <path
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"
+              />
+            </svg>
+          </slot>
+        </div>
+
+        <!-- Title -->
+        <h1 class="arg_no_license_title">{{ title }}</h1>
+
+        <!-- Description -->
+        <p class="arg_no_license_description">
+          <template v-if="description">{{ description }}</template>
+          <template v-else>
+            You need a <strong>{{ appName }}</strong> license to access this application.
+          </template>
+        </p>
+
+        <!-- Default slot for action content -->
+        <slot />
+
+        <!-- Footer slot -->
+        <div v-if="$slots.footer" class="arg_no_license_footer">
+          <slot name="footer" />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+withDefaults(
+  defineProps<{
+    appName?: string;
+    title?: string;
+    description?: string;
+  }>(),
+  {
+    appName: "Application",
+    title: "License Required",
+    description: "",
+  }
+);
+</script>
+
+<style scoped>
+.arg_no_license_landing{align-items:center;background:linear-gradient(135deg,#f8fafc,#e0e7ff 50%,#ddd6fe);display:flex;justify-content:center;min-height:100vh;overflow:hidden;position:relative}.arg_no_license_background{inset:0;overflow:hidden;position:absolute}.arg_no_license_blob{animation:arg_no_license_float 20s ease-in-out infinite;border-radius:50%;filter:blur(150px);opacity:.5;position:absolute}.arg_no_license_blob_1{background:linear-gradient(135deg,#1e3a8a,#3b82f6);height:900px;left:-200px;top:-300px;width:900px}.arg_no_license_blob_2{animation-delay:-7s;background:linear-gradient(135deg,#ec4899,#f472b6);bottom:-250px;height:800px;right:-200px;width:800px}.arg_no_license_blob_3{animation-delay:-14s;background:linear-gradient(135deg,#8b5cf6,#a78bfa);height:700px;left:50%;top:50%;transform:translate(-50%,-50%);width:700px}.arg_no_license_blob_4{animation-delay:-10s;background:linear-gradient(135deg,#06b6d4,#67e8f9);height:600px;left:5%;top:60%;width:600px}.arg_no_license_blob_5{animation-delay:-5s;background:linear-gradient(135deg,#3b82f6,#60a5fa);height:550px;right:10%;top:10%;width:550px}.arg_no_license_blob_6{animation-delay:-12s;background:linear-gradient(135deg,#a855f7,#c084fc);bottom:20%;height:500px;left:20%;width:500px}.arg_no_license_blob_7{animation-delay:-3s;background:linear-gradient(135deg,#ec4899,#f472b6);height:450px;left:35%;top:5%;width:450px}@keyframes arg_no_license_float{0%,to{transform:translate(0) scale(1)}25%{transform:translate(30px,-30px) scale(1.05)}50%{transform:translate(-20px,20px) scale(.95)}75%{transform:translate(-30px,-20px) scale(1.02)}}.arg_no_license_content{max-width:480px;padding:24px;position:relative;width:100%;z-index:10}.arg_no_license_card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:hsla(0,0%,100%,.95);border:1px solid hsla(0,0%,100%,.8);border-radius:24px;box-shadow:0 25px 50px -12px rgba(0,0,0,.15);padding:48px 40px;text-align:center}.arg_no_license_icon_container{align-items:center;background:linear-gradient(135deg,#f59e0b,#d97706);border-radius:20px;box-shadow:0 10px 40px -10px rgba(245,158,11,.5);display:flex;height:80px;justify-content:center;margin:0 auto 1.5rem;width:80px}.arg_no_license_icon{color:#fff;height:40px;width:40px}.arg_no_license_title{color:#1f2937;font-size:1.75rem;font-weight:700;margin:0 0 1rem}.arg_no_license_description{color:#6b7280;font-size:1rem;line-height:1.6;margin:0 0 1.5rem}.arg_no_license_description strong{color:#6366f1}.arg_no_license_footer{border-top:1px solid #e5e7eb;display:flex;gap:.75rem;justify-content:center;margin-top:1.5rem;padding-top:1.5rem}@media (max-width:480px){.arg_no_license_card{padding:32px 24px}.arg_no_license_title{font-size:1.5rem}}
+</style>

package/dist/runtime/components/argPharmanalyzeSvg.vue

@@ -0,0 +1,96 @@
+<template>
+  <svg 
+    :width="width" 
+    :height="height" 
+    viewBox="0 0 644 576" 
+    fill="none" 
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path 
+      fill-rule="evenodd" 
+      clip-rule="evenodd" 
+      d="M311.741 180.303C312.373 180.722 313.013 181.146 313.645 181.565C313.012 181.145 312.373 180.722 311.741 180.303Z" 
+      fill="url(#paint0_linear_19_44014)"
+    />
+    <path 
+      fill-rule="evenodd" 
+      clip-rule="evenodd" 
+      d="M313.645 181.565L311.741 180.303C300.676 172.972 289.613 165.639 278.581 158.254C277.608 157.601 276.8 157.251 276 157.216V156.02C300.253 156.021 324.505 156.025 348.758 156.028C381.237 156.033 413.715 156.037 446.194 156.037C446.256 156.037 446.322 156.033 446.388 156.028C446.42 156.025 446.452 156.022 446.485 156.019C446.687 156 446.894 155.981 447.063 156.037C447.618 156.211 448.195 156.356 448.773 156.501C450.152 156.847 451.537 157.194 452.643 157.946C458.671 162.07 464.559 166.392 470.447 170.741C509.673 199.671 547.104 230.593 579.32 267.379C610.947 303.549 635.986 342.973 642.042 392.078C643.635 405.905 643.609 413.609 642.07 427.265C641.362 430.588 640.716 433.846 640.081 437.051C638.752 443.754 637.468 450.229 635.761 456.588C608.087 559.709 504.626 588.891 439.241 571.129C407.95 562.599 381.986 545.594 359.808 522.333C354.06 516.272 353.948 513.774 359.948 507.769C378.257 489.446 396.622 471.123 414.987 452.828C420.174 447.665 423.091 447.721 428.278 452.968C428.949 453.641 429.615 454.321 430.28 455.001C430.946 455.681 431.614 456.364 432.287 457.037C440.671 465.427 450.176 472.105 461.727 475.529C502.719 487.65 543.88 456.869 545.253 413.263C545.87 393.537 539.478 375.859 528.15 360.37C517.131 345.302 505.215 330.711 492.345 317.186C459.064 282.251 420.287 253.798 380.697 226.552C358.528 211.301 336.093 196.437 313.655 181.571L313.645 181.565Z" 
+      fill="url(#paint1_linear_19_44014)"
+    />
+    <path 
+      fill-rule="evenodd" 
+      clip-rule="evenodd" 
+      d="M331.489 395.697C330.857 395.278 330.217 394.854 329.585 394.435C330.218 394.855 330.857 395.278 331.489 395.697Z" 
+      fill="url(#paint2_linear_19_44014)"
+    />
+    <path 
+      fill-rule="evenodd" 
+      clip-rule="evenodd" 
+      d="M329.585 394.435L331.489 395.697C342.555 403.028 353.617 410.361 364.649 417.746C365.622 418.399 366.43 418.749 367.23 418.784V419.98C342.978 419.979 318.725 419.975 294.472 419.972C261.994 419.967 229.515 419.963 197.036 419.963C196.974 419.963 196.909 419.967 196.842 419.972C196.81 419.975 196.778 419.978 196.746 419.981C196.543 420 196.336 420.019 196.167 419.963C195.613 419.789 195.035 419.644 194.458 419.499C193.079 419.153 191.694 418.806 190.587 418.054C184.559 413.93 178.671 409.608 172.783 405.259C133.558 376.329 96.1264 345.407 63.9103 308.621C32.2831 272.451 7.24488 233.027 1.18861 183.922C-0.404747 170.095 -0.378319 162.392 1.16059 148.735C1.86805 145.412 2.51411 142.154 3.1496 138.949C4.47849 132.246 5.76218 125.771 7.46925 119.412C35.1431 16.2915 138.604 -12.8909 203.99 4.87105C235.281 13.4013 261.244 30.4056 283.422 53.6674C289.17 59.7283 289.282 62.2257 283.282 68.2305C264.973 86.5537 246.608 104.877 228.243 123.172C223.056 128.335 220.14 128.279 214.953 123.032C214.281 122.359 213.615 121.679 212.95 120.999C212.284 120.319 211.616 119.636 210.943 118.963C202.56 110.573 193.055 103.895 181.503 100.471C140.511 88.3495 99.3508 119.131 97.9769 162.737C97.3601 182.463 103.753 200.141 115.08 215.63C126.099 230.698 138.016 245.289 150.885 258.814C184.167 293.749 222.944 322.202 262.534 349.448C284.702 364.699 307.137 379.563 329.576 394.429L329.585 394.435Z" 
+      fill="url(#paint3_linear_19_44014)"
+    />
+    <defs>
+      <linearGradient 
+        id="paint0_linear_19_44014" 
+        x1="321.615" 
+        y1="0" 
+        x2="321.615" 
+        y2="576" 
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop stop-color="#FF7942" />
+        <stop offset="1" stop-color="#F7520E" />
+      </linearGradient>
+      <linearGradient 
+        id="paint1_linear_19_44014" 
+        x1="321.615" 
+        y1="0" 
+        x2="321.615" 
+        y2="576" 
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop stop-color="#FF7942" />
+        <stop offset="1" stop-color="#F7520E" />
+      </linearGradient>
+      <linearGradient 
+        id="paint2_linear_19_44014" 
+        x1="321.615" 
+        y1="0" 
+        x2="321.615" 
+        y2="576" 
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop stop-color="#FF7942" />
+        <stop offset="1" stop-color="#F7520E" />
+      </linearGradient>
+      <linearGradient 
+        id="paint3_linear_19_44014" 
+        x1="321.615" 
+        y1="0" 
+        x2="321.615" 
+        y2="576" 
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop stop-color="#FF7942" />
+        <stop offset="1" stop-color="#F7520E" />
+      </linearGradient>
+    </defs>
+  </svg>
+</template>
+<script>
+import { defineComponent } from "vue";
+export default defineComponent({
+  name: "argPharmanalyzeSvg",
+  props: {
+    width: {
+      type: String,
+      default: "59"
+    },
+    height: {
+      type: String,
+      default: "30"
+    }
+  }
+});
+</script>

package/dist/runtime/components/argPharmanalyzeSvg.vue.d.ts

@@ -0,0 +1,23 @@
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    width: {
+        type: StringConstructor;
+        default: string;
+    };
+    height: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    width: {
+        type: StringConstructor;
+        default: string;
+    };
+    height: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    width: string;
+    height: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/runtime/components/argProfilePage.vue

@@ -0,0 +1,360 @@
+<template>
+  <div class="arg_profile_page">
+    <div class="arg_profile_container">
+      <!-- Loading -->
+      <div v-if="loading" class="arg_profile_loading">
+        <div class="arg_profile_spinner"></div>
+        <p>Loading your profile...</p>
+      </div>
+
+      <!-- Error -->
+      <div v-else-if="error" class="arg_profile_error">
+        <div class="arg_profile_error_icon">!</div>
+        <p>{{ error }}</p>
+        <button class="arg_profile_btn arg_profile_btn_primary" @click="$emit('onRetry')">Retry</button>
+      </div>
+
+      <!-- Content -->
+      <div v-else class="arg_profile_content">
+        <!-- Profile Header -->
+        <div class="arg_profile_header">
+          <div class="arg_profile_avatar">
+            <img
+              v-if="userImage"
+              :src="userImage"
+              :alt="userName || 'Profile'"
+            />
+            <div v-else class="arg_profile_avatar_placeholder">
+              {{ (userName || userEmail || "U").charAt(0).toUpperCase() }}
+            </div>
+          </div>
+          <div class="arg_profile_info">
+            <h1>{{ userName || "User Profile" }}</h1>
+            <p class="arg_profile_email">{{ userEmail }}</p>
+            <div class="arg_profile_badge">
+              <svg width="16" height="16" viewBox="0 0 24 24" fill="none">
+                <path d="M9 12L11 14L15 10" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                <circle cx="12" cy="12" r="9" stroke="currentColor" stroke-width="2"/>
+              </svg>
+              Verified Account
+            </div>
+          </div>
+          <div class="arg_profile_actions">
+            <slot name="header-actions">
+              <button @click="navigateHome" class="arg_profile_btn arg_profile_btn_secondary">
+                <svg width="16" height="16" viewBox="0 0 24 24" fill="none">
+                  <path d="M3 9L12 2L21 9V20C21 20.5304 20.7893 21.0391 20.4142 21.4142C20.0391 21.7893 19.5304 22 19 22H5C4.46957 22 3.96086 21.7893 3.58579 21.4142C3.21071 21.0391 3 20.5304 3 20V9Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                </svg>
+                Home
+              </button>
+              <button @click="$emit('onSignOut')" class="arg_profile_btn arg_profile_btn_outline">
+                <svg width="16" height="16" viewBox="0 0 24 24" fill="none">
+                  <path d="M9 21H5C4.46957 21 3.96086 20.7893 3.58579 20.4142C3.21071 20.0391 3 19.5304 3 19V5C3 4.46957 3.21071 3.96086 3.58579 3.58579C3.96086 3.21071 4.46957 3 5 3H9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                  <polyline points="16,17 21,12 16,7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                  <line x1="21" y1="12" x2="9" y2="12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                </svg>
+                Sign Out
+              </button>
+            </slot>
+          </div>
+        </div>
+
+        <!-- Navigation Tabs -->
+        <div class="arg_profile_tabs">
+          <button
+            @click="activeSection = 'account'"
+            class="arg_profile_tab"
+            :class="{ active: activeSection === 'account' }"
+          >
+            <svg width="18" height="18" viewBox="0 0 24 24" fill="none">
+              <path d="M20 21V19C20 17.9391 19.5786 16.9217 18.8284 16.1716C18.0783 15.4214 17.0609 15 16 15H8C6.93913 15 5.92172 15.4214 5.17157 16.1716C4.42143 16.9217 4 17.9391 4 19V21" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+              <circle cx="12" cy="7" r="4" stroke="currentColor" stroke-width="2"/>
+            </svg>
+            Account
+          </button>
+          <button
+            @click="activeSection = 'workspace'"
+            class="arg_profile_tab"
+            :class="{ active: activeSection === 'workspace' }"
+          >
+            <svg width="18" height="18" viewBox="0 0 24 24" fill="none">
+              <path d="M3 9L12 2L21 9V20C21 20.5304 20.7893 21.0391 20.4142 21.4142C20.0391 21.7893 19.5304 22 19 22H5C4.46957 22 3.96086 21.7893 3.58579 21.4142C3.21071 21.0391 3 20.5304 3 20V9Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+            </svg>
+            Workspace
+          </button>
+          <button
+            @click="activeSection = 'licenses'"
+            class="arg_profile_tab"
+            :class="{ active: activeSection === 'licenses' }"
+          >
+            <svg width="18" height="18" viewBox="0 0 24 24" fill="none">
+              <path d="M9 12L11 14L15 10" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+              <rect x="3" y="4" width="18" height="16" rx="2" stroke="currentColor" stroke-width="2"/>
+            </svg>
+            Licenses
+          </button>
+        </div>
+
+        <!-- Account Section -->
+        <div v-show="activeSection === 'account'" class="arg_profile_section_content">
+          <div class="arg_profile_cards_grid">
+            <div class="arg_profile_card">
+              <div class="arg_profile_card_header">
+                <div class="arg_profile_card_icon">
+                  <svg width="20" height="20" viewBox="0 0 24 24" fill="none">
+                    <path d="M20 21V19C20 17.9391 19.5786 16.9217 18.8284 16.1716C18.0783 15.4214 17.0609 15 16 15H8C6.93913 15 5.92172 15.4214 5.17157 16.1716C4.42143 16.9217 4 17.9391 4 19V21" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                    <circle cx="12" cy="7" r="4" stroke="currentColor" stroke-width="2"/>
+                  </svg>
+                </div>
+                <h2>Account Information</h2>
+              </div>
+              <div class="arg_profile_card_content">
+                <div class="arg_profile_info_row">
+                  <span class="arg_profile_info_label">Email Address</span>
+                  <span class="arg_profile_info_value">{{ userEmail || "Not provided" }}</span>
+                </div>
+                <div class="arg_profile_info_row">
+                  <span class="arg_profile_info_label">Display Name</span>
+                  <span class="arg_profile_info_value">{{ userName || "Not provided" }}</span>
+                </div>
+                <div class="arg_profile_info_row">
+                  <span class="arg_profile_info_label">Account Status</span>
+                  <span class="arg_profile_info_value arg_profile_status_active">
+                    <span class="arg_profile_status_dot"></span>
+                    Active
+                  </span>
+                </div>
+                <div class="arg_profile_info_row">
+                  <span class="arg_profile_info_label">Platform Admin</span>
+                  <span class="arg_profile_info_value">{{ isPlatformAdmin ? 'Yes' : 'No' }}</span>
+                </div>
+              </div>
+            </div>
+          </div>
+          <slot name="account-extra" />
+        </div>
+
+        <!-- Workspace Section -->
+        <div v-show="activeSection === 'workspace'" class="arg_profile_section_content">
+          <div class="arg_profile_card">
+            <div class="arg_profile_card_header">
+              <div class="arg_profile_card_icon arg_profile_workspace_icon">
+                <svg width="20" height="20" viewBox="0 0 24 24" fill="none">
+                  <path d="M3 9L12 2L21 9V20C21 20.5304 20.7893 21.0391 20.4142 21.4142C20.0391 21.7893 19.5304 22 19 22H5C4.46957 22 3.96086 21.7893 3.58579 21.4142C3.21071 21.0391 3 20.5304 3 20V9Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                </svg>
+              </div>
+              <h2>Current Workspace</h2>
+            </div>
+            <div class="arg_profile_card_content">
+              <div v-if="currentWorkspace" class="arg_profile_current_workspace">
+                <div class="arg_profile_cw_row">
+                  <div class="arg_profile_cw_avatar" :class="currentWorkspace.isPersonal ? 'personal' : 'team'">
+                    {{ currentWorkspace.name.charAt(0).toUpperCase() }}
+                  </div>
+                  <div class="arg_profile_cw_details">
+                    <div class="arg_profile_cw_name">{{ currentWorkspace.name }}</div>
+                    <div class="arg_profile_cw_meta">
+                      <span class="arg_profile_cw_tag">{{ currentWorkspace.role }}</span>
+                      <span v-if="currentWorkspace.isPersonal" class="arg_profile_cw_tag arg_profile_personal_tag">Personal</span>
+                    </div>
+                  </div>
+                  <span class="arg_profile_cw_active">Active</span>
+                </div>
+              </div>
+              <div v-else class="arg_profile_no_workspace">
+                <p>No workspace selected</p>
+              </div>
+            </div>
+          </div>
+
+          <!-- Switch Workspace -->
+          <div v-if="workspaces.length > 1" class="arg_profile_card">
+            <div class="arg_profile_card_header">
+              <div class="arg_profile_card_icon arg_profile_switch_icon">
+                <svg width="20" height="20" viewBox="0 0 24 24" fill="none">
+                  <path d="M8 3L4 7L8 11" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                  <path d="M4 7H16C17.0609 7 18.0783 7.42143 18.8284 8.17157C19.5786 8.92172 20 9.93913 20 11V13" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                  <path d="M16 21L20 17L16 13" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                  <path d="M20 17H8C6.93913 17 5.92172 16.5786 5.17157 15.8284C4.42143 15.0783 4 14.0609 4 13V11" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                </svg>
+              </div>
+              <h2>Switch Workspace</h2>
+            </div>
+            <div class="arg_profile_card_content">
+              <div class="arg_profile_workspace_list">
+                <button
+                  v-for="ws in workspaces"
+                  :key="ws.workspaceId"
+                  class="arg_profile_workspace_option"
+                  :class="{ selected: ws.workspaceId === currentWorkspaceId }"
+                  @click="handleSwitchWorkspace(ws)"
+                  :disabled="ws.workspaceId === currentWorkspaceId"
+                >
+                  <div class="arg_profile_ws_avatar" :class="ws.isPersonal ? 'personal' : 'team'">
+                    {{ ws.name.charAt(0).toUpperCase() }}
+                  </div>
+                  <div class="arg_profile_ws_info">
+                    <span class="arg_profile_ws_name">{{ ws.name }}</span>
+                    <span class="arg_profile_ws_meta">{{ ws.role }}</span>
+                  </div>
+                  <span v-if="ws.workspaceId === currentWorkspaceId" class="arg_profile_ws_check">
+                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none">
+                      <path d="M20 6L9 17L4 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                    </svg>
+                  </span>
+                </button>
+              </div>
+            </div>
+          </div>
+          <slot name="workspace-extra" />
+        </div>
+
+        <!-- Licenses Section -->
+        <div v-show="activeSection === 'licenses'" class="arg_profile_section_content">
+          <div class="arg_profile_card">
+            <div class="arg_profile_card_header">
+              <div class="arg_profile_card_icon arg_profile_licenses_icon">
+                <svg width="20" height="20" viewBox="0 0 24 24" fill="none">
+                  <path d="M9 12L11 14L15 10" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                  <rect x="3" y="4" width="18" height="16" rx="2" stroke="currentColor" stroke-width="2"/>
+                </svg>
+              </div>
+              <h2>My Product Licenses</h2>
+            </div>
+            <div class="arg_profile_card_content">
+              <div v-if="licenses.length > 0" class="arg_profile_licenses_list">
+                <div v-for="license in licenses" :key="license.licenseId" class="arg_profile_license_item">
+                  <div class="arg_profile_license_product">
+                    <div class="arg_profile_product_icon arg_profile_product_default">
+                      {{ (license.product?.name || license.product?.slug || 'L').charAt(0).toUpperCase() }}
+                    </div>
+                    <div class="arg_profile_product_info">
+                      <span class="arg_profile_product_name">{{ productDisplayNames[license.product?.slug] || license.product?.name || license.product?.slug }}</span>
+                      <span class="arg_profile_license_status" :class="license.status">{{ license.status }}</span>
+                    </div>
+                  </div>
+                  <div class="arg_profile_license_dates">
+                    <span class="arg_profile_date_label">Assigned:</span>
+                    <span class="arg_profile_date_value">{{ formatDate(license.assignedAt) }}</span>
+                  </div>
+                  <div v-if="license.expiresAt" class="arg_profile_license_expiry">
+                    <span class="arg_profile_expiry_badge" :class="{ expired: new Date(license.expiresAt) < new Date() }">
+                      {{ new Date(license.expiresAt) < new Date() ? 'Expired' : `Expires ${formatDate(license.expiresAt)}` }}
+                    </span>
+                  </div>
+                  <div v-else class="arg_profile_license_expiry">
+                    <span class="arg_profile_expiry_badge arg_profile_no_expiry">No expiration</span>
+                  </div>
+                </div>
+              </div>
+              <div v-else class="arg_profile_no_licenses">
+                <svg width="48" height="48" viewBox="0 0 24 24" fill="none">
+                  <rect x="3" y="4" width="18" height="16" rx="2" stroke="currentColor" stroke-width="2" opacity="0.5"/>
+                  <path d="M9 10H15M9 14H12" stroke="currentColor" stroke-width="2" stroke-linecap="round" opacity="0.5"/>
+                </svg>
+                <p>No licenses assigned</p>
+                <span class="arg_profile_hint">Contact your workspace administrator to request access to products.</span>
+              </div>
+            </div>
+          </div>
+          <slot name="licenses-extra" />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, computed, watch } from "vue";
+
+interface Workspace {
+  workspaceId: string;
+  name: string;
+  role: string;
+  isPersonal: boolean;
+  isCurrent?: boolean;
+}
+
+interface License {
+  licenseId: string;
+  product: { slug: string; name: string };
+  status: string;
+  assignedAt: string;
+  expiresAt?: string;
+}
+
+const props = withDefaults(
+  defineProps<{
+    userName?: string;
+    userEmail?: string;
+    userImage?: string;
+    isPlatformAdmin?: boolean;
+    loading?: boolean;
+    error?: string;
+    workspaces?: Workspace[];
+    currentWorkspaceId?: string;
+    licenses?: License[];
+    productDisplayNames?: Record<string, string>;
+    initialTab?: "account" | "workspace" | "licenses";
+  }>(),
+  {
+    userName: "",
+    userEmail: "",
+    userImage: "",
+    isPlatformAdmin: false,
+    loading: false,
+    error: "",
+    workspaces: () => [],
+    currentWorkspaceId: "",
+    licenses: () => [],
+    productDisplayNames: () => ({}),
+    initialTab: "account",
+  }
+);
+
+const emit = defineEmits<{
+  onSignOut: [];
+  onSwitchWorkspace: [workspace: Workspace];
+  onRetry: [];
+}>();
+
+const activeSection = ref<"account" | "workspace" | "licenses">(props.initialTab);
+
+watch(
+  () => props.initialTab,
+  (tab) => {
+    activeSection.value = tab;
+  }
+);
+
+const currentWorkspace = computed(() => {
+  if (!props.currentWorkspaceId || !props.workspaces.length) return null;
+  return (
+    props.workspaces.find((w) => w.workspaceId === props.currentWorkspaceId) ||
+    props.workspaces[0]
+  );
+});
+
+const formatDate = (dateString: string): string => {
+  return new Date(dateString).toLocaleDateString("en-US", {
+    year: "numeric",
+    month: "short",
+    day: "numeric",
+  });
+};
+
+const handleSwitchWorkspace = (workspace: Workspace) => {
+  if (workspace.workspaceId === props.currentWorkspaceId) return;
+  emit("onSwitchWorkspace", workspace);
+};
+
+const navigateHome = () => {
+  if (typeof window !== "undefined") {
+    window.location.href = "/";
+  }
+};
+</script>
+
+<style scoped>
+.arg_profile_page{background:var(--Main-Lightest,#f8fafc);min-height:100vh;padding:40px 20px 80px}.arg_profile_container{margin:0 auto;max-width:900px}.arg_profile_error,.arg_profile_loading{align-items:center;color:var(--medium,#5a6c7d);display:flex;flex-direction:column;gap:16px;justify-content:center;padding:80px 20px}.arg_profile_spinner{animation:arg_profile_spin 1s linear infinite;border:3px solid var(--Main-Lightest,#f0f0f0);border-radius:50%;border-top-color:var(--primary,#6366f1);height:40px;width:40px}@keyframes arg_profile_spin{to{transform:rotate(1turn)}}.arg_profile_error{color:#dc2626}.arg_profile_error_icon{align-items:center;background:#fee2e2;border-radius:50%;color:#dc2626;display:flex;font-size:24px;font-weight:700;height:48px;justify-content:center;width:48px}.arg_profile_header{align-items:center;background:#fff;border:1px solid var(--dividers,#e4e7ec);border-radius:16px;display:grid;gap:24px;grid-template-columns:auto 1fr auto;margin-bottom:24px;padding:24px}.arg_profile_avatar{align-items:center;background:linear-gradient(135deg,var(--primary,#6366f1),#8b5cf6);border-radius:16px;display:flex;height:80px;justify-content:center;overflow:hidden;width:80px}.arg_profile_avatar img{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.arg_profile_avatar_placeholder{color:#fff;font-size:32px;font-weight:700}.arg_profile_info h1{color:var(--Main-Darkest,#21243d);font-size:1.75rem;font-weight:700;margin:0 0 8px}.arg_profile_email{color:var(--medium,#5a6c7d);font-size:1rem;margin:0 0 12px}.arg_profile_badge{align-items:center;background:#e0e7ff;border-radius:20px;color:#4338ca;display:inline-flex;font-size:.85rem;font-weight:500;gap:6px;padding:6px 12px}.arg_profile_actions{display:flex;gap:12px}.arg_profile_btn{align-items:center;border:none;border-radius:8px;cursor:pointer;display:inline-flex;font-size:.9rem;font-weight:500;gap:8px;padding:10px 16px;text-decoration:none;transition:all .2s ease}.arg_profile_btn_primary{background:var(--primary,#6366f1);color:#fff}.arg_profile_btn_primary:hover{background:var(--primary-hover,#4f46e5)}.arg_profile_btn_secondary{background:var(--Main-Lightest,#f3f4f6);color:var(--Main-Darkest,#374151)}.arg_profile_btn_secondary:hover{background:#e5e7eb}.arg_profile_btn_outline{background:#fff;border:1px solid var(--dividers,#e4e7ec);color:var(--Main-Darkest,#374151)}.arg_profile_btn_outline:hover{background:var(--Main-Lightest,#f3f4f6)}.arg_profile_tabs{border-bottom:2px solid var(--dividers,#e4e7ec);display:flex;gap:8px;margin-bottom:24px;overflow-x:auto}.arg_profile_tab{align-items:center;background:transparent;border:none;border-bottom:2px solid transparent;color:var(--medium,#5a6c7d);cursor:pointer;display:flex;font-size:.95rem;font-weight:500;gap:8px;margin-bottom:-2px;padding:12px 20px;transition:all .2s ease;white-space:nowrap}.arg_profile_tab:hover{background:rgba(99,102,241,.05);color:var(--Main-Darkest,#21243d)}.arg_profile_tab.active{border-bottom-color:var(--primary,#6366f1);color:var(--primary,#6366f1)}.arg_profile_cards_grid{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(350px,1fr))}.arg_profile_card{background:#fff;border:1px solid var(--dividers,#e4e7ec);border-radius:16px;margin-bottom:24px;overflow:hidden;transition:all .2s ease}.arg_profile_card:hover{box-shadow:0 4px 16px rgba(99,102,241,.1)}.arg_profile_card_header{align-items:center;background:var(--Main-Lightest,#fafbfc);border-bottom:1px solid var(--dividers,#e4e7ec);display:flex;gap:12px;padding:20px 24px}.arg_profile_card_icon{align-items:center;background:linear-gradient(135deg,var(--primary,#6366f1),#8b5cf6);border-radius:8px;color:#fff;display:flex;height:40px;justify-content:center;width:40px}.arg_profile_card_icon.arg_profile_workspace_icon{background:linear-gradient(135deg,#10b981,#059669)}.arg_profile_card_icon.arg_profile_switch_icon{background:linear-gradient(135deg,#3b82f6,#2563eb)}.arg_profile_card_icon.arg_profile_licenses_icon{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.arg_profile_card_header h2{color:var(--Main-Darkest,#21243d);font-size:1.15rem;font-weight:600;margin:0}.arg_profile_card_content{padding:24px}.arg_profile_info_row{align-items:center;border-bottom:1px solid #f1f3f4;display:flex;justify-content:space-between;padding:14px 0}.arg_profile_info_row:last-child{border-bottom:none}.arg_profile_info_label{color:var(--medium,#5a6c7d);font-weight:500}.arg_profile_info_value{color:var(--Main-Darkest,#21243d);font-weight:500}.arg_profile_status_active{align-items:center;color:#059669!important;display:flex;gap:6px}.arg_profile_status_dot{animation:arg_profile_pulse 2s infinite;background:#10b981;border-radius:50%;height:8px;width:8px}@keyframes arg_profile_pulse{0%,to{opacity:1}50%{opacity:.5}}.arg_profile_current_workspace{background:var(--Main-Lightest,#f8fafc);border-radius:10px;padding:16px}.arg_profile_cw_row{align-items:center;display:flex;gap:14px}.arg_profile_cw_avatar{align-items:center;border-radius:10px;color:#fff;display:flex;font-size:18px;font-weight:600;height:48px;justify-content:center;width:48px}.arg_profile_cw_avatar.personal{background:linear-gradient(135deg,#10b981,#059669)}.arg_profile_cw_avatar.team{background:linear-gradient(135deg,var(--primary,#6366f1),#4f46e5)}.arg_profile_cw_details{flex:1}.arg_profile_cw_name{color:var(--Main-Darkest,#21243d);font-size:16px;font-weight:600;margin-bottom:6px}.arg_profile_cw_meta{display:flex;gap:8px}.arg_profile_cw_tag{background:#e5e7eb;border-radius:4px;color:#374151;font-size:11px;font-weight:500;padding:3px 10px;text-transform:uppercase}.arg_profile_cw_tag.arg_profile_personal_tag{background:#d1fae5;color:#065f46}.arg_profile_cw_active{background:#dcfce7;border-radius:16px;color:#15803d;font-size:12px;font-weight:500;padding:6px 12px}.arg_profile_no_workspace{color:var(--medium,#5a6c7d);padding:24px;text-align:center}.arg_profile_workspace_list{display:flex;flex-direction:column;gap:10px}.arg_profile_workspace_option{align-items:center;background:#fff;border:1px solid #e5e7eb;border-radius:10px;cursor:pointer;display:flex;gap:12px;padding:14px;text-align:left;transition:all .15s ease;width:100%}.arg_profile_workspace_option:hover:not(:disabled){background:#fafafa;border-color:var(--primary,#6366f1)}.arg_profile_workspace_option.selected{background:#f5f3ff;border-color:var(--primary,#6366f1)}.arg_profile_workspace_option:disabled{cursor:default}.arg_profile_ws_avatar{align-items:center;border-radius:8px;color:#fff;display:flex;font-size:14px;font-weight:600;height:36px;justify-content:center;width:36px}.arg_profile_ws_avatar.personal{background:linear-gradient(135deg,#10b981,#059669)}.arg_profile_ws_avatar.team{background:linear-gradient(135deg,var(--primary,#6366f1),#4f46e5)}.arg_profile_ws_info{display:flex;flex:1;flex-direction:column;gap:3px}.arg_profile_ws_name{color:var(--Main-Darkest,#21243d);font-size:14px;font-weight:500}.arg_profile_ws_meta{color:var(--medium,#5a6c7d);font-size:12px;text-transform:capitalize}.arg_profile_ws_check{color:var(--primary,#6366f1);font-size:16px;font-weight:600}.arg_profile_licenses_list{display:flex;flex-direction:column;gap:14px}.arg_profile_license_item{background:var(--Main-Lightest,#f8f9fa);border:1px solid var(--dividers,#e4e7ec);border-radius:12px;display:flex;flex-direction:column;gap:10px;padding:16px}.arg_profile_license_product{align-items:center;display:flex;gap:12px}.arg_profile_product_icon{align-items:center;border-radius:8px;color:#fff;display:flex;font-size:16px;font-weight:700;height:40px;justify-content:center;width:40px}.arg_profile_product_icon.arg_profile_product_default{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.arg_profile_product_info{display:flex;flex-direction:column;gap:4px}.arg_profile_product_name{color:var(--Main-Darkest,#21243d);font-weight:600}.arg_profile_license_status{font-size:12px;font-weight:500;letter-spacing:.5px;text-transform:uppercase}.arg_profile_license_status.active{color:#059669}.arg_profile_license_status.cancelled{color:#dc2626}.arg_profile_license_status.expired{color:#9ca3af}.arg_profile_license_dates{display:flex;font-size:13px;gap:6px}.arg_profile_date_label{color:var(--medium,#5a6c7d)}.arg_profile_date_value{color:var(--Main-Darkest,#21243d);font-weight:500}.arg_profile_license_expiry{margin-top:4px}.arg_profile_expiry_badge{background:#dcfce7;border-radius:12px;color:#166534;font-size:12px;padding:4px 10px}.arg_profile_expiry_badge.expired{background:#fee2e2;color:#991b1b}.arg_profile_expiry_badge.arg_profile_no_expiry{background:#e0e7ff;color:#4338ca}.arg_profile_no_licenses{color:var(--medium,#5a6c7d);padding:40px 20px;text-align:center}.arg_profile_no_licenses svg{margin-bottom:16px}.arg_profile_no_licenses p{color:var(--Main-Darkest,#21243d);font-weight:600;margin:0 0 8px}.arg_profile_hint{font-size:14px;line-height:1.5}@media (max-width:768px){.arg_profile_header{gap:16px;grid-template-columns:1fr;text-align:center}.arg_profile_avatar{margin:0 auto}.arg_profile_actions{flex-wrap:wrap;justify-content:center}.arg_profile_cards_grid{grid-template-columns:1fr}.arg_profile_tabs{justify-content:center}}
+</style>