@carsxe/ui

CarsXE components for React, Vue, Svelte, and Solid. The package currently includes the Instant Offer, Lien & Theft, and Vehicle Specs lead-generation widgets.

npm install @carsxe/ui

Import only the framework subpath your app uses. Each subpath includes the CarsXE widget runtime.

React

import { Widget } from "@carsxe/ui/react";

export function TradeIn() {
  return <Widget type="instant-offer" apiKey="cxw_YOUR_WIDGET_KEY" />;
}

Vue

<script setup>
import { Widget } from "@carsxe/ui/vue";
</script>

<template>
  <Widget type="specs" api-key="cxw_YOUR_WIDGET_KEY" />
</template>

Vue accepts native class attributes as well as the cross-framework className prop.

Svelte

<script>
  import { Widget } from "@carsxe/ui/svelte";
</script>

<Widget type="lien-theft" apiKey="cxw_YOUR_WIDGET_KEY" />

The Svelte entry ships a precompiled Svelte 5 component (legacy syntax). Import @carsxe/ui/svelte as a finished component — it does not publish .svelte source for your bundler to recompile.

Solid

import { Widget } from "@carsxe/ui/solid";

export function Specs() {
  return <Widget type="specs" apiKey="cxw_YOUR_WIDGET_KEY" />;
}

Widget keys are public, domain-locked keys created in the CarsXE dashboard. HTML and website-builder integrations should continue using the script snippet provided by the dashboard.

Publishing

Set the package version, then tag and push the matching release:

git tag [email protected]
git push origin [email protected]