{
  "$schema": "https://shadcn-vue.com/schema/registry-item.json",
  "name": "error-page",
  "title": "Error Page",
  "type": "registry:block",
  "files": [
    {
      "path": "packages/registry-vue/blocks/error-page/Error404.vue",
      "content": "<script setup lang=\"ts\">\nimport type { HTMLAttributes } from 'vue'\nimport { computed } from 'vue'\nimport { ArrowLeft, LifeBuoy } from 'lucide-vue-next'\nimport { cn } from '@/lib/utils'\nimport { Button } from '@/components/ui/button'\n\ninterface Props {\n  code?: string\n  title?: string\n  description?: string\n  /** Replaces the HTTP response panel. Pass `''` to hide art entirely. */\n  image?: string\n  imageAlt?: string\n  primaryLabel?: string\n  secondaryLabel?: string\n  primaryHref?: string\n  secondaryHref?: string\n  showPrimary?: boolean\n  showSecondary?: boolean\n  primaryDisabled?: boolean\n  secondaryDisabled?: boolean\n  onPrimary?: () => void\n  onSecondary?: () => void\n  /** `'page'` fills the viewport; `'contained'` fits a preview or nested panel. */\n  layout?: 'page' | 'contained'\n  class?: HTMLAttributes['class']\n}\n\nexport type Error404Props = Props\n\nconst props = withDefaults(defineProps<Props>(), {\n  image: '/illustrations/error-404.jpg',\n  imageAlt: '',\n  showPrimary: true,\n  showSecondary: true,\n  primaryDisabled: false,\n  secondaryDisabled: false,\n  layout: 'page',\n})\n\nconst copy = (fallback: string, override?: string) => (override === undefined ? fallback : override)\n\nconst code = computed(() => copy('404', props.code))\nconst title = computed(() => copy('Page not found', props.title))\nconst description = computed(() =>\n  copy(\n    \"The page you're looking for doesn't exist or may have been moved. Check the URL or head back home.\",\n    props.description,\n  ),\n)\nconst primaryLabel = computed(() => copy('Back to home', props.primaryLabel))\nconst secondaryLabel = computed(() => copy('Contact support', props.secondaryLabel))\n</script>\n\n<template>\n  <section\n    data-slot=\"error-404\"\n    :data-layout=\"layout\"\n    :class=\"\n      cn(\n        'bg-background relative flex items-center overflow-hidden px-6 py-16',\n        layout === 'page' ? 'min-h-svh' : 'min-h-[28rem]',\n        props.class,\n      )\n    \"\n  >\n    <div class=\"mx-auto grid w-full max-w-5xl items-center gap-10 lg:grid-cols-2 lg:gap-16\">\n      <div>\n        <p v-if=\"code\" class=\"text-muted-foreground text-sm font-medium\">HTTP {{ code }}</p>\n        <p v-if=\"code\" class=\"mt-3 text-6xl font-semibold tracking-tighter sm:text-7xl\">{{ code }}</p>\n        <h1 class=\"mt-3 text-2xl font-semibold tracking-tight sm:text-3xl\">{{ title }}</h1>\n        <p v-if=\"description\" class=\"text-muted-foreground mt-4 max-w-md text-base\">{{ description }}</p>\n        <div v-if=\"showPrimary || showSecondary\" class=\"mt-8 flex flex-wrap items-center gap-3\">\n          <Button\n            v-if=\"showPrimary\"\n            :as=\"primaryHref ? 'a' : 'button'\"\n            :href=\"primaryHref\"\n            size=\"lg\"\n            :disabled=\"primaryDisabled\"\n            @click=\"onPrimary?.()\"\n          >\n            <ArrowLeft />\n            {{ primaryLabel }}\n          </Button>\n          <Button\n            v-if=\"showSecondary\"\n            :as=\"secondaryHref ? 'a' : 'button'\"\n            :href=\"secondaryHref\"\n            size=\"lg\"\n            variant=\"outline\"\n            :disabled=\"secondaryDisabled\"\n            @click=\"onSecondary?.()\"\n          >\n            {{ secondaryLabel }}\n            <LifeBuoy />\n          </Button>\n        </div>\n      </div>\n      <div v-if=\"image\" class=\"border-border bg-muted overflow-hidden rounded-xl border\">\n        <img :src=\"image\" :alt=\"imageAlt\" class=\"aspect-[4/3] w-full object-cover\" />\n      </div>\n      <div\n        v-else-if=\"image === undefined\"\n        class=\"border-border bg-muted/40 overflow-hidden rounded-xl border font-mono\"\n        aria-hidden=\"true\"\n      >\n        <div class=\"border-border text-muted-foreground truncate border-b px-3 py-2 text-xs\">\n          curl -i https://app.acme.dev/pricing/teams\n        </div>\n        <div class=\"space-y-1 p-4 text-xs leading-relaxed\">\n          <p><span class=\"text-muted-foreground\">HTTP/1.1</span>{{ ' ' }}{{ code || '404' }} Not Found</p>\n          <p class=\"text-muted-foreground\">content-type: application/json</p>\n          <p class=\"text-muted-foreground\">x-request-id: req_9k2e18</p>\n          <p class=\"text-muted-foreground mt-3\">{ \"error\": \"not_found\", \"path\": \"/pricing/teams\" }</p>\n        </div>\n      </div>\n    </div>\n  </section>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/error-page/Error404.vue"
    },
    {
      "path": "packages/registry-vue/blocks/error-page/Error500.vue",
      "content": "<script setup lang=\"ts\">\nimport type { HTMLAttributes } from 'vue'\nimport { computed } from 'vue'\nimport { LifeBuoy, RefreshCcw } from 'lucide-vue-next'\nimport { cn } from '@/lib/utils'\nimport { Button } from '@/components/ui/button'\n\ninterface Props {\n  code?: string\n  title?: string\n  description?: string\n  /** Replaces the HTTP response panel. Pass `''` to hide art entirely. */\n  image?: string\n  imageAlt?: string\n  primaryLabel?: string\n  secondaryLabel?: string\n  tertiaryLabel?: string\n  primaryHref?: string\n  secondaryHref?: string\n  tertiaryHref?: string\n  showPrimary?: boolean\n  showSecondary?: boolean\n  showTertiary?: boolean\n  primaryDisabled?: boolean\n  secondaryDisabled?: boolean\n  tertiaryDisabled?: boolean\n  onPrimary?: () => void\n  onSecondary?: () => void\n  onTertiary?: () => void\n  /** `'page'` fills the viewport; `'contained'` fits a preview or nested panel. */\n  layout?: 'page' | 'contained'\n  class?: HTMLAttributes['class']\n}\n\nexport type Error500Props = Props\n\nconst props = withDefaults(defineProps<Props>(), {\n  image: '/illustrations/error-500.jpg',\n  imageAlt: '',\n  showPrimary: true,\n  showSecondary: true,\n  showTertiary: true,\n  primaryDisabled: false,\n  secondaryDisabled: false,\n  tertiaryDisabled: false,\n  layout: 'page',\n})\n\nconst copy = (fallback: string, override?: string) => (override === undefined ? fallback : override)\n\nconst code = computed(() => copy('500', props.code))\nconst title = computed(() => copy('Something went wrong', props.title))\nconst description = computed(() =>\n  copy(\n    'We hit an unexpected error on our side. Try again in a moment — if it keeps happening, our team is on it.',\n    props.description,\n  ),\n)\nconst primaryLabel = computed(() => copy('Try again', props.primaryLabel))\nconst secondaryLabel = computed(() => copy('Back to home', props.secondaryLabel))\nconst tertiaryLabel = computed(() => copy('Contact support', props.tertiaryLabel))\n</script>\n\n<template>\n  <section\n    data-slot=\"error-500\"\n    :data-layout=\"layout\"\n    :class=\"\n      cn(\n        'bg-background relative flex items-center overflow-hidden px-6 py-16',\n        layout === 'page' ? 'min-h-svh' : 'min-h-[28rem]',\n        props.class,\n      )\n    \"\n  >\n    <div class=\"mx-auto grid w-full max-w-5xl items-center gap-10 lg:grid-cols-2 lg:gap-16\">\n      <div>\n        <p v-if=\"code\" class=\"text-muted-foreground text-sm font-medium\">HTTP {{ code }}</p>\n        <p v-if=\"code\" class=\"mt-3 text-6xl font-semibold tracking-tighter sm:text-7xl\">{{ code }}</p>\n        <h1 class=\"mt-3 text-2xl font-semibold tracking-tight sm:text-3xl\">{{ title }}</h1>\n        <p v-if=\"description\" class=\"text-muted-foreground mt-4 max-w-md text-base\">{{ description }}</p>\n        <div v-if=\"showPrimary || showSecondary || showTertiary\" class=\"mt-8 flex flex-wrap items-center gap-3\">\n          <Button\n            v-if=\"showPrimary\"\n            :as=\"primaryHref ? 'a' : 'button'\"\n            :href=\"primaryHref\"\n            size=\"lg\"\n            :disabled=\"primaryDisabled\"\n            @click=\"onPrimary?.()\"\n          >\n            <RefreshCcw />\n            {{ primaryLabel }}\n          </Button>\n          <Button\n            v-if=\"showSecondary\"\n            :as=\"secondaryHref ? 'a' : 'button'\"\n            :href=\"secondaryHref\"\n            size=\"lg\"\n            variant=\"outline\"\n            :disabled=\"secondaryDisabled\"\n            @click=\"onSecondary?.()\"\n          >\n            {{ secondaryLabel }}\n          </Button>\n          <Button\n            v-if=\"showTertiary\"\n            :as=\"tertiaryHref ? 'a' : 'button'\"\n            :href=\"tertiaryHref\"\n            size=\"lg\"\n            variant=\"ghost\"\n            :disabled=\"tertiaryDisabled\"\n            @click=\"onTertiary?.()\"\n          >\n            {{ tertiaryLabel }}\n            <LifeBuoy />\n          </Button>\n        </div>\n      </div>\n      <div v-if=\"image\" class=\"border-border bg-muted overflow-hidden rounded-xl border\">\n        <img :src=\"image\" :alt=\"imageAlt\" class=\"aspect-[4/3] w-full object-cover\" />\n      </div>\n      <div\n        v-else-if=\"image === undefined\"\n        class=\"border-border bg-muted/40 overflow-hidden rounded-xl border font-mono\"\n        aria-hidden=\"true\"\n      >\n        <div class=\"border-border text-muted-foreground truncate border-b px-3 py-2 text-xs\">POST /api/v1/invoices</div>\n        <div class=\"space-y-1 p-4 text-xs leading-relaxed\">\n          <p>\n            <span class=\"text-muted-foreground\">HTTP/1.1</span>{{ ' ' }}\n            <span class=\"text-destructive\">{{ code || '500' }} Internal Server Error</span>\n          </p>\n          <p class=\"text-muted-foreground\">error: ECONNRESET</p>\n          <p class=\"text-muted-foreground\">at: Worker.run:142</p>\n          <p class=\"text-muted-foreground\">x-request-id: req_8f3c2a</p>\n        </div>\n      </div>\n    </div>\n  </section>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/error-page/Error500.vue"
    },
    {
      "path": "packages/registry-vue/blocks/error-page/ErrorPages.vue",
      "content": "<script setup lang=\"ts\">\nimport type { HTMLAttributes } from 'vue'\nimport { computed } from 'vue'\nimport { Clock, RotateCcw } from 'lucide-vue-next'\nimport { cn } from '@/lib/utils'\nimport { Button } from '@/components/ui/button'\n\nexport type ErrorPagesVariant = '404' | '500' | '403' | 'maintenance'\n\ninterface Props {\n  /** `'all'` renders the full gallery; a single variant renders just that screen. */\n  variant?: ErrorPagesVariant | 'all'\n  size?: 'sm' | 'default'\n  class?: HTMLAttributes['class']\n  title?: string\n  description?: string\n  /** Status numeral. Pass `''` to hide. */\n  code?: string\n  /** Eyebrow pill (maintenance ETA by default). Pass `''` to hide. */\n  tag?: string\n  /** Replaces the HTTP response panel on a single variant. Pass `''` to hide art. */\n  image?: string\n  imageAlt?: string\n  primaryLabel?: string\n  secondaryLabel?: string\n  primaryHref?: string\n  secondaryHref?: string\n  showPrimary?: boolean\n  showSecondary?: boolean\n  primaryDisabled?: boolean\n  secondaryDisabled?: boolean\n  onHome?: () => void\n  onSearch?: () => void\n  onRetry?: () => void\n  onStatus?: () => void\n  onSwitchAccount?: () => void\n  onRequestAccess?: () => void\n  onSubscribe?: () => void\n}\n\nexport type ErrorPagesProps = Props\n\nconst props = withDefaults(defineProps<Props>(), {\n  variant: 'all',\n  size: 'default',\n  imageAlt: '',\n  showPrimary: true,\n  showSecondary: true,\n  primaryDisabled: false,\n  secondaryDisabled: false,\n})\n\nconst show = (v: ErrorPagesVariant) => props.variant === 'all' || props.variant === v\nconst copy = (fallback: string, override?: string) => (override === undefined ? fallback : override)\nconst forVariant = (v: ErrorPagesVariant, fallback: string, override?: string) =>\n  props.variant === v ? copy(fallback, override) : fallback\n\nconst title404 = computed(() => forVariant('404', 'Page not found', props.title))\nconst desc404 = computed(() =>\n  forVariant(\n    '404',\n    \"The page you're looking for doesn't exist or was moved. Check the URL or head back home.\",\n    props.description,\n  ),\n)\nconst code404 = computed(() => forVariant('404', '404', props.code))\nconst image404 = computed(() => forVariant('404', '/illustrations/error-404.jpg', props.image))\nconst primary404 = computed(() => forVariant('404', 'Go home', props.primaryLabel))\nconst secondary404 = computed(() => forVariant('404', 'Search docs', props.secondaryLabel))\n\nconst title500 = computed(() => forVariant('500', 'Internal server error', props.title))\nconst desc500 = computed(() =>\n  forVariant(\n    '500',\n    'Something went wrong on our end. The team has been notified — try again in a moment.',\n    props.description,\n  ),\n)\nconst code500 = computed(() => forVariant('500', '500', props.code))\nconst image500 = computed(() => forVariant('500', '/illustrations/error-500.jpg', props.image))\nconst primary500 = computed(() => forVariant('500', 'Retry', props.primaryLabel))\nconst secondary500 = computed(() => forVariant('500', 'Status page', props.secondaryLabel))\n\nconst title403 = computed(() => forVariant('403', 'Access denied', props.title))\nconst desc403 = computed(() =>\n  forVariant(\n    '403',\n    \"You don't have permission to view this page. Switch accounts or ask an admin to request access.\",\n    props.description,\n  ),\n)\nconst code403 = computed(() => forVariant('403', '403', props.code))\nconst image403 = computed(() => forVariant('403', '/illustrations/error-403.jpg', props.image))\nconst primary403 = computed(() => forVariant('403', 'Request access', props.primaryLabel))\nconst secondary403 = computed(() => forVariant('403', 'Switch account', props.secondaryLabel))\n\nconst title503 = computed(() => forVariant('maintenance', 'Scheduled maintenance', props.title))\nconst desc503 = computed(() =>\n  forVariant('maintenance', \"We're upgrading our systems. The service will be back online shortly.\", props.description),\n)\nconst code503 = computed(() => forVariant('maintenance', '503', props.code))\nconst image503 = computed(() => forVariant('maintenance', '/illustrations/error-maintenance.jpg', props.image))\nconst tag503 = computed(() => forVariant('maintenance', 'Back online around 14:00 UTC', props.tag))\nconst primary503 = computed(() => forVariant('maintenance', 'Subscribe for updates', props.primaryLabel))\nconst secondary503 = computed(() =>\n  props.variant === 'maintenance' ? (props.secondaryLabel ?? '') : (props.secondaryLabel ?? ''),\n)\n\nconst frameClass = computed(() =>\n  cn('border-border bg-card overflow-hidden rounded-xl border text-left', props.size === 'sm' && 'rounded-lg'),\n)\nconst imgClass = 'aspect-[16/10] w-full object-cover'\nconst panelClass = 'border-border bg-muted/40 border-b font-mono'\nconst bodyClass = computed(() => (props.size === 'sm' ? 'p-5' : 'p-6'))\nconst codeClass = computed(() => cn('font-semibold tracking-tighter', props.size === 'sm' ? 'text-2xl' : 'text-4xl'))\nconst titleClass = computed(() =>\n  cn('mt-1.5 font-semibold tracking-tight', props.size === 'sm' ? 'text-base' : 'text-xl'),\n)\nconst descClass = 'text-muted-foreground mt-2 max-w-sm text-sm'\nconst actionsClass = computed(() => cn('flex flex-wrap items-center gap-2', props.size === 'sm' ? 'mt-4' : 'mt-5'))\nconst actionSize = computed(() => (props.size === 'sm' ? 'xs' : 'sm'))\n</script>\n\n<template>\n  <div\n    data-slot=\"error-pages\"\n    :data-size=\"size\"\n    :class=\"cn(variant === 'all' && 'grid gap-4 sm:grid-cols-2', props.class)\"\n  >\n    <article v-if=\"show('404')\" :class=\"frameClass\" data-slot=\"error-page\" data-variant=\"404\" role=\"status\">\n      <img v-if=\"image404\" :src=\"image404\" :alt=\"imageAlt\" :class=\"imgClass\" />\n      <div v-else-if=\"image404 === undefined\" :class=\"panelClass\" aria-hidden=\"true\">\n        <div class=\"border-border text-muted-foreground truncate border-b px-3 py-2 text-xs\">GET /pricing/teams</div>\n        <div class=\"space-y-1 p-3 text-xs leading-relaxed\">\n          <p><span class=\"text-muted-foreground\">HTTP/1.1</span> {{ code404 || '404' }} Not Found</p>\n          <p class=\"text-muted-foreground\">x-request-id: req_9k2e18</p>\n        </div>\n      </div>\n      <div :class=\"bodyClass\">\n        <p v-if=\"code404\" :class=\"codeClass\">{{ code404 }}</p>\n        <h3 :class=\"titleClass\">{{ title404 }}</h3>\n        <p :class=\"descClass\">{{ desc404 }}</p>\n        <p\n          v-if=\"props.variant === '404' && props.tag\"\n          class=\"text-muted-foreground mt-3 inline-flex items-center rounded-full border px-3 py-1 text-xs\"\n        >\n          {{ props.tag }}\n        </p>\n        <div v-if=\"showPrimary || showSecondary\" :class=\"actionsClass\">\n          <Button\n            v-if=\"showPrimary\"\n            :as=\"primaryHref ? 'a' : 'button'\"\n            :href=\"primaryHref\"\n            :size=\"actionSize\"\n            :disabled=\"primaryDisabled\"\n            @click=\"onHome?.()\"\n          >\n            {{ primary404 }}\n          </Button>\n          <Button\n            v-if=\"showSecondary\"\n            :as=\"secondaryHref ? 'a' : 'button'\"\n            :href=\"secondaryHref\"\n            :size=\"actionSize\"\n            variant=\"ghost\"\n            :disabled=\"secondaryDisabled\"\n            @click=\"onSearch?.()\"\n          >\n            {{ secondary404 }}\n          </Button>\n        </div>\n      </div>\n    </article>\n\n    <article v-if=\"show('500')\" :class=\"frameClass\" data-slot=\"error-page\" data-variant=\"500\" role=\"alert\">\n      <img v-if=\"image500\" :src=\"image500\" :alt=\"imageAlt\" :class=\"imgClass\" />\n      <div v-else-if=\"image500 === undefined\" :class=\"panelClass\" aria-hidden=\"true\">\n        <div class=\"border-border text-muted-foreground truncate border-b px-3 py-2 text-xs\">POST /api/v1/invoices</div>\n        <div class=\"space-y-1 p-3 text-xs leading-relaxed\">\n          <p>\n            <span class=\"text-muted-foreground\">HTTP/1.1</span>{{ ' ' }}\n            <span class=\"text-destructive\">{{ code500 || '500' }} Internal Server Error</span>\n          </p>\n          <p class=\"text-muted-foreground\">error: ECONNRESET at Worker.run:142</p>\n        </div>\n      </div>\n      <div :class=\"bodyClass\">\n        <p v-if=\"code500\" :class=\"codeClass\">{{ code500 }}</p>\n        <h3 :class=\"titleClass\">{{ title500 }}</h3>\n        <p :class=\"descClass\">{{ desc500 }}</p>\n        <p\n          v-if=\"props.variant === '500' && props.tag\"\n          class=\"text-muted-foreground mt-3 inline-flex items-center rounded-full border px-3 py-1 text-xs\"\n        >\n          {{ props.tag }}\n        </p>\n        <div v-if=\"showPrimary || showSecondary\" :class=\"actionsClass\">\n          <Button\n            v-if=\"showPrimary\"\n            :as=\"primaryHref ? 'a' : 'button'\"\n            :href=\"primaryHref\"\n            :size=\"actionSize\"\n            :disabled=\"primaryDisabled\"\n            @click=\"onRetry?.()\"\n          >\n            <RotateCcw />\n            {{ primary500 }}\n          </Button>\n          <Button\n            v-if=\"showSecondary\"\n            :as=\"secondaryHref ? 'a' : 'button'\"\n            :href=\"secondaryHref\"\n            :size=\"actionSize\"\n            variant=\"outline\"\n            :disabled=\"secondaryDisabled\"\n            @click=\"onStatus?.()\"\n          >\n            {{ secondary500 }}\n          </Button>\n        </div>\n      </div>\n    </article>\n\n    <article v-if=\"show('403')\" :class=\"frameClass\" data-slot=\"error-page\" data-variant=\"403\" role=\"alert\">\n      <img v-if=\"image403\" :src=\"image403\" :alt=\"imageAlt\" :class=\"imgClass\" />\n      <div v-else-if=\"image403 === undefined\" :class=\"panelClass\" aria-hidden=\"true\">\n        <div class=\"border-border text-muted-foreground truncate border-b px-3 py-2 text-xs\">GET /admin/billing</div>\n        <div class=\"space-y-1 p-3 text-xs leading-relaxed\">\n          <p>\n            <span class=\"text-muted-foreground\">HTTP/1.1</span>{{ ' ' }}\n            <span class=\"text-warning\">{{ code403 || '403' }} Forbidden</span>\n          </p>\n          <p class=\"text-muted-foreground\">scope billing:read — denied for guest</p>\n        </div>\n      </div>\n      <div :class=\"bodyClass\">\n        <p v-if=\"code403\" :class=\"codeClass\">{{ code403 }}</p>\n        <h3 :class=\"titleClass\">{{ title403 }}</h3>\n        <p :class=\"descClass\">{{ desc403 }}</p>\n        <p\n          v-if=\"props.variant === '403' && props.tag\"\n          class=\"text-muted-foreground mt-3 inline-flex items-center rounded-full border px-3 py-1 text-xs\"\n        >\n          {{ props.tag }}\n        </p>\n        <div v-if=\"showPrimary || showSecondary\" :class=\"actionsClass\">\n          <Button\n            v-if=\"showSecondary\"\n            :as=\"secondaryHref ? 'a' : 'button'\"\n            :href=\"secondaryHref\"\n            :size=\"actionSize\"\n            variant=\"outline\"\n            :disabled=\"secondaryDisabled\"\n            @click=\"onSwitchAccount?.()\"\n          >\n            {{ secondary403 }}\n          </Button>\n          <Button\n            v-if=\"showPrimary\"\n            :as=\"primaryHref ? 'a' : 'button'\"\n            :href=\"primaryHref\"\n            :size=\"actionSize\"\n            :disabled=\"primaryDisabled\"\n            @click=\"onRequestAccess?.()\"\n          >\n            {{ primary403 }}\n          </Button>\n        </div>\n      </div>\n    </article>\n\n    <article\n      v-if=\"show('maintenance')\"\n      :class=\"frameClass\"\n      data-slot=\"error-page\"\n      data-variant=\"maintenance\"\n      role=\"status\"\n    >\n      <img v-if=\"image503\" :src=\"image503\" :alt=\"imageAlt\" :class=\"imgClass\" />\n      <div v-else-if=\"image503 === undefined\" :class=\"panelClass\" aria-hidden=\"true\">\n        <div class=\"border-border text-muted-foreground truncate border-b px-3 py-2 text-xs\">GET /health</div>\n        <div class=\"space-y-1 p-3 text-xs leading-relaxed\">\n          <p>\n            <span class=\"text-muted-foreground\">HTTP/1.1</span>{{ ' ' }}\n            <span class=\"text-warning\">{{ code503 || '503' }} Service Unavailable</span>\n          </p>\n          <p class=\"text-muted-foreground\">Retry-After: 3600</p>\n        </div>\n      </div>\n      <div :class=\"bodyClass\">\n        <p v-if=\"code503\" :class=\"codeClass\">{{ code503 }}</p>\n        <h3 :class=\"titleClass\">{{ title503 }}</h3>\n        <p :class=\"descClass\">{{ desc503 }}</p>\n        <p\n          v-if=\"tag503\"\n          class=\"text-muted-foreground mt-3 inline-flex items-center gap-1.5 rounded-full border px-3 py-1 text-xs\"\n        >\n          <Clock class=\"size-3.5\" aria-hidden=\"true\" />\n          {{ tag503 }}\n        </p>\n        <div v-if=\"showPrimary || (showSecondary && secondary503)\" :class=\"actionsClass\">\n          <Button\n            v-if=\"showPrimary\"\n            :as=\"primaryHref ? 'a' : 'button'\"\n            :href=\"primaryHref\"\n            :size=\"actionSize\"\n            variant=\"ghost\"\n            :disabled=\"primaryDisabled\"\n            @click=\"onSubscribe?.()\"\n          >\n            {{ primary503 }}\n          </Button>\n          <Button\n            v-if=\"showSecondary && secondary503\"\n            :as=\"secondaryHref ? 'a' : 'button'\"\n            :href=\"secondaryHref\"\n            :size=\"actionSize\"\n            variant=\"outline\"\n            :disabled=\"secondaryDisabled\"\n            @click=\"onStatus?.()\"\n          >\n            {{ secondary503 }}\n          </Button>\n        </div>\n      </div>\n    </article>\n  </div>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/error-page/ErrorPages.vue"
    }
  ],
  "dependencies": [
    "lucide-vue-next"
  ],
  "devDependencies": [],
  "registryDependencies": [
    "https://uipkge.dev/r/vue/button.json"
  ],
  "description": "Status-screen set with prop-driven 404 and 500 pages plus a four-variant gallery (404, 500, 403, and maintenance) with single-screen, compact-size, and callback controls.",
  "categories": [
    "layout",
    "feedback",
    "marketing",
    "utility"
  ]
}