{
  "$schema": "https://shadcn-vue.com/schema/registry-item.json",
  "name": "data-mesh-domain-catalog",
  "title": "Data Mesh Domain Catalog",
  "type": "registry:block",
  "files": [
    {
      "path": "packages/registry-vue/blocks/data-mesh-domain-catalog/DataMeshDomainCatalog.vue",
      "content": "<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport type { HTMLAttributes } from 'vue'\nimport {\n  Activity,\n  Copy,\n  CreditCard,\n  Database,\n  Eye,\n  FileCode2,\n  HardDrive,\n  KeyRound,\n  Layers,\n  MoreHorizontal,\n  Network,\n  Plus,\n  Search,\n  ShieldCheck,\n  Table2,\n  Terminal,\n  Truck,\n  Users,\n  Zap,\n} from 'lucide-vue-next'\nimport { cn } from '@/lib/utils'\nimport { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'\nimport { Badge } from '@/components/ui/badge'\nimport { Button } from '@/components/ui/button'\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from '@/components/ui/dropdown-menu'\nimport { Progress } from '@/components/ui/progress'\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table'\nimport DataMeshProductDetail from './DataMeshProductDetail.vue'\nimport DataMeshQueryRunner from './DataMeshQueryRunner.vue'\nimport DataMeshModals from './DataMeshModals.vue'\nimport { DOMAINS, DATA_PRODUCTS } from './data-mesh-data'\nimport type {\n  DomainMeta,\n  OutputPortSchemaColumn,\n  OutputPortDetails,\n  DataProductItem,\n  DataMeshPortId,\n} from './data-mesh-types'\n\nexport type { DomainMeta, OutputPortSchemaColumn, OutputPortDetails, DataProductItem, DataMeshPortId }\n\nconst props = withDefaults(\n  defineProps<{\n    class?: HTMLAttributes['class']\n    initialSelectedProductId?: string\n    initialDomainFilter?: string\n  }>(),\n  {\n    initialSelectedProductId: 'dp_customer_360_profile',\n    initialDomainFilter: 'all',\n  },\n)\n\nconst domains = DOMAINS\nconst dataProducts = DATA_PRODUCTS\n\nconst selectedDomainFilter = ref<string>(props.initialDomainFilter)\nconst selectedPortTypeFilter = ref<string>('all')\nconst searchQuery = ref('')\nconst selectedProductId = ref<string>(props.initialSelectedProductId)\nconst activePortId = ref<DataMeshPortId>('snowflake')\nconst copiedUri = ref<string | null>(null)\n\n// Modal states\nconst isAccessModalOpen = ref(false)\nconst isRegisterModalOpen = ref(false)\nconst isQueryDrawerOpen = ref(false)\nconst isSimulatingQuery = ref(false)\n\nconst selectedProduct = computed(() => {\n  return dataProducts.find((p) => p.id === selectedProductId.value) || dataProducts[0]\n})\n\nconst activePort = computed(() => {\n  const currentPorts = selectedProduct.value.ports\n  return currentPorts.find((p) => p.id === activePortId.value) || currentPorts[0]\n})\n\nconst filteredDataProducts = computed(() => {\n  return dataProducts.filter((product) => {\n    if (selectedDomainFilter.value !== 'all' && product.domainId !== selectedDomainFilter.value) {\n      return false\n    }\n    if (selectedPortTypeFilter.value !== 'all') {\n      const hasPort = product.ports.some((p) => p.id === selectedPortTypeFilter.value)\n      if (!hasPort) return false\n    }\n    if (searchQuery.value.trim()) {\n      const q = searchQuery.value.toLowerCase()\n      const matchName = product.name.toLowerCase().includes(q)\n      const matchDisplay = product.displayName.toLowerCase().includes(q)\n      const matchDomain = product.domainName.toLowerCase().includes(q)\n      const matchOwner = product.owner.name.toLowerCase().includes(q)\n      const matchDesc = product.description.toLowerCase().includes(q)\n      if (!matchName && !matchDisplay && !matchDomain && !matchOwner && !matchDesc) {\n        return false\n      }\n    }\n    return true\n  })\n})\n\nfunction selectDomain(domainId: string) {\n  if (selectedDomainFilter.value === domainId) {\n    selectedDomainFilter.value = 'all'\n  } else {\n    selectedDomainFilter.value = domainId\n  }\n}\n\nfunction selectProduct(product: DataProductItem) {\n  selectedProductId.value = product.id\n  if (product.ports.length > 0) {\n    activePortId.value = product.ports[0].id\n  }\n}\n\nfunction copyToClipboard(text: string, identifier: string) {\n  if (typeof navigator !== 'undefined' && navigator.clipboard) {\n    navigator.clipboard.writeText(text)\n    copiedUri.value = identifier\n    setTimeout(() => {\n      copiedUri.value = null\n    }, 2000)\n  }\n}\n\nfunction runSimulatedQuery() {\n  isSimulatingQuery.value = true\n  setTimeout(() => {\n    isSimulatingQuery.value = false\n  }, 1000)\n}\n\nfunction handleOpenAccessModal(product: DataProductItem) {\n  selectProduct(product)\n  isAccessModalOpen.value = true\n}\n\nfunction handleOpenQueryRunner(product: DataProductItem) {\n  selectProduct(product)\n  isQueryDrawerOpen.value = true\n}\n</script>\n\n<template>\n  <div\n    data-slot=\"data-mesh-domain-catalog\"\n    :class=\"\n      cn(\n        'bg-background text-foreground border-border w-full space-y-6 rounded-xl border p-4 shadow-xs sm:p-6',\n        props.class,\n      )\n    \"\n  >\n    <!-- Header Section -->\n    <header class=\"border-border bg-card/70 rounded-xl border p-4 sm:p-5\">\n      <div class=\"flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between\">\n        <div class=\"space-y-2\">\n          <!-- Top Row: Org Breadcrumb & Governance Status -->\n          <div class=\"flex flex-wrap items-center gap-2 text-xs\">\n            <div class=\"bg-primary/10 text-primary flex size-6 items-center justify-center rounded-md\">\n              <Network class=\"size-3.5\" />\n            </div>\n            <span class=\"text-foreground font-semibold\">UIPKGE Global Data Mesh</span>\n            <span class=\"text-muted-foreground font-mono\">4 Core Domains</span>\n            <div\n              class=\"border-success/30 bg-success/10 text-success inline-flex items-center gap-1.5 rounded-full border px-2.5 py-0.5 font-medium\"\n            >\n              <span class=\"relative flex size-2\">\n                <span class=\"bg-success absolute inline-flex size-full rounded-full opacity-75\" />\n                <span class=\"bg-success relative inline-flex size-2 rounded-full\" />\n              </span>\n              <ShieldCheck class=\"text-success size-3.5\" />\n              <span>Federated Computational Governance Active</span>\n            </div>\n          </div>\n\n          <!-- Main Title -->\n          <h1 class=\"text-foreground text-xl font-bold tracking-tight sm:text-2xl\">\n            Data Mesh Domain Catalog & Data Products Directory\n          </h1>\n          <p class=\"text-muted-foreground max-w-3xl text-xs leading-relaxed sm:text-sm\">\n            Zhamak Dehghani architectural architecture for decentralized domain data ownership, discoverable polyglot\n            output ports, and automated computational governance SLA scorecards.\n          </p>\n        </div>\n\n        <!-- Header Action Button -->\n        <div class=\"flex shrink-0 items-center gap-2 pt-1 lg:pt-0\">\n          <Button\n            variant=\"default\"\n            size=\"sm\"\n            class=\"h-9 gap-1.5 text-xs font-medium\"\n            @click=\"isRegisterModalOpen = true\"\n          >\n            <Plus class=\"size-3.5\" />\n            <span>Register New Data Product</span>\n          </Button>\n        </div>\n      </div>\n    </header>\n\n    <!-- 4 Domain Summary Cards -->\n    <section class=\"space-y-3\">\n      <div class=\"flex items-center justify-between gap-x-2 px-1\">\n        <div class=\"flex items-center gap-2\">\n          <Layers class=\"text-primary size-4\" />\n          <h2 class=\"text-foreground text-xs font-semibold tracking-wider uppercase\">Decentralized Domain Nodes (4)</h2>\n        </div>\n        <span class=\"text-muted-foreground text-xs\">Click a domain card to filter Data Products</span>\n      </div>\n\n      <div class=\"grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4\">\n        <div\n          v-for=\"domain in domains\"\n          :key=\"domain.id\"\n          :class=\"\n            cn(\n              'group relative cursor-pointer space-y-3 rounded-xl border p-4 text-xs shadow-xs transition-colors',\n              selectedDomainFilter === domain.id\n                ? 'border-primary bg-primary/5 ring-primary/30 ring-1'\n                : 'border-border bg-card hover:border-border/80 hover:bg-muted/30',\n            )\n          \"\n          @click=\"selectDomain(domain.id)\"\n        >\n          <!-- Domain Card Header -->\n          <div class=\"flex items-start justify-between gap-2\">\n            <div class=\"flex items-center gap-2.5\">\n              <div class=\"bg-muted border-border/80 flex size-8 shrink-0 items-center justify-center rounded-lg border\">\n                <CreditCard v-if=\"domain.iconName === 'CreditCard'\" class=\"text-chart-1 size-4\" />\n                <Users v-else-if=\"domain.iconName === 'Users'\" class=\"text-info size-4\" />\n                <Truck v-else-if=\"domain.iconName === 'Truck'\" class=\"text-warning size-4\" />\n                <Activity v-else class=\"text-success size-4\" />\n              </div>\n              <div>\n                <h3 class=\"text-foreground leading-tight font-semibold\">{{ domain.name }}</h3>\n                <span class=\"text-muted-foreground text-xs\">{{ domain.productsCount }} Data Products</span>\n              </div>\n            </div>\n\n            <Badge\n              :variant=\"selectedDomainFilter === domain.id ? 'default' : 'secondary'\"\n              class=\"shrink-0 font-mono text-xs\"\n            >\n              {{ selectedDomainFilter === domain.id ? 'Filtered' : `${domain.slaScore}% SLA` }}\n            </Badge>\n          </div>\n\n          <!-- Domain Description -->\n          <p class=\"text-muted-foreground line-clamp-2 leading-relaxed\">\n            {{ domain.description }}\n          </p>\n\n          <!-- Domain Meta & Operational Metrics -->\n          <div class=\"border-border/60 grid grid-cols-2 gap-2 border-t pt-2.5 text-xs\">\n            <div>\n              <span class=\"text-muted-foreground block\">Storage Vol</span>\n              <span class=\"text-foreground font-mono font-medium\">{{ domain.storageVolume }}</span>\n            </div>\n            <div>\n              <span class=\"text-muted-foreground block\">Throughput</span>\n              <span class=\"text-foreground font-mono font-medium\">{{ domain.throughput }}</span>\n            </div>\n          </div>\n\n          <!-- Domain Lead Info -->\n          <div class=\"bg-muted/50 flex items-center justify-between gap-x-2 rounded-lg px-2.5 py-1.5\">\n            <div class=\"flex items-center gap-1.5 overflow-hidden\">\n              <Avatar class=\"size-4.5 shrink-0\">\n                <AvatarFallback class=\"text-xs\">\n                  {{\n                    domain.lead\n                      .split(' ')\n                      .map((n) => n[0])\n                      .join('')\n                  }}\n                </AvatarFallback>\n              </Avatar>\n              <span class=\"text-foreground truncate font-medium\">{{ domain.lead }}</span>\n            </div>\n            <span class=\"text-muted-foreground shrink-0 font-mono text-xs\">{{ domain.activeConsumers }} clients</span>\n          </div>\n        </div>\n      </div>\n    </section>\n\n    <!-- Data Products Table Section -->\n    <section class=\"border-border bg-card space-y-4 rounded-xl border p-4 shadow-xs sm:p-5\">\n      <!-- Toolbar: Title, Search, Port Type Selector -->\n      <div class=\"flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between\">\n        <div class=\"space-y-0.5\">\n          <div class=\"flex items-center gap-2\">\n            <Database class=\"text-primary size-4\" />\n            <h2 class=\"text-foreground text-sm font-semibold\">Data Products Catalog</h2>\n            <Badge variant=\"outline\" class=\"font-mono text-xs\">\n              {{ filteredDataProducts.length }} / {{ dataProducts.length }}\n            </Badge>\n          </div>\n          <p class=\"text-muted-foreground text-xs\">\n            Autonomous product quantum nodes adhering to computational policies and explicit input/output schemas.\n          </p>\n        </div>\n\n        <div class=\"flex flex-wrap items-center gap-2\">\n          <!-- Port Filter Selector -->\n          <div class=\"flex items-center gap-1.5\">\n            <span class=\"text-muted-foreground text-xs font-medium\">Output:</span>\n            <select\n              v-model=\"selectedPortTypeFilter\"\n              class=\"border-border bg-background text-foreground focus-visible:ring-ring h-8 rounded-md border px-2.5 text-xs outline-none focus-visible:ring-1\"\n            >\n              <option value=\"all\">All Ports</option>\n              <option value=\"snowflake\">Snowflake View</option>\n              <option value=\"kafka\">Kafka Stream</option>\n              <option value=\"graphql\">GraphQL Mesh</option>\n              <option value=\"s3\">S3 Delta Lake</option>\n            </select>\n          </div>\n\n          <!-- Search Input -->\n          <div class=\"relative w-full sm:w-56\">\n            <Search class=\"text-muted-foreground absolute top-1/2 left-2.5 size-3.5 -translate-y-1/2\" />\n            <input\n              v-model=\"searchQuery\"\n              placeholder=\"Search product, owner, domain...\"\n              class=\"border-border bg-background text-foreground placeholder:text-muted-foreground focus-visible:ring-ring h-8 w-full rounded-md border pr-3 pl-8 text-xs outline-none focus-visible:ring-1\"\n            />\n          </div>\n        </div>\n      </div>\n\n      <!-- Main Data Products Table -->\n      <div class=\"border-border overflow-x-auto rounded-lg border\">\n        <Table>\n          <TableHeader>\n            <TableRow class=\"bg-muted/40\">\n              <TableHead class=\"text-xs\">Data Product & Contract</TableHead>\n              <TableHead class=\"text-xs\">Domain Node</TableHead>\n              <TableHead class=\"text-xs\">Freshness SLA</TableHead>\n              <TableHead class=\"text-xs\">Active Output Ports</TableHead>\n              <TableHead class=\"text-xs\">Consumers & Traffic</TableHead>\n              <TableHead class=\"text-right text-xs\">Actions</TableHead>\n            </TableRow>\n          </TableHeader>\n          <TableBody>\n            <TableRow\n              v-for=\"product in filteredDataProducts\"\n              :key=\"product.id\"\n              :class=\"\n                cn(\n                  'hover:bg-muted/50 cursor-pointer transition-colors',\n                  selectedProductId === product.id && 'bg-primary/5 font-medium',\n                )\n              \"\n              @click=\"selectProduct(product)\"\n            >\n              <!-- Name & Contract -->\n              <TableCell class=\"py-3\">\n                <div class=\"space-y-1\">\n                  <div class=\"flex items-center gap-2\">\n                    <span class=\"text-foreground font-semibold\">{{ product.displayName }}</span>\n                    <Badge variant=\"outline\" class=\"font-mono text-xs\">v{{ product.version }}</Badge>\n                  </div>\n                  <div class=\"flex items-center gap-1.5 text-xs\">\n                    <code class=\"text-muted-foreground font-mono\">{{ product.name }}</code>\n                    <span class=\"text-muted-foreground/40\">·</span>\n                    <Badge\n                      :variant=\"\n                        product.classification === 'PII-Confidential'\n                          ? 'destructive'\n                          : product.classification === 'Financial-Audit'\n                            ? 'default'\n                            : 'secondary'\n                      \"\n                      class=\"text-xs\"\n                    >\n                      {{ product.classification }}\n                    </Badge>\n                  </div>\n                </div>\n              </TableCell>\n\n              <!-- Domain Node & Owner -->\n              <TableCell class=\"py-3\">\n                <div class=\"space-y-1\">\n                  <span class=\"text-foreground text-xs font-medium\">{{ product.domainName }}</span>\n                  <div class=\"flex items-center gap-1.5\">\n                    <Avatar class=\"size-4 shrink-0\">\n                      <AvatarFallback class=\"text-xs\">{{ product.owner.initials }}</AvatarFallback>\n                    </Avatar>\n                    <span class=\"text-muted-foreground text-xs\">{{ product.owner.name }}</span>\n                  </div>\n                </div>\n              </TableCell>\n\n              <!-- SLA & Quality Telemetry -->\n              <TableCell class=\"py-3\">\n                <div class=\"w-36 space-y-1.5\">\n                  <div class=\"flex items-center justify-between text-xs\">\n                    <span class=\"text-muted-foreground font-mono\">SLA Score</span>\n                    <span class=\"text-success font-mono font-semibold\"> {{ product.slaScore }}% </span>\n                  </div>\n                  <Progress :model-value=\"product.slaScore\" class=\"h-1.5\" />\n                  <div class=\"text-muted-foreground flex items-center justify-between font-mono text-xs\">\n                    <span>Latency: {{ product.freshnessLatency }}</span>\n                    <span>{{ product.assertionsPassed }}/{{ product.assertionsTotal }} Checks</span>\n                  </div>\n                </div>\n              </TableCell>\n\n              <!-- Active Output Ports Badges -->\n              <TableCell class=\"py-3\">\n                <div class=\"flex flex-wrap gap-1.5\">\n                  <Badge\n                    v-for=\"port in product.ports\"\n                    :key=\"port.id\"\n                    :variant=\"port.id === activePortId && selectedProductId === product.id ? 'default' : 'secondary'\"\n                    class=\"h-6 gap-1 font-mono text-xs\"\n                  >\n                    <Table2 v-if=\"port.id === 'snowflake'\" class=\"text-info size-3\" />\n                    <Zap v-else-if=\"port.id === 'kafka'\" class=\"text-warning size-3\" />\n                    <Network v-else-if=\"port.id === 'graphql'\" class=\"size-3 text-pink-400\" />\n                    <HardDrive v-else class=\"text-success size-3\" />\n                    <span>{{ port.id.toUpperCase() }}</span>\n                  </Badge>\n                </div>\n              </TableCell>\n\n              <!-- Consumers & Volume -->\n              <TableCell class=\"py-3\">\n                <div class=\"space-y-0.5 text-xs\">\n                  <div class=\"flex items-center gap-1 text-xs\">\n                    <Users class=\"text-muted-foreground size-3\" />\n                    <span class=\"text-foreground font-semibold\">{{ product.activeConsumersCount }}</span>\n                    <span class=\"text-muted-foreground\">registered apps</span>\n                  </div>\n                  <p class=\"text-muted-foreground truncate font-mono text-xs\">\n                    {{ product.topConsumers.slice(0, 2).join(', ') }}\n                  </p>\n                </div>\n              </TableCell>\n\n              <!-- Row Action Dropdown -->\n              <TableCell class=\"py-3 text-right\" @click.stop>\n                <DropdownMenu>\n                  <DropdownMenuTrigger as-child>\n                    <Button variant=\"ghost\" size=\"sm\" class=\"size-8 p-0\">\n                      <MoreHorizontal class=\"size-4\" />\n                    </Button>\n                  </DropdownMenuTrigger>\n                  <DropdownMenuContent align=\"end\" class=\"w-48 text-xs\">\n                    <DropdownMenuLabel class=\"text-xs\">Product Actions</DropdownMenuLabel>\n                    <DropdownMenuItem class=\"cursor-pointer gap-2\" @click=\"selectProduct(product)\">\n                      <Eye class=\"size-3.5\" />\n                      <span>View Specifications</span>\n                    </DropdownMenuItem>\n                    <DropdownMenuItem class=\"cursor-pointer gap-2\" @click=\"handleOpenQueryRunner(product)\">\n                      <Terminal class=\"text-primary size-3.5\" />\n                      <span>Interactive Query Runner</span>\n                    </DropdownMenuItem>\n                    <DropdownMenuItem class=\"cursor-pointer gap-2\" @click=\"handleOpenAccessModal(product)\">\n                      <KeyRound class=\"text-warning size-3.5\" />\n                      <span>Request Consumer Access</span>\n                    </DropdownMenuItem>\n                    <DropdownMenuSeparator />\n                    <DropdownMenuItem\n                      class=\"cursor-pointer gap-2\"\n                      @click=\"copyToClipboard(product.ports[0]?.uri || '', product.id)\"\n                    >\n                      <Copy class=\"size-3.5\" />\n                      <span>Copy Primary Port URI</span>\n                    </DropdownMenuItem>\n                    <DropdownMenuItem\n                      class=\"cursor-pointer gap-2\"\n                      @click=\"copyToClipboard(product.contractHash, product.contractHash)\"\n                    >\n                      <FileCode2 class=\"text-chart-2 size-3.5\" />\n                      <span>Copy Contract Hash</span>\n                    </DropdownMenuItem>\n                  </DropdownMenuContent>\n                </DropdownMenu>\n              </TableCell>\n            </TableRow>\n          </TableBody>\n        </Table>\n      </div>\n    </section>\n\n    <!-- Data Product Output Port Architecture & Governance Card (Selected Product) -->\n    <DataMeshProductDetail\n      :product=\"selectedProduct\"\n      :port=\"activePort\"\n      :active-port-id=\"activePortId\"\n      :copied-key=\"copiedUri\"\n      @update:active-port-id=\"activePortId = $event\"\n      @copy=\"copyToClipboard\"\n      @request-access=\"handleOpenAccessModal\"\n      @run-query=\"handleOpenQueryRunner\"\n    />\n\n    <!-- Interactive Drawer / Modal: Query Output Port -->\n    <DataMeshQueryRunner\n      :open=\"isQueryDrawerOpen\"\n      :product=\"selectedProduct\"\n      :port=\"activePort\"\n      :is-simulating-query=\"isSimulatingQuery\"\n      @close=\"isQueryDrawerOpen = false\"\n      @run-query=\"runSimulatedQuery\"\n    />\n\n    <!-- Modals: Request Access & Register Product -->\n    <DataMeshModals\n      v-model:access-modal-open=\"isAccessModalOpen\"\n      v-model:register-modal-open=\"isRegisterModalOpen\"\n      :product=\"selectedProduct\"\n      :domains=\"domains\"\n    />\n  </div>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/DataMeshDomainCatalog.vue"
    },
    {
      "path": "packages/registry-vue/blocks/data-mesh-domain-catalog/DataMeshProductDetail.vue",
      "content": "<script setup lang=\"ts\">\nimport { cn } from '@/lib/utils'\nimport { Badge } from '@/components/ui/badge'\nimport { Button } from '@/components/ui/button'\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table'\nimport {\n  Boxes,\n  Check,\n  Copy,\n  Database,\n  FileCode2,\n  HardDrive,\n  KeyRound,\n  Network,\n  Radio,\n  Package,\n  Server,\n  ShieldCheck,\n  Terminal,\n  Users,\n  Zap,\n} from 'lucide-vue-next'\nimport type { DataProductItem, OutputPortDetails } from './data-mesh-types'\n\ninterface Props {\n  product: DataProductItem\n  port: OutputPortDetails\n  activePortId: 'snowflake' | 'kafka' | 'graphql' | 's3'\n  copiedKey: string | null\n}\n\ndefineProps<Props>()\n\nconst emit = defineEmits<{\n  'update:activePortId': [id: 'snowflake' | 'kafka' | 'graphql' | 's3']\n  copy: [text: string, identifier: string]\n  'request-access': [product: DataProductItem]\n  'run-query': [product: DataProductItem]\n}>()\n</script>\n\n<template>\n  <section class=\"border-border bg-card/60 space-y-6 rounded-xl border p-4 sm:p-6\">\n    <!-- Section Header with Selected Product Meta -->\n    <div class=\"border-border/80 flex flex-col gap-3 border-b pb-4 lg:flex-row lg:items-start lg:justify-between\">\n      <div class=\"space-y-1.5\">\n        <div class=\"flex flex-wrap items-center gap-2\">\n          <div class=\"bg-primary/10 text-primary flex size-6 items-center justify-center rounded-md\">\n            <Boxes class=\"size-3.5\" />\n          </div>\n          <span class=\"text-muted-foreground font-mono text-xs\">Inspecting Quantum Architecture:</span>\n          <h2 class=\"text-foreground font-mono text-base font-bold break-all sm:text-lg\">\n            {{ product.name }}\n          </h2>\n          <Badge variant=\"secondary\" class=\"font-mono text-xs\">\n            {{ product.version }}\n          </Badge>\n          <Badge variant=\"outline\" class=\"font-mono text-xs\">\n            {{ product.domainName }}\n          </Badge>\n        </div>\n        <p class=\"text-muted-foreground text-xs sm:text-sm\">\n          {{ product.description }}\n        </p>\n      </div>\n\n      <div class=\"flex flex-wrap items-center gap-2\">\n        <!-- Contract Hash copy pill -->\n        <div class=\"border-border bg-background inline-flex items-center gap-1.5 rounded-md border px-2.5 py-1 text-xs\">\n          <span class=\"text-muted-foreground font-mono\">Contract:</span>\n          <span class=\"text-foreground font-mono\">{{ product.contractHash.slice(0, 16) }}...</span>\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            class=\"h-5 px-1 text-xs\"\n            @click=\"emit('copy', product.contractHash, 'hash')\"\n          >\n            <Check v-if=\"copiedKey === 'hash'\" class=\"text-success size-3\" />\n            <Copy v-else class=\"size-3\" />\n          </Button>\n        </div>\n\n        <Button variant=\"outline\" size=\"sm\" class=\"h-8.5 gap-1.5 text-xs\" @click=\"emit('request-access', product)\">\n          <KeyRound class=\"text-warning size-3.5\" />\n          <span>Request Port Access</span>\n        </Button>\n\n        <Button variant=\"default\" size=\"sm\" class=\"h-8.5 gap-1.5 text-xs\" @click=\"emit('run-query', product)\">\n          <Terminal class=\"size-3.5\" />\n          <span>Run Port Query</span>\n        </Button>\n      </div>\n    </div>\n\n    <!-- 4 Core Pillars of Data Mesh Architecture Banner -->\n    <div class=\"grid grid-cols-1 gap-2.5 sm:grid-cols-2 lg:grid-cols-4\">\n      <div class=\"border-border bg-background/80 space-y-1 rounded-lg border p-3 text-xs\">\n        <div class=\"text-primary flex items-center gap-1.5 font-semibold\">\n          <Users class=\"size-3.5\" />\n          <span>1. Domain Ownership</span>\n        </div>\n        <p class=\"text-muted-foreground text-xs leading-relaxed\">\n          Autonomous squad accountability:\n          <span class=\"text-foreground font-medium\">{{ product.owner.name }}</span> ({{ product.owner.team }}).\n        </p>\n      </div>\n\n      <div class=\"border-border bg-background/80 space-y-1 rounded-lg border p-3 text-xs\">\n        <div class=\"text-success flex items-center gap-1.5 font-semibold\">\n          <Package class=\"size-3.5\" />\n          <span>2. Data as a Product</span>\n        </div>\n        <p class=\"text-muted-foreground text-xs leading-relaxed\">\n          Standardized contract with\n          <span class=\"text-foreground font-mono font-medium\">{{ product.slaScore }}% SLA</span> and automated test\n          assertions.\n        </p>\n      </div>\n\n      <div class=\"border-border bg-background/80 space-y-1 rounded-lg border p-3 text-xs\">\n        <div class=\"text-info flex items-center gap-1.5 font-semibold\">\n          <Server class=\"size-3.5\" />\n          <span>3. Self-Serve Platform</span>\n        </div>\n        <p class=\"text-muted-foreground text-xs leading-relaxed\">\n          Polyglot multi-modal output endpoints: SQL, Event Stream, API & Parquet Lake.\n        </p>\n      </div>\n\n      <div class=\"border-border bg-background/80 space-y-1 rounded-lg border p-3 text-xs\">\n        <div class=\"text-warning flex items-center gap-1.5 font-semibold\">\n          <ShieldCheck class=\"size-3.5\" />\n          <span>4. Computational Gov</span>\n        </div>\n        <p class=\"text-muted-foreground text-xs leading-relaxed\">\n          Policy-as-code OPA masking, SOC2 audit trail & automated RBAC grants.\n        </p>\n      </div>\n    </div>\n\n    <!-- Output Ports Multi-Modal Tabs -->\n    <div class=\"space-y-4\">\n      <div class=\"flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between\">\n        <div class=\"flex items-center gap-2\">\n          <Radio class=\"text-primary size-4\" />\n          <h3 class=\"text-foreground text-xs font-semibold tracking-wider uppercase\">\n            Output Ports & Endpoints ({{ product.ports.length }})\n          </h3>\n        </div>\n\n        <!-- Port selector tabs -->\n        <div class=\"border-border bg-muted/60 inline-flex items-center gap-1 rounded-lg border p-1\">\n          <button\n            v-for=\"p in product.ports\"\n            :key=\"p.id\"\n            :class=\"\n              cn(\n                'inline-flex items-center gap-1.5 rounded-md px-3 py-1 text-xs font-medium transition-colors',\n                activePortId === p.id\n                  ? 'bg-background text-foreground font-semibold shadow-xs'\n                  : 'text-muted-foreground hover:text-foreground',\n              )\n            \"\n            @click=\"emit('update:activePortId', p.id)\"\n          >\n            <Database v-if=\"p.id === 'snowflake'\" class=\"text-info size-3.5\" />\n            <Zap v-else-if=\"p.id === 'kafka'\" class=\"text-warning size-3.5\" />\n            <Network v-else-if=\"p.id === 'graphql'\" class=\"text-chart-1 size-3.5\" />\n            <HardDrive v-else class=\"text-success size-3.5\" />\n            <span>{{ p.name }}</span>\n          </button>\n        </div>\n      </div>\n\n      <!-- Active Port Deep Inspector Container -->\n      <div class=\"border-border bg-background space-y-4 rounded-xl border p-4 sm:p-5\">\n        <!-- Port Meta Bar -->\n        <div class=\"border-border/80 flex flex-col gap-3 border-b pb-3 lg:flex-row lg:items-center lg:justify-between\">\n          <div class=\"space-y-1\">\n            <div class=\"flex flex-wrap items-center gap-2\">\n              <span class=\"text-foreground font-mono text-sm font-bold\">{{ port.name }}</span>\n              <Badge variant=\"secondary\" class=\"font-mono text-xs\">{{ port.protocol }}</Badge>\n              <Badge variant=\"outline\" class=\"font-mono text-xs\">{{ port.accessRole }}</Badge>\n            </div>\n            <div class=\"flex items-center gap-2\">\n              <span class=\"text-muted-foreground text-xs\">Port Endpoint URI:</span>\n              <code class=\"bg-muted text-foreground border-border/60 rounded border px-2 py-0.5 font-mono text-xs\">\n                {{ port.uri }}\n              </code>\n              <Button variant=\"ghost\" size=\"sm\" class=\"h-6 px-1.5 text-xs\" @click=\"emit('copy', port.uri, port.uri)\">\n                <Check v-if=\"copiedKey === port.uri\" class=\"text-success size-3\" />\n                <Copy v-else class=\"size-3\" />\n                <span class=\"ml-1 font-mono text-xs\">{{ copiedKey === port.uri ? 'Copied' : 'Copy' }}</span>\n              </Button>\n            </div>\n          </div>\n\n          <div class=\"flex items-center gap-2\">\n            <span\n              v-if=\"port.throughput\"\n              class=\"border-border bg-muted/40 text-muted-foreground rounded-md border px-2.5 py-1 font-mono text-xs\"\n            >\n              Throughput: <strong class=\"text-foreground\">{{ port.throughput }}</strong>\n            </span>\n            <span\n              v-if=\"port.rateLimit\"\n              class=\"border-border bg-muted/40 text-muted-foreground rounded-md border px-2.5 py-1 font-mono text-xs\"\n            >\n              Limit: <strong class=\"text-foreground\">{{ port.rateLimit }}</strong>\n            </span>\n          </div>\n        </div>\n\n        <!-- Port Schema Dictionary (If Columns Defined) -->\n        <div v-if=\"port.columns && port.columns.length > 0\" class=\"space-y-2\">\n          <div class=\"flex items-center justify-between gap-x-2\">\n            <span class=\"text-foreground text-xs font-semibold\">Schema Column Definitions & Constraints</span>\n            <span class=\"text-muted-foreground font-mono text-xs\">{{ port.columns.length }} columns registered</span>\n          </div>\n\n          <div class=\"border-border bg-card overflow-hidden rounded-lg border\">\n            <Table>\n              <TableHeader>\n                <TableRow class=\"bg-muted/40 hover:bg-muted/40\">\n                  <TableHead class=\"text-xs font-semibold\">Column Name</TableHead>\n                  <TableHead class=\"text-xs font-semibold\">Data Type</TableHead>\n                  <TableHead class=\"text-xs font-semibold\">Nullability</TableHead>\n                  <TableHead class=\"text-xs font-semibold\">Constraint</TableHead>\n                  <TableHead class=\"text-xs font-semibold\">Description</TableHead>\n                </TableRow>\n              </TableHeader>\n              <TableBody>\n                <TableRow v-for=\"col in port.columns\" :key=\"col.name\" class=\"font-mono text-xs\">\n                  <TableCell class=\"text-foreground font-bold\">\n                    <div class=\"flex items-center gap-1.5\">\n                      <KeyRound v-if=\"col.isKey\" class=\"text-warning size-3.5\" />\n                      <span>{{ col.name }}</span>\n                    </div>\n                  </TableCell>\n                  <TableCell>\n                    <Badge variant=\"secondary\" class=\"font-mono text-xs font-normal\">\n                      {{ col.type }}\n                    </Badge>\n                  </TableCell>\n                  <TableCell>\n                    <span :class=\"col.nullable ? 'text-muted-foreground' : 'text-foreground font-semibold'\">\n                      {{ col.nullable ? 'NULLABLE' : 'NOT NULL' }}\n                    </span>\n                  </TableCell>\n                  <TableCell>\n                    <Badge v-if=\"col.constraints\" variant=\"outline\" class=\"font-mono text-xs\">\n                      {{ col.constraints }}\n                    </Badge>\n                    <span v-else class=\"text-muted-foreground\">—</span>\n                  </TableCell>\n                  <TableCell class=\"text-muted-foreground font-sans\">\n                    {{ col.desc }}\n                  </TableCell>\n                </TableRow>\n              </TableBody>\n            </Table>\n          </div>\n        </div>\n\n        <!-- Port Code / Sample Payload Explorer -->\n        <div v-if=\"port.sampleQuery || port.samplePayload\" class=\"space-y-2\">\n          <div class=\"flex items-center justify-between gap-x-2\">\n            <div class=\"flex items-center gap-2\">\n              <FileCode2 class=\"text-primary size-3.5\" />\n              <span class=\"text-foreground text-xs font-semibold\">\n                {{ port.sampleQuery ? 'Sample Query / Contract Call' : 'Event Message Payload Schema' }}\n              </span>\n            </div>\n\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              class=\"h-7 gap-1 font-mono text-xs\"\n              @click=\"emit('copy', port.sampleQuery || port.samplePayload || '', 'code')\"\n            >\n              <Check v-if=\"copiedKey === 'code'\" class=\"text-success size-3\" />\n              <Copy v-else class=\"size-3\" />\n              <span>{{ copiedKey === 'code' ? 'Copied' : 'Copy Code' }}</span>\n            </Button>\n          </div>\n\n          <div\n            class=\"overflow-x-auto rounded-lg bg-neutral-950 p-4 font-mono text-xs leading-relaxed text-neutral-100 dark:bg-neutral-950\"\n          >\n            <pre class=\"whitespace-pre\"><code>{{ port.sampleQuery || port.samplePayload }}</code></pre>\n          </div>\n        </div>\n      </div>\n    </div>\n\n    <!-- Federated Computational Governance SLA Scorecard & Compliance Matrix -->\n    <div class=\"space-y-3 pt-2\">\n      <div class=\"flex items-center gap-2\">\n        <ShieldCheck class=\"text-success size-4\" />\n        <h3 class=\"text-foreground text-xs font-semibold tracking-wider uppercase\">\n          Federated Governance SLA Scorecard & Policy Rules\n        </h3>\n      </div>\n\n      <div class=\"grid grid-cols-1 gap-4 lg:grid-cols-3\">\n        <!-- Scorecard Metrics -->\n        <div class=\"border-border bg-background space-y-3 rounded-lg border p-4 text-xs\">\n          <span class=\"text-foreground border-border/60 block border-b pb-1.5 font-semibold\">\n            Service Level Objectives (SLOs)\n          </span>\n          <div class=\"space-y-2\">\n            <div class=\"flex items-center justify-between gap-x-2\">\n              <span class=\"text-muted-foreground\">SLA Availability:</span>\n              <span class=\"text-success font-mono font-bold\">{{ product.uptime }}</span>\n            </div>\n            <div class=\"flex items-center justify-between gap-x-2\">\n              <span class=\"text-muted-foreground\">Freshness Latency:</span>\n              <span class=\"text-foreground font-mono font-medium\">{{ product.freshnessLatency }}</span>\n            </div>\n            <div class=\"flex items-center justify-between gap-x-2\">\n              <span class=\"text-muted-foreground\">Quality Check Assertions:</span>\n              <span class=\"text-foreground text-success font-mono font-medium\">\n                {{ product.assertionsPassed }}/{{ product.assertionsTotal }} Passing\n              </span>\n            </div>\n            <div class=\"flex items-center justify-between gap-x-2\">\n              <span class=\"text-muted-foreground\">Data Classification:</span>\n              <Badge variant=\"secondary\" class=\"font-mono text-xs\">{{ product.classification }}</Badge>\n            </div>\n          </div>\n        </div>\n\n        <!-- Policy-as-Code Engine -->\n        <div class=\"border-border bg-background space-y-2.5 rounded-lg border p-4 text-xs lg:col-span-2\">\n          <span class=\"text-foreground border-border/60 block border-b pb-1.5 font-semibold\">\n            Active Computational Governance Policies (Policy-as-Code)\n          </span>\n          <div class=\"space-y-2\">\n            <div\n              v-for=\"(policy, idx) in product.governancePolicies\"\n              :key=\"idx\"\n              class=\"border-border/70 bg-muted/30 flex items-start gap-2.5 rounded-md border p-2.5\"\n            >\n              <div\n                class=\"bg-success/10 text-success mt-0.5 flex size-4 shrink-0 items-center justify-center rounded-full\"\n              >\n                <Check class=\"size-2.5\" />\n              </div>\n              <p class=\"text-muted-foreground text-xs leading-relaxed\">\n                {{ policy }}\n              </p>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </section>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/DataMeshProductDetail.vue"
    },
    {
      "path": "packages/registry-vue/blocks/data-mesh-domain-catalog/DataMeshQueryRunner.vue",
      "content": "<script setup lang=\"ts\">\nimport { RefreshCw, Terminal, X } from 'lucide-vue-next'\nimport { cn } from '@/lib/utils'\nimport { Badge } from '@/components/ui/badge'\nimport { Button } from '@/components/ui/button'\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table'\nimport type { DataProductItem, OutputPortDetails } from './data-mesh-types'\n\ninterface Props {\n  open: boolean\n  product: DataProductItem\n  port: OutputPortDetails\n  isSimulatingQuery: boolean\n}\n\ndefineProps<Props>()\n\nconst emit = defineEmits<{\n  close: []\n  runQuery: []\n}>()\n</script>\n\n<template>\n  <div v-if=\"open\" class=\"border-border bg-muted/30 overflow-hidden rounded-xl border transition-colors\">\n    <div class=\"border-border bg-card flex items-center justify-between gap-x-2 border-b px-4 py-2.5\">\n      <div class=\"flex items-center gap-2\">\n        <Terminal class=\"text-primary size-4\" />\n        <span class=\"text-foreground font-mono text-xs font-semibold\">\n          Interactive Query Runner · {{ product.name }} ({{ port.name }})\n        </span>\n        <Badge variant=\"outline\" class=\"font-mono text-xs\">{{ port.protocol }}</Badge>\n      </div>\n      <div class=\"flex items-center gap-2\">\n        <Button\n          variant=\"default\"\n          size=\"sm\"\n          class=\"h-7 gap-1 text-xs\"\n          :disabled=\"isSimulatingQuery\"\n          @click=\"emit('runQuery')\"\n        >\n          <RefreshCw :class=\"cn('size-3', isSimulatingQuery && 'animate-spin')\" />\n          <span>{{ isSimulatingQuery ? 'Executing Query...' : 'Execute Run' }}</span>\n        </Button>\n        <Button variant=\"ghost\" size=\"sm\" class=\"size-7 p-0\" @click=\"emit('close')\">\n          <X class=\"size-4\" />\n        </Button>\n      </div>\n    </div>\n\n    <div class=\"space-y-3 p-4\">\n      <div class=\"overflow-x-auto rounded-lg bg-neutral-950 p-3 font-mono text-xs text-neutral-100 dark:bg-neutral-950\">\n        <pre class=\"leading-relaxed whitespace-pre\"><code>{{ port.sampleQuery || port.samplePayload }}</code></pre>\n      </div>\n\n      <div v-if=\"port.mockResults\" class=\"border-border bg-card overflow-hidden rounded-lg border\">\n        <div\n          class=\"border-border bg-muted/50 text-foreground flex items-center justify-between gap-x-2 border-b px-3 py-1.5 text-xs font-semibold\"\n        >\n          <span>Query Results Preview (3 Records returned in 42ms)</span>\n          <Badge variant=\"secondary\" class=\"font-mono text-xs\">Snowflake XS Warehouse</Badge>\n        </div>\n        <Table>\n          <TableHeader>\n            <TableRow class=\"bg-muted/30 hover:bg-muted/30\">\n              <TableHead v-for=\"key in Object.keys(port.mockResults[0] || {})\" :key=\"key\" class=\"font-mono text-xs\">\n                {{ key }}\n              </TableHead>\n            </TableRow>\n          </TableHeader>\n          <TableBody>\n            <TableRow v-for=\"(row, rIdx) in port.mockResults\" :key=\"rIdx\" class=\"font-mono text-xs\">\n              <TableCell v-for=\"(val, valKey) in row\" :key=\"valKey\">\n                {{ val }}\n              </TableCell>\n            </TableRow>\n          </TableBody>\n        </Table>\n      </div>\n    </div>\n  </div>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/DataMeshQueryRunner.vue"
    },
    {
      "path": "packages/registry-vue/blocks/data-mesh-domain-catalog/DataMeshModals.vue",
      "content": "<script setup lang=\"ts\">\nimport { ref } from 'vue'\nimport { CheckCircle2, KeyRound, Plus, X } from 'lucide-vue-next'\nimport { Button } from '@/components/ui/button'\nimport type { DataProductItem, DomainMeta } from './data-mesh-types'\n\ninterface Props {\n  accessModalOpen: boolean\n  registerModalOpen: boolean\n  product: DataProductItem\n  domains: DomainMeta[]\n}\n\ndefineProps<Props>()\n\nconst emit = defineEmits<{\n  'update:accessModalOpen': [value: boolean]\n  'update:registerModalOpen': [value: boolean]\n}>()\n\nconst isAccessApproved = ref(false)\nconst isRegisterSuccess = ref(false)\n\nconst accessAppName = ref('')\nconst accessSquad = ref('')\nconst accessPort = ref('snowflake')\nconst accessReason = ref('')\n\nconst newProductName = ref('')\nconst newProductDomain = ref('checkout-payments')\nconst newProductDesc = ref('')\nconst newProductOwner = ref('')\nconst newProductTeam = ref('')\nconst newProductClassification = ref<'PII-Confidential' | 'Financial-Audit' | 'Internal-Ops' | 'Platform-Internal'>(\n  'PII-Confidential',\n)\n\nfunction submitAccessRequest() {\n  isAccessApproved.value = true\n  setTimeout(() => {\n    emit('update:accessModalOpen', false)\n    isAccessApproved.value = false\n    accessAppName.value = ''\n    accessSquad.value = ''\n    accessReason.value = ''\n  }, 1800)\n}\n\nfunction submitRegisterProduct() {\n  isRegisterSuccess.value = true\n  setTimeout(() => {\n    emit('update:registerModalOpen', false)\n    isRegisterSuccess.value = false\n    newProductName.value = ''\n    newProductDesc.value = ''\n    newProductOwner.value = ''\n    newProductTeam.value = ''\n  }, 1600)\n}\n</script>\n\n<template>\n  <!-- Modal: Request Access to Output Port -->\n  <div\n    v-if=\"accessModalOpen\"\n    class=\"fixed inset-0 z-50 flex items-center justify-center bg-black/60 p-4 backdrop-blur-xs\"\n    @click.self=\"emit('update:accessModalOpen', false)\"\n  >\n    <div class=\"border-border bg-card text-card-foreground w-full max-w-lg space-y-4 rounded-xl border p-5 shadow-lg\">\n      <div class=\"border-border/80 flex items-start justify-between border-b pb-3\">\n        <div class=\"space-y-1\">\n          <div class=\"flex items-center gap-2\">\n            <KeyRound class=\"text-warning size-4\" />\n            <h3 class=\"text-foreground text-sm font-semibold\">Request Output Port Access</h3>\n          </div>\n          <p class=\"text-muted-foreground text-xs\">\n            Automated computational governance approval workflow for\n            <code class=\"text-foreground font-mono font-semibold\">{{ product.name }}</code\n            >.\n          </p>\n        </div>\n        <Button variant=\"ghost\" size=\"sm\" class=\"size-7 p-0\" @click=\"emit('update:accessModalOpen', false)\">\n          <X class=\"size-4\" />\n        </Button>\n      </div>\n\n      <div v-if=\"isAccessApproved\" class=\"border-success/30 bg-success/10 space-y-2 rounded-lg border p-4 text-center\">\n        <div class=\"bg-success/20 text-success inline-flex size-8 items-center justify-center rounded-full\">\n          <CheckCircle2 class=\"size-5\" />\n        </div>\n        <h4 class=\"text-success text-xs font-semibold\">Access Grant Provisioned</h4>\n        <p class=\"text-muted-foreground text-xs\">\n          Federated governance policy-as-code approved request. Token and RBAC role bound to consumer application.\n        </p>\n      </div>\n\n      <form v-else class=\"space-y-3 text-xs\" @submit.prevent=\"submitAccessRequest\">\n        <div class=\"space-y-1\">\n          <label class=\"text-foreground block font-medium\">Consumer Service / Application Name</label>\n          <input\n            v-model=\"accessAppName\"\n            required\n            placeholder=\"e.g. revops-lead-scoring-service\"\n            class=\"border-border bg-background text-foreground placeholder:text-muted-foreground focus-visible:ring-ring h-8.5 w-full rounded-md border px-3 text-xs outline-none focus-visible:ring-1\"\n          />\n        </div>\n\n        <div class=\"space-y-1\">\n          <label class=\"text-foreground block font-medium\">Consumer Squad / Team</label>\n          <input\n            v-model=\"accessSquad\"\n            required\n            placeholder=\"e.g. #growth-eng-squad\"\n            class=\"border-border bg-background text-foreground placeholder:text-muted-foreground focus-visible:ring-ring h-8.5 w-full rounded-md border px-3 text-xs outline-none focus-visible:ring-1\"\n          />\n        </div>\n\n        <div class=\"space-y-1\">\n          <label class=\"text-foreground block font-medium\">Target Output Port</label>\n          <select\n            v-model=\"accessPort\"\n            class=\"border-border bg-background text-foreground focus-visible:ring-ring h-8.5 w-full rounded-md border px-3 text-xs outline-none focus-visible:ring-1\"\n          >\n            <option v-for=\"port in product.ports\" :key=\"port.id\" :value=\"port.id\">\n              {{ port.name }} ({{ port.typeLabel }})\n            </option>\n          </select>\n        </div>\n\n        <div class=\"space-y-1\">\n          <label class=\"text-foreground block font-medium\">Business Justification & Data Usage Scope</label>\n          <textarea\n            v-model=\"accessReason\"\n            required\n            rows=\"2\"\n            placeholder=\"Explain how this data product will be consumed and compliance adherence...\"\n            class=\"border-border bg-background text-foreground placeholder:text-muted-foreground focus-visible:ring-ring w-full rounded-md border p-2 text-xs outline-none focus-visible:ring-1\"\n          />\n        </div>\n\n        <div class=\"border-border/80 flex items-center justify-end gap-2 border-t pt-3\">\n          <Button\n            type=\"button\"\n            variant=\"outline\"\n            size=\"sm\"\n            class=\"h-8 text-xs\"\n            @click=\"emit('update:accessModalOpen', false)\"\n          >\n            Cancel\n          </Button>\n          <Button type=\"submit\" variant=\"default\" size=\"sm\" class=\"h-8 text-xs font-medium\">\n            Submit Access Request\n          </Button>\n        </div>\n      </form>\n    </div>\n  </div>\n\n  <!-- Modal: Register New Data Product -->\n  <div\n    v-if=\"registerModalOpen\"\n    class=\"fixed inset-0 z-50 flex items-center justify-center bg-black/60 p-4 backdrop-blur-xs\"\n    @click.self=\"emit('update:registerModalOpen', false)\"\n  >\n    <div class=\"border-border bg-card text-card-foreground w-full max-w-lg space-y-4 rounded-xl border p-5 shadow-lg\">\n      <div class=\"border-border/80 flex items-start justify-between border-b pb-3\">\n        <div class=\"space-y-1\">\n          <div class=\"flex items-center gap-2\">\n            <Plus class=\"text-primary size-4\" />\n            <h3 class=\"text-foreground text-sm font-semibold\">Register New Data Product</h3>\n          </div>\n          <p class=\"text-muted-foreground text-xs\">\n            Publish a new data product quantum to the federated Data Mesh catalog with contract SLA specs.\n          </p>\n        </div>\n        <Button variant=\"ghost\" size=\"sm\" class=\"size-7 p-0\" @click=\"emit('update:registerModalOpen', false)\">\n          <X class=\"size-4\" />\n        </Button>\n      </div>\n\n      <div v-if=\"isRegisterSuccess\" class=\"border-success/30 bg-success/10 space-y-2 rounded-lg border p-4 text-center\">\n        <div class=\"bg-success/20 text-success inline-flex size-8 items-center justify-center rounded-full\">\n          <CheckCircle2 class=\"size-5\" />\n        </div>\n        <h4 class=\"text-success text-xs font-semibold\">Data Product Registered Successfully</h4>\n        <p class=\"text-muted-foreground text-xs\">\n          Published to catalog registry with contract hash, automated CI/CD validation tests, and SLA telemetry.\n        </p>\n      </div>\n\n      <form v-else class=\"space-y-3 text-xs\" @submit.prevent=\"submitRegisterProduct\">\n        <div class=\"grid grid-cols-1 gap-3 sm:grid-cols-2\">\n          <div class=\"space-y-1\">\n            <label class=\"text-foreground block font-medium\">Product Name / ID</label>\n            <input\n              v-model=\"newProductName\"\n              required\n              placeholder=\"dp_merchant_settlement_ledger\"\n              class=\"border-border bg-background text-foreground placeholder:text-muted-foreground focus-visible:ring-ring h-8.5 w-full rounded-md border px-3 font-mono text-xs outline-none focus-visible:ring-1\"\n            />\n          </div>\n\n          <div class=\"space-y-1\">\n            <label class=\"text-foreground block font-medium\">Domain Node</label>\n            <select\n              v-model=\"newProductDomain\"\n              class=\"border-border bg-background text-foreground focus-visible:ring-ring h-8.5 w-full rounded-md border px-3 text-xs outline-none focus-visible:ring-1\"\n            >\n              <option v-for=\"d in domains\" :key=\"d.id\" :value=\"d.id\">{{ d.name }}</option>\n            </select>\n          </div>\n        </div>\n\n        <div class=\"space-y-1\">\n          <label class=\"text-foreground block font-medium\">Data Product Description</label>\n          <textarea\n            v-model=\"newProductDesc\"\n            required\n            rows=\"2\"\n            placeholder=\"Describe the product quantum purpose, source transformations, and consumer target...\"\n            class=\"border-border bg-background text-foreground placeholder:text-muted-foreground focus-visible:ring-ring w-full rounded-md border p-2 text-xs outline-none focus-visible:ring-1\"\n          />\n        </div>\n\n        <div class=\"grid grid-cols-1 gap-3 sm:grid-cols-2\">\n          <div class=\"space-y-1\">\n            <label class=\"text-foreground block font-medium\">Product Owner Name</label>\n            <input\n              v-model=\"newProductOwner\"\n              required\n              placeholder=\"Marcus Vance\"\n              class=\"border-border bg-background text-foreground placeholder:text-muted-foreground focus-visible:ring-ring h-8.5 w-full rounded-md border px-3 text-xs outline-none focus-visible:ring-1\"\n            />\n          </div>\n\n          <div class=\"space-y-1\">\n            <label class=\"text-foreground block font-medium\">Squad Slack Handle / Team</label>\n            <input\n              v-model=\"newProductTeam\"\n              required\n              placeholder=\"#payments-core\"\n              class=\"border-border bg-background text-foreground placeholder:text-muted-foreground focus-visible:ring-ring h-8.5 w-full rounded-md border px-3 font-mono text-xs outline-none focus-visible:ring-1\"\n            />\n          </div>\n        </div>\n\n        <div class=\"space-y-1\">\n          <label class=\"text-foreground block font-medium\">Data Classification Tier</label>\n          <select\n            v-model=\"newProductClassification\"\n            class=\"border-border bg-background text-foreground focus-visible:ring-ring h-8.5 w-full rounded-md border px-3 text-xs outline-none focus-visible:ring-1\"\n          >\n            <option value=\"PII-Confidential\">PII-Confidential (GDPR Masked)</option>\n            <option value=\"Financial-Audit\">Financial-Audit (SOX Certified)</option>\n            <option value=\"Internal-Ops\">Internal-Ops (Standard RBAC)</option>\n            <option value=\"Platform-Internal\">Platform-Internal (System Only)</option>\n          </select>\n        </div>\n\n        <div class=\"border-border/80 flex items-center justify-end gap-2 border-t pt-3\">\n          <Button\n            type=\"button\"\n            variant=\"outline\"\n            size=\"sm\"\n            class=\"h-8 text-xs\"\n            @click=\"emit('update:registerModalOpen', false)\"\n          >\n            Cancel\n          </Button>\n          <Button type=\"submit\" variant=\"default\" size=\"sm\" class=\"h-8 text-xs font-medium\">\n            Publish to Mesh Registry\n          </Button>\n        </div>\n      </form>\n    </div>\n  </div>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/DataMeshModals.vue"
    },
    {
      "path": "packages/registry-vue/blocks/data-mesh-domain-catalog/data-mesh-types.ts",
      "content": "export interface DomainMeta {\n  id: string\n  name: string\n  lead: string\n  role: string\n  productsCount: number\n  slaScore: number\n  activeConsumers: number\n  storageVolume: string\n  throughput: string\n  tier: string\n  description: string\n  iconName: 'CreditCard' | 'Users' | 'Truck' | 'Activity'\n}\n\nexport interface OutputPortSchemaColumn {\n  name: string\n  type: string\n  nullable: boolean\n  isKey?: boolean\n  desc: string\n  constraints?: string\n}\n\nexport type DataMeshPortId = 'snowflake' | 'kafka' | 'graphql' | 's3'\n\nexport interface OutputPortDetails {\n  id: DataMeshPortId\n  name: string\n  typeLabel: string\n  badgeVariant?: 'default' | 'secondary' | 'outline'\n  protocol: string\n  uri: string\n  accessRole: string\n  schemaRegistry?: string\n  format?: string\n  syncCadence?: string\n  throughput?: string\n  rateLimit?: string\n  columns?: OutputPortSchemaColumn[]\n  sampleQuery?: string\n  samplePayload?: string\n  mockResults?: Array<Record<string, string | number | boolean>>\n}\n\nexport interface DataProductItem {\n  id: string\n  name: string\n  displayName: string\n  domainId: string\n  domainName: string\n  version: string\n  tier: string\n  classification: 'PII-Confidential' | 'Financial-Audit' | 'Internal-Ops' | 'Platform-Internal'\n  description: string\n  contractHash: string\n  owner: {\n    name: string\n    role: string\n    handle: string\n    team: string\n    initials: string\n    avatar?: string\n  }\n  slaScore: number\n  freshnessLatency: string\n  uptime: string\n  assertionsPassed: number\n  assertionsTotal: number\n  activeConsumersCount: number\n  topConsumers: string[]\n  ports: OutputPortDetails[]\n  governancePolicies: string[]\n}\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/data-mesh-types.ts"
    },
    {
      "path": "packages/registry-vue/blocks/data-mesh-domain-catalog/data-mesh-data.ts",
      "content": "import type { DomainMeta, DataProductItem } from './data-mesh-types'\n\nexport const DOMAINS: DomainMeta[] = [\n  {\n    id: 'checkout-payments',\n    name: 'Checkout & Payments',\n    lead: 'Marcus Vance',\n    role: 'Principal Data Architect',\n    productsCount: 6,\n    slaScore: 99.8,\n    activeConsumers: 33,\n    storageVolume: '4.8 TB',\n    throughput: '45k ops/sec',\n    tier: 'Tier 1 Core Gold',\n    description:\n      'Real-time order authorization, payment settlements, GAAP recurring revenue ledgers, and fraud velocity pipelines.',\n    iconName: 'CreditCard',\n  },\n  {\n    id: 'customer-intelligence',\n    name: 'Customer Intelligence',\n    lead: 'Elena Rostova',\n    role: 'Staff Data PM',\n    productsCount: 4,\n    slaScore: 99.6,\n    activeConsumers: 24,\n    storageVolume: '12.2 TB',\n    throughput: '12k ops/sec',\n    tier: 'Tier 1 Core Gold',\n    description:\n      'Unified real-time customer 360 identity resolution graph, behavioral propensity scores, cohort attribution, and churn risk models.',\n    iconName: 'Users',\n  },\n  {\n    id: 'logistics-supply-chain',\n    name: 'Logistics & Supply Chain',\n    lead: 'David Chen',\n    role: 'Lead Data Engineer',\n    productsCount: 5,\n    slaScore: 99.5,\n    activeConsumers: 25,\n    storageVolume: '8.4 TB',\n    throughput: '18k ops/sec',\n    tier: 'Tier 2 Certified',\n    description:\n      'Global container telematics, port dwell predictions, multi-warehouse stock allocations, and carrier SLA breach risk monitors.',\n    iconName: 'Truck',\n  },\n  {\n    id: 'platform-observability',\n    name: 'Platform & Observability',\n    lead: 'Sarah Jenkins',\n    role: 'VP Data Infrastructure',\n    productsCount: 3,\n    slaScore: 99.99,\n    activeConsumers: 41,\n    storageVolume: '19.5 TB',\n    throughput: '85k ops/sec',\n    tier: 'Tier 1 Operational',\n    description:\n      'Federated query execution traces, cross-domain consumer lineage logs, SLA breach alarms, and FinOps egress telemetry.',\n    iconName: 'Activity',\n  },\n]\n\nexport const DATA_PRODUCTS: DataProductItem[] = [\n  {\n    id: 'dp_customer_360_profile',\n    name: 'dp_customer_360_profile',\n    displayName: 'Customer 360 Unified Identity Graph',\n    domainId: 'customer-intelligence',\n    domainName: 'Customer Intelligence',\n    version: 'v3.2.0',\n    tier: 'Tier 1 Core Gold',\n    classification: 'PII-Confidential',\n    description:\n      'Unified real-time customer identity graph, behavioral propensity scores, multi-touch attribution, and consent preferences.',\n    contractHash: 'sha256:8f4c9a12b3e70d4f9012a67e',\n    owner: {\n      name: 'Elena Rostova',\n      role: 'Staff Data PM',\n      handle: '@elena.rostova',\n      team: '#cust-intel-squad',\n      initials: 'ER',\n    },\n    slaScore: 99.9,\n    freshnessLatency: '< 2m',\n    uptime: '99.98%',\n    assertionsPassed: 18,\n    assertionsTotal: 18,\n    activeConsumersCount: 14,\n    topConsumers: ['RevOps Dashboard', 'Churn Predictor', 'Zendesk Sync', 'Marketing Cloud', 'Billing Automation'],\n    ports: [\n      {\n        id: 'snowflake',\n        name: 'Snowflake Analytical Mart',\n        typeLabel: 'Snowflake Table',\n        protocol: 'Snowflake SQL over Arrow Flight',\n        uri: 'snowflake://prod_dw.analytics_customer.dim_customer_360',\n        accessRole: 'ROLE: ANALYTICS_READER',\n        columns: [\n          {\n            name: 'customer_id',\n            type: 'varchar(64)',\n            nullable: false,\n            isKey: true,\n            desc: 'Globally unique customer GUID',\n            constraints: 'PRIMARY KEY',\n          },\n          {\n            name: 'email_hash',\n            type: 'varchar(64)',\n            nullable: false,\n            desc: 'SHA-256 hashed customer email for pseudonymization',\n            constraints: 'OPA MASKED',\n          },\n          {\n            name: 'lifetime_value_usd',\n            type: 'decimal(18,2)',\n            nullable: false,\n            desc: 'Cumulative GAAP realized revenue recognized',\n            constraints: 'CHECK (>= 0)',\n          },\n          {\n            name: 'churn_risk_score',\n            type: 'decimal(5,4)',\n            nullable: true,\n            desc: 'ML predicted churn risk probability (0.0000 - 1.0000)',\n            constraints: '0.0 TO 1.0',\n          },\n          {\n            name: 'primary_tier',\n            type: 'varchar(32)',\n            nullable: false,\n            desc: 'Enterprise / Pro / Team membership classification',\n          },\n          {\n            name: 'last_active_at',\n            type: 'timestamp_tz',\n            nullable: false,\n            desc: 'ISO-8601 UTC timestamp of last observed touchpoint',\n          },\n        ],\n        sampleQuery: `SELECT customer_id, primary_tier, lifetime_value_usd, churn_risk_score\\nFROM prod_dw.analytics_customer.dim_customer_360\\nWHERE churn_risk_score > 0.65\\nORDER BY lifetime_value_usd DESC\\nLIMIT 5;`,\n        mockResults: [\n          {\n            customer_id: 'cust_9821a',\n            primary_tier: 'Enterprise',\n            lifetime_value_usd: '$84,200.00',\n            churn_risk_score: '0.7820',\n          },\n          {\n            customer_id: 'cust_4412b',\n            primary_tier: 'Enterprise',\n            lifetime_value_usd: '$62,450.00',\n            churn_risk_score: '0.6910',\n          },\n          {\n            customer_id: 'cust_1109c',\n            primary_tier: 'Pro Team',\n            lifetime_value_usd: '$28,900.00',\n            churn_risk_score: '0.7140',\n          },\n        ],\n      },\n      {\n        id: 'graphql',\n        name: 'GraphQL Customer Query Endpoint',\n        typeLabel: 'GraphQL API',\n        protocol: 'GraphQL over HTTPS / HTTP/2',\n        uri: 'https://api.uipkge.internal/graphql/v1/customer-360',\n        accessRole: 'Bearer MeshToken (scope: read:customer_360)',\n        rateLimit: '5,000 req/min · P99 < 45ms',\n        sampleQuery: `query GetCustomerProfile($id: ID!) {\\n  customer(id: $id) {\\n    id\\n    primaryTier\\n    lifetimeValueUsd\\n    churnRiskScore\\n    consentPreferences {\\n      analyticsAllowed\\n      marketingAllowed\\n    }\\n  }\\n}`,\n      },\n      {\n        id: 's3',\n        name: 'S3 Parquet Lake Export',\n        typeLabel: 'Parquet S3',\n        protocol: 'S3 Object Store / AWS Lake Formation',\n        uri: 's3://uipkge-data-mesh-lake/customer-intelligence/profiles/v3/',\n        accessRole: 'AWS IAM ARN: arn:aws:iam::data-lake-reader',\n        format: 'Snappy Apache Parquet · Partitioned by date(last_active_at)',\n        syncCadence: 'Hourly Micro-batch Sync',\n      },\n    ],\n    governancePolicies: [\n      'OPA Masking: Email and phone attributes hashed on egress',\n      'GDPR Article 17: Automated erasure pipeline triggered on deletion events',\n      'Differential Privacy: ε=0.5 noise applied to aggregated analytical views',\n    ],\n  },\n  {\n    id: 'dp_realtime_order_stream',\n    name: 'dp_realtime_order_stream',\n    displayName: 'Realtime Checkout Order Stream',\n    domainId: 'checkout-payments',\n    domainName: 'Checkout & Payments',\n    version: 'v2.4.1',\n    tier: 'Tier 1 Mission Critical',\n    classification: 'Financial-Audit',\n    description:\n      'Sub-second immutable stream of global checkout events, payment authorizations, 3D Secure validations, and refunds.',\n    contractHash: 'sha256:4a7e9102c89f33b1e2a05d8c',\n    owner: {\n      name: 'Marcus Vance',\n      role: 'Principal Architect',\n      handle: '@marcus.vance',\n      team: '#payments-core',\n      initials: 'MV',\n    },\n    slaScore: 99.95,\n    freshnessLatency: '< 150ms',\n    uptime: '99.99%',\n    assertionsPassed: 24,\n    assertionsTotal: 24,\n    activeConsumersCount: 22,\n    topConsumers: ['Fraud Engine', 'Inventory Lock', 'Stripe Settlement', 'Fulfillment Dispatch', 'NetSuite ERP'],\n    ports: [\n      {\n        id: 'kafka',\n        name: 'Kafka High-Throughput Event Topic',\n        typeLabel: 'Kafka Stream',\n        protocol: 'Kafka Protocol v3.6 / Avro Schema Registry',\n        uri: 'kafka://events.kafka.internal:9092/payments.checkout.orders.v2',\n        accessRole: 'mTLS Certificate (CN=service.payments.consumer)',\n        schemaRegistry: 'Avro v2.4 (Subject: payments-checkout-orders-value)',\n        throughput: '45,000 msg/sec (16 partitions · RF: 3)',\n        samplePayload: `{\\n  \"event_id\": \"evt_9941a80c-b4\",\\n  \"order_id\": \"ord_88201\",\\n  \"customer_id\": \"cust_9821a\",\\n  \"amount_cents\": 184500,\\n  \"currency\": \"USD\",\\n  \"payment_method\": \"stripe_card_v2\",\\n  \"status\": \"AUTHORIZED\",\\n  \"timestamp_utc\": \"2026-08-21T14:28:10.194Z\"\\n}`,\n      },\n      {\n        id: 'snowflake',\n        name: 'Raw Streaming Ingestion Table',\n        typeLabel: 'Snowflake Table',\n        protocol: 'Snowpipe Streaming / Arrow Flight',\n        uri: 'snowflake://prod_dw.raw_payments.fct_orders_stream',\n        accessRole: 'ROLE: PAYMENTS_READER',\n        columns: [\n          {\n            name: 'event_id',\n            type: 'varchar(64)',\n            nullable: false,\n            isKey: true,\n            desc: 'Immutable idempotency event GUID',\n            constraints: 'PRIMARY KEY',\n          },\n          { name: 'order_id', type: 'varchar(32)', nullable: false, desc: 'Reference checkout order ID' },\n          { name: 'amount_usd', type: 'decimal(18,2)', nullable: false, desc: 'Settled transactional amount in USD' },\n          {\n            name: 'payment_status',\n            type: 'varchar(24)',\n            nullable: false,\n            desc: 'AUTHORIZED / CAPTURED / FAILED / REFUNDED',\n          },\n          {\n            name: 'event_timestamp',\n            type: 'timestamp_tz',\n            nullable: false,\n            desc: 'Sub-second event creation timestamp',\n          },\n        ],\n        sampleQuery: `SELECT event_id, order_id, amount_usd, payment_status, event_timestamp\\nFROM prod_dw.raw_payments.fct_orders_stream\\nWHERE event_timestamp >= DATEADD(minute, -15, CURRENT_TIMESTAMP())\\nORDER BY event_timestamp DESC\\nLIMIT 5;`,\n        mockResults: [\n          {\n            event_id: 'evt_9941a',\n            order_id: 'ord_88201',\n            amount_usd: '$1,845.00',\n            payment_status: 'AUTHORIZED',\n            event_timestamp: '14:28:10 UTC',\n          },\n          {\n            event_id: 'evt_9940b',\n            order_id: 'ord_88200',\n            amount_usd: '$420.50',\n            payment_status: 'CAPTURED',\n            event_timestamp: '14:28:08 UTC',\n          },\n        ],\n      },\n      {\n        id: 'graphql',\n        name: 'Realtime Orders Webhook/API',\n        typeLabel: 'GraphQL API',\n        protocol: 'GraphQL Subscriptions over WebSockets',\n        uri: 'https://api.uipkge.internal/graphql/v1/orders-stream',\n        accessRole: 'Bearer MeshToken (scope: read:orders)',\n        rateLimit: '10,000 req/min · P99 < 30ms',\n        sampleQuery: `subscription OnNewOrderAuthorized {\\n  orderAuthorized {\\n    orderId\\n    amountUsd\\n    status\\n    timestamp\\n  }\\n}`,\n      },\n    ],\n    governancePolicies: [\n      'PCI-DSS Tier 1: Zero plain-text card data in payload schema',\n      'Idempotent Delivery: Exactly-once consumer semantics guaranteed via Kafka transactional producer',\n      'Audit Immutability: Append-only write ledger with cryptographic hash chaining',\n    ],\n  },\n  {\n    id: 'dp_carrier_delivery_performance',\n    name: 'dp_carrier_delivery_performance',\n    displayName: 'Carrier Dwell & Delivery Telematics',\n    domainId: 'logistics-supply-chain',\n    domainName: 'Logistics & Supply Chain',\n    version: 'v1.8.0',\n    tier: 'Tier 2 Certified',\n    classification: 'Internal-Ops',\n    description:\n      'Real-time carrier transit telematics, port dwell times, ETA machine learning forecasts, and SLA breach risk scoring.',\n    contractHash: 'sha256:19bc2a40e87d12f4581109aa',\n    owner: {\n      name: 'David Chen',\n      role: 'Lead Data Engineer',\n      handle: '@david.chen',\n      team: '#logistics-mesh',\n      initials: 'DC',\n    },\n    slaScore: 99.4,\n    freshnessLatency: '< 5m',\n    uptime: '99.92%',\n    assertionsPassed: 12,\n    assertionsTotal: 12,\n    activeConsumersCount: 9,\n    topConsumers: ['Control Tower UI', 'Carrier Scorecard', 'Customs Broker Portal', 'Exception Dispatcher'],\n    ports: [\n      {\n        id: 'snowflake',\n        name: 'Logistics Telematics Mart',\n        typeLabel: 'Snowflake Table',\n        protocol: 'Snowflake SQL / DBT Mart',\n        uri: 'snowflake://prod_dw.logistics_marts.fct_carrier_telematics',\n        accessRole: 'ROLE: LOGISTICS_ANALYST',\n        columns: [\n          {\n            name: 'shipment_id',\n            type: 'varchar(48)',\n            nullable: false,\n            isKey: true,\n            desc: 'Global multimodal consignment identifier',\n            constraints: 'PRIMARY KEY',\n          },\n          {\n            name: 'carrier_scac',\n            type: 'varchar(8)',\n            nullable: false,\n            desc: 'Standard Carrier Alpha Code (MAEU, MSCU, COSU)',\n          },\n          {\n            name: 'port_dwell_hours',\n            type: 'decimal(6,2)',\n            nullable: false,\n            desc: 'Current container dwell interval at marine terminal',\n          },\n          {\n            name: 'eta_prediction_confidence',\n            type: 'decimal(5,4)',\n            nullable: false,\n            desc: 'ML ensemble model forecast confidence score',\n          },\n          {\n            name: 'sla_breach_flag',\n            type: 'boolean',\n            nullable: false,\n            desc: 'Flagged true if predicted delivery > guaranteed SLA',\n          },\n        ],\n        sampleQuery: `SELECT shipment_id, carrier_scac, port_dwell_hours, sla_breach_flag\\nFROM prod_dw.logistics_marts.fct_carrier_telematics\\nWHERE sla_breach_flag = TRUE\\nORDER BY port_dwell_hours DESC\\nLIMIT 5;`,\n        mockResults: [\n          { shipment_id: 'SHP-90812', carrier_scac: 'MAEU', port_dwell_hours: '74.2 hrs', sla_breach_flag: true },\n          { shipment_id: 'SHP-90804', carrier_scac: 'MSCU', port_dwell_hours: '61.5 hrs', sla_breach_flag: true },\n        ],\n      },\n      {\n        id: 's3',\n        name: 'Telematics Parquet Batch Stream',\n        typeLabel: 'Parquet S3',\n        protocol: 'S3 Data Lake / Hive Metastore',\n        uri: 's3://uipkge-data-mesh-lake/supply-chain/telematics/v1/',\n        accessRole: 'AWS IAM: arn:aws:iam::supply-chain-lake-reader',\n        format: 'Snappy Parquet partitioned by carrier_scac / year / month',\n        syncCadence: 'Every 5 minutes',\n      },\n    ],\n    governancePolicies: [\n      'Geospatial Resolution Cap: GPS telematics coordinates rounded to 3 decimal places outside geofences',\n      'SLA Alert Threshold: Automatic PagerDuty alert on > 5% carrier breach rate',\n    ],\n  },\n  {\n    id: 'dp_subscription_mrr_ledger',\n    name: 'dp_subscription_mrr_ledger',\n    displayName: 'Subscription MRR & Revenue Recognition',\n    domainId: 'checkout-payments',\n    domainName: 'Checkout & Payments',\n    version: 'v4.0.2',\n    tier: 'Tier 1 Core Gold',\n    classification: 'Financial-Audit',\n    description:\n      'GAAP/IFRS compliant monthly recurring revenue recognition ledger, expansion/contraction deltas, and cohort retention.',\n    contractHash: 'sha256:d82e1194fa8892bc0147ae55',\n    owner: {\n      name: 'Marcus Vance',\n      role: 'Principal Architect',\n      handle: '@marcus.vance',\n      team: '#payments-core',\n      initials: 'MV',\n    },\n    slaScore: 100.0,\n    freshnessLatency: '< 1h',\n    uptime: '99.99%',\n    assertionsPassed: 32,\n    assertionsTotal: 32,\n    activeConsumersCount: 11,\n    topConsumers: ['Executive Board Deck', 'NetSuite Sync', 'FP&A Forecasting', 'Investor Reporting'],\n    ports: [\n      {\n        id: 'snowflake',\n        name: 'Gold Certified Financial Mart',\n        typeLabel: 'Snowflake Table',\n        protocol: 'Snowflake SQL / Incremental Gold Mart',\n        uri: 'snowflake://prod_dw.finance_gold.fct_subscription_mrr_ledger',\n        accessRole: 'ROLE: FINANCE_EXECUTIVE',\n        columns: [\n          {\n            name: 'fiscal_month',\n            type: 'varchar(7)',\n            nullable: false,\n            isKey: true,\n            desc: 'YYYY-MM accounting partition key',\n            constraints: 'PRIMARY KEY',\n          },\n          {\n            name: 'starting_mrr',\n            type: 'decimal(18,2)',\n            nullable: false,\n            desc: 'Beginning of period monthly recurring revenue',\n          },\n          {\n            name: 'expansion_mrr',\n            type: 'decimal(18,2)',\n            nullable: false,\n            desc: 'Net upgrade and seat expansion recognized',\n          },\n          {\n            name: 'churn_mrr',\n            type: 'decimal(18,2)',\n            nullable: false,\n            desc: 'Lost subscriptions recognized in period',\n          },\n          {\n            name: 'ending_mrr',\n            type: 'decimal(18,2)',\n            nullable: false,\n            desc: 'Period closing MRR for GAAP balance sheet',\n          },\n        ],\n        sampleQuery: `SELECT fiscal_month, starting_mrr, expansion_mrr, churn_mrr, ending_mrr\\nFROM prod_dw.finance_gold.fct_subscription_mrr_ledger\\nORDER BY fiscal_month DESC\\nLIMIT 3;`,\n        mockResults: [\n          {\n            fiscal_month: '2026-03',\n            starting_mrr: '$1,220,000.00',\n            expansion_mrr: '$64,500.00',\n            churn_mrr: '-$12,450.00',\n            ending_mrr: '$1,272,050.00',\n          },\n          {\n            fiscal_month: '2026-02',\n            starting_mrr: '$1,175,000.00',\n            expansion_mrr: '$58,100.00',\n            churn_mrr: '-$13,100.00',\n            ending_mrr: '$1,220,000.00',\n          },\n        ],\n      },\n      {\n        id: 's3',\n        name: 'Finance Cold-Storage Delta Lake',\n        typeLabel: 'Parquet S3',\n        protocol: 'Delta Lake 3.0 ACID table with 7-year retention',\n        uri: 's3://uipkge-data-mesh-lake/finance/mrr-ledger/v4/',\n        accessRole: 'AWS IAM: arn:aws:iam::finance-audit-reader',\n        format: 'Delta Lake ACID Snappy Parquet',\n        syncCadence: 'Daily Fiscal Close',\n      },\n    ],\n    governancePolicies: [\n      'SOX Compliance: Dual-sign-off required before schema mutation',\n      'Cryptographic Seal: Daily ledger snapshot sealed with SHA-256 digest',\n    ],\n  },\n  {\n    id: 'dp_global_inventory_snapshot',\n    name: 'dp_global_inventory_snapshot',\n    displayName: 'Global Multi-Warehouse Inventory',\n    domainId: 'logistics-supply-chain',\n    domainName: 'Logistics & Supply Chain',\n    version: 'v2.1.0',\n    tier: 'Tier 1 Core Gold',\n    classification: 'Internal-Ops',\n    description:\n      'Multi-warehouse SKU inventory levels, safety stock thresholds, in-transit allocations, and backorder risk indices.',\n    contractHash: 'sha256:55f01e89bc21340aa482910d',\n    owner: {\n      name: 'David Chen',\n      role: 'Lead Data Engineer',\n      handle: '@david.chen',\n      team: '#logistics-mesh',\n      initials: 'DC',\n    },\n    slaScore: 99.7,\n    freshnessLatency: '< 1m',\n    uptime: '99.95%',\n    assertionsPassed: 16,\n    assertionsTotal: 16,\n    activeConsumersCount: 16,\n    topConsumers: ['Storefront Stock Badge', 'Warehouse WMS', 'Restock Bot', 'ERP Allocator'],\n    ports: [\n      {\n        id: 'snowflake',\n        name: 'Warehouse Stock Levels Table',\n        typeLabel: 'Snowflake Table',\n        protocol: 'Snowflake SQL / Materialized View',\n        uri: 'snowflake://prod_dw.inventory.dim_warehouse_stock_levels',\n        accessRole: 'ROLE: INVENTORY_OPERATOR',\n        columns: [\n          {\n            name: 'sku_id',\n            type: 'varchar(32)',\n            nullable: false,\n            isKey: true,\n            desc: 'Universal Stock Keeping Unit token',\n            constraints: 'PRIMARY KEY',\n          },\n          {\n            name: 'warehouse_code',\n            type: 'varchar(12)',\n            nullable: false,\n            isKey: true,\n            desc: 'Facility code (e.g. WH-ORD1, WH-FRA2)',\n            constraints: 'PRIMARY KEY',\n          },\n          {\n            name: 'quantity_available',\n            type: 'integer',\n            nullable: false,\n            desc: 'Unallocated physical stock ready to pick',\n          },\n          {\n            name: 'quantity_reserved',\n            type: 'integer',\n            nullable: false,\n            desc: 'Allocated to in-flight pending checkout baskets',\n          },\n          {\n            name: 'reorder_threshold',\n            type: 'integer',\n            nullable: false,\n            desc: 'Automated PO replenishment trigger watermark',\n          },\n        ],\n        sampleQuery: `SELECT sku_id, warehouse_code, quantity_available, quantity_reserved\\nFROM prod_dw.inventory.dim_warehouse_stock_levels\\nWHERE quantity_available <= reorder_threshold\\nLIMIT 5;`,\n        mockResults: [\n          { sku_id: 'SKU-8819-A', warehouse_code: 'WH-ORD1', quantity_available: 12, quantity_reserved: 8 },\n          { sku_id: 'SKU-4402-Z', warehouse_code: 'WH-FRA2', quantity_available: 4, quantity_reserved: 4 },\n        ],\n      },\n      {\n        id: 'kafka',\n        name: 'Inventory Delta Stream Topic',\n        typeLabel: 'Kafka Stream',\n        protocol: 'Kafka Event Topic / Avro v2.1',\n        uri: 'kafka://events.kafka.internal:9092/supplychain.inventory.deltas.v2',\n        accessRole: 'mTLS Certificate (CN=service.inventory.allocator)',\n        throughput: '18,000 msg/sec',\n        samplePayload: `{\\n  \"sku_id\": \"SKU-8819-A\",\\n  \"warehouse_code\": \"WH-ORD1\",\\n  \"delta_units\": -1,\\n  \"reason\": \"CHECKOUT_PICKED\",\\n  \"timestamp_utc\": \"2026-08-21T14:29:40.012Z\"\\n}`,\n      },\n    ],\n    governancePolicies: [\n      'Real-time Stock Consistency: Sub-second reconciliation against Physical WMS barcode scans',\n      'Zero Phantom Inventory: Automated cycle count variance audit',\n    ],\n  },\n  {\n    id: 'dp_mesh_observability_telemetry',\n    name: 'dp_mesh_observability_telemetry',\n    displayName: 'Mesh Observability & Query Lineage',\n    domainId: 'platform-observability',\n    domainName: 'Platform & Observability',\n    version: 'v1.5.0',\n    tier: 'Tier 1 Operational',\n    classification: 'Platform-Internal',\n    description:\n      'Federated query execution traces, cross-domain consumer lineage logs, SLA breach alarms, and FinOps egress telemetry.',\n    contractHash: 'sha256:2210aae88401bdfe771032cf',\n    owner: {\n      name: 'Sarah Jenkins',\n      role: 'VP Data Infrastructure',\n      handle: '@sarah.jenkins',\n      team: '#platform-infra',\n      initials: 'SJ',\n    },\n    slaScore: 99.99,\n    freshnessLatency: '< 500ms',\n    uptime: '99.99%',\n    assertionsPassed: 14,\n    assertionsTotal: 14,\n    activeConsumersCount: 28,\n    topConsumers: ['Mesh Control Plane', 'Datadog Gateway', 'FinOps Cost Allocator', 'Governance Engine'],\n    ports: [\n      {\n        id: 'snowflake',\n        name: 'Mesh Query Audit Table',\n        typeLabel: 'Snowflake Table',\n        protocol: 'Snowflake SQL / Observability DW',\n        uri: 'snowflake://prod_dw.observability.fct_mesh_query_logs',\n        accessRole: 'ROLE: MESH_ADMIN',\n        columns: [\n          {\n            name: 'query_execution_id',\n            type: 'varchar(64)',\n            nullable: false,\n            isKey: true,\n            desc: 'Federated query execution trace ID',\n            constraints: 'PRIMARY KEY',\n          },\n          {\n            name: 'caller_principal',\n            type: 'varchar(64)',\n            nullable: false,\n            desc: 'Service account or user querying the port',\n          },\n          {\n            name: 'target_data_product',\n            type: 'varchar(64)',\n            nullable: false,\n            desc: 'Queried Data Product identifier',\n          },\n          { name: 'duration_ms', type: 'integer', nullable: false, desc: 'Execution duration in milliseconds' },\n          {\n            name: 'bytes_scanned_mb',\n            type: 'decimal(12,2)',\n            nullable: false,\n            desc: 'Egress bandwidth volume for FinOps attribution',\n          },\n        ],\n        sampleQuery: `SELECT caller_principal, target_data_product, duration_ms, bytes_scanned_mb\\nFROM prod_dw.observability.fct_mesh_query_logs\\nORDER BY duration_ms DESC\\nLIMIT 5;`,\n        mockResults: [\n          {\n            caller_principal: 'svc_revops_dashboard',\n            target_data_product: 'dp_customer_360_profile',\n            duration_ms: 38,\n            bytes_scanned_mb: '14.2 MB',\n          },\n          {\n            caller_principal: 'svc_fraud_detector',\n            target_data_product: 'dp_realtime_order_stream',\n            duration_ms: 12,\n            bytes_scanned_mb: '4.8 MB',\n          },\n        ],\n      },\n      {\n        id: 'kafka',\n        name: 'OpenTelemetry OTLP Trace Stream',\n        typeLabel: 'Kafka Stream',\n        protocol: 'Kafka Event Topic / Protobuf v3',\n        uri: 'kafka://events.kafka.internal:9092/platform.mesh.audit.v1',\n        accessRole: 'mTLS Certificate (CN=service.mesh.observer)',\n        throughput: '85,000 msg/sec',\n        samplePayload: `{\\n  \"trace_id\": \"tr_99014ab\",\\n  \"caller\": \"svc_fraud_detector\",\\n  \"product\": \"dp_realtime_order_stream\",\\n  \"port\": \"kafka\",\\n  \"latency_ms\": 12,\\n  \"status\": 200\\n}`,\n      },\n    ],\n    governancePolicies: [\n      'FinOps Cost Attribution: Every query query-plan tagged with consumer squad ID',\n      'Zero Trust Egress: Real-time anomaly alerts on unauthorized consumer bursts',\n    ],\n  },\n]\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/data-mesh-data.ts"
    }
  ],
  "dependencies": [
    "lucide-vue-next"
  ],
  "devDependencies": [],
  "registryDependencies": [
    "https://uipkge.dev/r/vue/avatar.json",
    "https://uipkge.dev/r/vue/badge.json",
    "https://uipkge.dev/r/vue/button.json",
    "https://uipkge.dev/r/vue/dropdown-menu.json",
    "https://uipkge.dev/r/vue/progress.json",
    "https://uipkge.dev/r/vue/table.json"
  ],
  "description": "Zhamak Dehghani Data Mesh architecture domain catalog, Data Products directory, polyglot output ports (Snowflake, Kafka, GraphQL, S3), and federated computational governance SLA scorecards.",
  "categories": [
    "devops",
    "app",
    "analytics",
    "data"
  ]
}