<Layout::Resource::Card ...attributes as |Card|>
    <Card.header class="{{@headerClass}}">
        <RegistryYield @registry="fleet-ops:component:vehicle:card:header:start" as |RegistryComponent|>
            <RegistryComponent @order={{@resource}} @resource={{@resource}} />
        </RegistryYield>
        <div class="font-semibold w-full truncate">{{or @resource.name @resource.yearMakeModel}}</div>
        <div class="text-gray-400 dark:text-gray-500 text-sm w-full truncate">{{or @resource.plate_number @resource.vin @resource.serial_number @resource.call_sign @resource.public_id}}</div>
        {{#if (has-block "header")}}
            {{yield to="header"}}
        {{/if}}
        <RegistryYield @registry="fleet-ops:component:vehicle:card:header:end" as |RegistryComponent|>
            <RegistryComponent @order={{@resource}} @resource={{@resource}} />
        </RegistryYield>
    </Card.header>
    <Card.body class={{@bodyClass}}>
        <Image src={{@resource.photo_url}} class="card-img-lg" />
        {{#if (has-block "body")}}
            {{yield to="body"}}
        {{/if}}
    </Card.body>
    <Card.footer class={{@footerClass}}>
        <RegistryYield @registry="fleet-ops:component:vehicle:card:footer:start" as |RegistryComponent|>
            <RegistryComponent @order={{@resource}} @resource={{@resource}} />
        </RegistryYield>
        <div class="flex flex-row items-center space-x-1">
            <Button @icon="eye" @size="xs" @onClick={{fn this.vehicleActions.transition.view @resource}} />
            <Button @icon="pencil" @size="xs" @onClick={{fn this.vehicleActions.transition.edit @resource}} />
            <Button @icon="trash" @size="xs" @type="danger" @onClick={{fn this.vehicleActions.delete @resource}} />
        </div>
        <RegistryYield @registry="fleet-ops:component:vehicle:card:footer:end" as |RegistryComponent|>
            <RegistryComponent @order={{@resource}} @resource={{@resource}} />
        </RegistryYield>
        {{#if (has-block "footer")}}
            {{yield to="footer"}}
        {{/if}}
        <div class="mt-1.5">
            <div class="text-gray-400 dark:text-gray-500 text-xs">Last Modified: {{@resource.updatedAt}}</div>
        </div>
    </Card.footer>
</Layout::Resource::Card>
{{yield}}