{
  "plugins": [
    "react",
    "import"
  ],
  "rules": {
    "react/forbid-elements": [
      "warn",
      {
        "forbid": []
      }
    ],
    "no-restricted-imports": [
      "warn",
      {
        "patterns": [
          {
            "group": [
              "components/cards/**",
              "components/core/**",
              "components/data/**",
              "components/layout/**",
              "components/navigation/**",
              "components/product/**",
              "ui_kits/ebay-listing/**"
            ],
            "message": "Import design-system components from 'index.js', not component internals."
          }
        ]
      }
    ],
    "no-restricted-syntax": [
      "warn",
      {
        "selector": "Literal[value=/#[0-9a-fA-F]{3,8}\\b/]",
        "message": "Raw hex color — use a design-system color token via var()."
      },
      {
        "selector": "Literal[value=/\\b\\d+px\\b/]",
        "message": "Raw px value — use a design-system spacing token via var()."
      },
      {
        "selector": "Literal[value=/font-family\\s*:\\s*(?!['\\\"]?(?:Inter|Oswald))/i]",
        "message": "Font not provided by the design system. Available: Inter, Oswald."
      },
      {
        "selector": "JSXOpeningElement[name.name='AppHeader'] > JSXAttribute > JSXIdentifier[name!=/^(?:brand|cartCount|key|ref|className|style|children)$/]",
        "message": "<AppHeader> doesn't accept that prop. Declared props: brand, cartCount."
      },
      {
        "selector": "JSXOpeningElement[name.name='Badge'] > JSXAttribute > JSXIdentifier[name!=/^(?:shape|tone|icon|children|style|key|ref|className|style|children)$/]",
        "message": "<Badge> doesn't accept that prop. Declared props: shape, tone, icon, children, style."
      },
      {
        "selector": "JSXOpeningElement[name.name='Badge'] > JSXAttribute[name.name='shape'] > Literal[value!=/^(?:pill|ribbon)$/]",
        "message": "<Badge> shape must be one of 'pill' | 'ribbon'."
      },
      {
        "selector": "JSXOpeningElement[name.name='Badge'] > JSXAttribute[name.name='tone'] > Literal[value!=/^(?:brand|dark)$/]",
        "message": "<Badge> tone must be one of 'brand' | 'dark'."
      },
      {
        "selector": "JSXOpeningElement[name.name='BottomTabBarItem'] > JSXAttribute > JSXIdentifier[name!=/^(?:icon|label|key|ref|className|style|children)$/]",
        "message": "<BottomTabBarItem> doesn't accept that prop. Declared props: icon, label."
      },
      {
        "selector": "JSXOpeningElement[name.name='Button'] > JSXAttribute > JSXIdentifier[name!=/^(?:variant|size|fullWidth|disabled|icon|children|onClick|style|key|ref|className|style|children)$/]",
        "message": "<Button> doesn't accept that prop. Declared props: variant, size, fullWidth, disabled, icon, children, onClick, style."
      },
      {
        "selector": "JSXOpeningElement[name.name='Button'] > JSXAttribute[name.name='variant'] > Literal[value!=/^(?:primary|secondary|ghost|onNavy)$/]",
        "message": "<Button> variant must be one of 'primary' | 'secondary' | 'ghost' | 'onNavy'."
      },
      {
        "selector": "JSXOpeningElement[name.name='Button'] > JSXAttribute[name.name='size'] > Literal[value!=/^(?:md|lg)$/]",
        "message": "<Button> size must be one of 'md' | 'lg'."
      },
      {
        "selector": "JSXOpeningElement[name.name='FaqItem'] > JSXAttribute > JSXIdentifier[name!=/^(?:question|answer|key|ref|className|style|children)$/]",
        "message": "<FaqItem> doesn't accept that prop. Declared props: question, answer."
      },
      {
        "selector": "JSXOpeningElement[name.name='HeroBanner'] > JSXAttribute > JSXIdentifier[name!=/^(?:badge|title|subtitle|key|ref|className|style|children)$/]",
        "message": "<HeroBanner> doesn't accept that prop. Declared props: badge, title, subtitle."
      },
      {
        "selector": "JSXOpeningElement[name.name='Icon'] > JSXAttribute > JSXIdentifier[name!=/^(?:name|size|color|className|style|key|ref|className|style|children)$/]",
        "message": "<Icon> doesn't accept that prop. Declared props: name, size, color, className, style."
      },
      {
        "selector": "JSXOpeningElement[name.name='IconFeatureCard'] > JSXAttribute > JSXIdentifier[name!=/^(?:icon|label|description|size|key|ref|className|style|children)$/]",
        "message": "<IconFeatureCard> doesn't accept that prop. Declared props: icon, label, description, size."
      },
      {
        "selector": "JSXOpeningElement[name.name='IconFeatureCard'] > JSXAttribute[name.name='size'] > Literal[value!=/^(?:md|lg)$/]",
        "message": "<IconFeatureCard> size must be one of 'md' | 'lg'."
      },
      {
        "selector": "JSXOpeningElement[name.name='NoticeCard'] > JSXAttribute > JSXIdentifier[name!=/^(?:icon|title|children|key|ref|className|style|children)$/]",
        "message": "<NoticeCard> doesn't accept that prop. Declared props: icon, title, children."
      },
      {
        "selector": "JSXOpeningElement[name.name='OfferCardFeature'] > JSXAttribute > JSXIdentifier[name!=/^(?:icon|text|key|ref|className|style|children)$/]",
        "message": "<OfferCardFeature> doesn't accept that prop. Declared props: icon, text."
      },
      {
        "selector": "JSXOpeningElement[name.name='ProductGalleryImage'] > JSXAttribute > JSXIdentifier[name!=/^(?:src|alt|key|ref|className|style|children)$/]",
        "message": "<ProductGalleryImage> doesn't accept that prop. Declared props: src, alt."
      },
      {
        "selector": "JSXOpeningElement[name.name='SiteFooter'] > JSXAttribute > JSXIdentifier[name!=/^(?:brand|links|copyrightYear|key|ref|className|style|children)$/]",
        "message": "<SiteFooter> doesn't accept that prop. Declared props: brand, links, copyrightYear."
      },
      {
        "selector": "JSXOpeningElement[name.name='SpecTableRow'] > JSXAttribute > JSXIdentifier[name!=/^(?:label|value|key|ref|className|style|children)$/]",
        "message": "<SpecTableRow> doesn't accept that prop. Declared props: label, value."
      },
      {
        "selector": "JSXOpeningElement[name.name='VehicleFilterBar'] > JSXAttribute > JSXIdentifier[name!=/^(?:vehicleLabel|filters|cta|onCta|key|ref|className|style|children)$/]",
        "message": "<VehicleFilterBar> doesn't accept that prop. Declared props: vehicleLabel, filters, cta, onCta."
      }
    ]
  },
  "overrides": [
    {
      "files": [
        "**/index.js"
      ],
      "rules": {
        "no-restricted-imports": "off"
      }
    }
  ],
  "x-omelette": {
    "components": {
      "AppHeader": {
        "replaces": []
      },
      "Badge": {
        "replaces": []
      },
      "BottomTabBarItem": {
        "replaces": []
      },
      "Button": {
        "replaces": []
      },
      "FaqItem": {
        "replaces": []
      },
      "HeroBanner": {
        "replaces": []
      },
      "Icon": {
        "replaces": []
      },
      "IconFeatureCard": {
        "replaces": []
      },
      "NoticeCard": {
        "replaces": []
      },
      "OfferCardFeature": {
        "replaces": []
      },
      "ProductGalleryImage": {
        "replaces": []
      },
      "SiteFooter": {
        "replaces": []
      },
      "SpecTableRow": {
        "replaces": []
      },
      "VehicleFilterBar": {
        "replaces": []
      }
    },
    "tokens": [
      "--action-primary-bg",
      "--action-primary-bg-active",
      "--action-primary-bg-hover",
      "--action-secondary-bg-hover",
      "--action-secondary-border",
      "--blue-100",
      "--blue-200",
      "--blue-400",
      "--blue-50",
      "--blue-500",
      "--blue-600",
      "--blue-700",
      "--blue-800",
      "--blue-900",
      "--border-brand",
      "--border-strong",
      "--border-subtle",
      "--focus-ring",
      "--font-condensed",
      "--font-sans",
      "--font-weight-bold",
      "--font-weight-extrabold",
      "--font-weight-medium",
      "--font-weight-regular",
      "--font-weight-semibold",
      "--ink-100",
      "--ink-300",
      "--ink-500",
      "--ink-700",
      "--ink-800",
      "--ink-900",
      "--label-letter-spacing",
      "--navy-800",
      "--navy-900",
      "--periwinkle-100",
      "--periwinkle-200",
      "--periwinkle-500",
      "--periwinkle-600",
      "--radius-lg",
      "--radius-md",
      "--radius-pill",
      "--radius-sm",
      "--radius-thumb",
      "--radius-xl",
      "--shadow-brand-glow",
      "--shadow-card",
      "--shadow-card-hover",
      "--shadow-inset-border",
      "--shadow-popover",
      "--space-1",
      "--space-10",
      "--space-12",
      "--space-16",
      "--space-2",
      "--space-20",
      "--space-24",
      "--space-3",
      "--space-4",
      "--space-5",
      "--space-6",
      "--space-8",
      "--surface-0",
      "--surface-1",
      "--surface-2",
      "--surface-brand",
      "--surface-card",
      "--surface-card-alt",
      "--surface-inverse",
      "--surface-page",
      "--surface-premium-gradient",
      "--surface-premium-solid",
      "--surface-section",
      "--text-body",
      "--text-body-lg",
      "--text-body-sm",
      "--text-caption",
      "--text-display",
      "--text-h1",
      "--text-h2",
      "--text-h3",
      "--text-heading",
      "--text-label",
      "--text-label-brand",
      "--text-muted",
      "--text-on-brand",
      "--text-on-premium",
      "--text-on-premium-muted",
      "--text-wordmark"
    ],
    "tokenKinds": {
      "--blue-900": "color",
      "--blue-800": "color",
      "--blue-700": "color",
      "--blue-600": "color",
      "--blue-500": "color",
      "--blue-400": "color",
      "--blue-200": "color",
      "--blue-100": "color",
      "--blue-50": "color",
      "--periwinkle-600": "color",
      "--periwinkle-500": "color",
      "--periwinkle-200": "color",
      "--periwinkle-100": "color",
      "--navy-900": "color",
      "--navy-800": "color",
      "--ink-900": "color",
      "--ink-800": "color",
      "--ink-700": "color",
      "--ink-500": "color",
      "--ink-300": "color",
      "--ink-100": "color",
      "--surface-0": "color",
      "--surface-1": "color",
      "--surface-2": "color",
      "--surface-inverse": "color",
      "--border-subtle": "color",
      "--border-strong": "color",
      "--border-brand": "color",
      "--text-heading": "font",
      "--text-body": "font",
      "--text-muted": "font",
      "--text-label-brand": "font",
      "--text-on-brand": "font",
      "--surface-page": "color",
      "--surface-section": "color",
      "--surface-card": "color",
      "--surface-card-alt": "color",
      "--surface-brand": "color",
      "--action-primary-bg": "color",
      "--action-primary-bg-hover": "color",
      "--action-primary-bg-active": "color",
      "--action-secondary-border": "color",
      "--action-secondary-bg-hover": "color",
      "--focus-ring": "color",
      "--surface-premium-solid": "color",
      "--surface-premium-gradient": "color",
      "--text-on-premium": "font",
      "--text-on-premium-muted": "font",
      "--font-sans": "font",
      "--font-condensed": "font",
      "--text-wordmark": "font",
      "--text-display": "font",
      "--text-h1": "font",
      "--text-h2": "font",
      "--text-h3": "font",
      "--text-body-lg": "font",
      "--text-body-sm": "font",
      "--text-label": "font",
      "--text-caption": "font",
      "--label-letter-spacing": "font",
      "--font-weight-regular": "font",
      "--font-weight-medium": "font",
      "--font-weight-semibold": "font",
      "--font-weight-bold": "font",
      "--font-weight-extrabold": "font",
      "--space-1": "spacing",
      "--space-2": "spacing",
      "--space-3": "spacing",
      "--space-4": "spacing",
      "--space-5": "spacing",
      "--space-6": "spacing",
      "--space-8": "spacing",
      "--space-10": "spacing",
      "--space-12": "spacing",
      "--space-16": "spacing",
      "--space-20": "spacing",
      "--space-24": "spacing",
      "--radius-sm": "radius",
      "--radius-md": "radius",
      "--radius-lg": "radius",
      "--radius-xl": "radius",
      "--radius-pill": "radius",
      "--radius-thumb": "radius",
      "--shadow-card": "shadow",
      "--shadow-card-hover": "shadow",
      "--shadow-popover": "shadow",
      "--shadow-brand-glow": "shadow",
      "--shadow-inset-border": "shadow"
    },
    "fontFamilies": [
      "Inter",
      "Oswald"
    ]
  }
}