marshmallow/nova-tooltip-field

This Laravel Nova field enables you to make use of the default Nova Tooltip component.

1.2.0 2025-02-08 10:48 UTC

This package is auto-updated.

Last update: 2025-02-08 10:48:46 UTC


README

Version Issues Licence

Laravel Nova Totals footer

This Laravel Nova field enables you to make use of the default Nova Tooltip component.

Screenshot

Requirements

  • php: ^8.1
  • laravel/nova: ^5.0

Installation

Install via composer:

composer require marshmallow/nova-tooltip-field

Usage

The usage is extreamly simple. You just call the field as you whould any other Nova Field. The example below is the same as we have used to create the screenshot on top of this page.

NovaTooltipField::make('Tooltip Demo')
    ->resolveUsing(function ($value) {
        return '<strong>Demo</strong><br/>How awesome is this?';
    })
    ->tooltip('Hover me!')
    ->tooltipIcon('information-circle')
    ->tooltipIconType('outline');

Options

All the options that are available on the Nova Tooltip component can be set via the methods listed below.

Options with a little bit more context

tooltipIcon

The tooltipIcon method will accept a string, being an icon name, or it will accept a callable where you can "calculate" the icon you want to use. E.g.

->tooltipIcon(function () {
    return $this->field_01 > 0 ? 'arrow-up' : 'arrow-down';
})

tooltipTriggerTextStyling and tooltipTriggerIconStyling

The tooltipTriggerTextStyling and tooltipTriggerIconStyling methods will accept a string, being a class name, or it will accept a callable where you can "calculate" the class you want to use. The second parameter of this method tells the tooltip if we need to use this value as a class or as an inline styling. By default this method will use your value as classes, set the as_inline_style to true and it will use inline styling.

/** Set the text color for the tooltip trigger text */
->tooltipTriggerTextStyling(function () {
    return 'color:#ff133b;';
}, asInlineStyle: true)

/** Set the text color for the tooltip trigger icon */
->tooltipTriggerIconStyling(function () {
    return 'text-red-500';
}, asInlineStyle: false)

Licence

The MIT License (MIT). Please see License File for more information.

💖 Sponsorships

If you are reliant on this package in your production applications, consider sponsoring us! It is the best way to help us keep doing what we love to do: making great open source software.

Contributing

Feel free to suggest changes, ask for new features or fix bugs yourself. We're sure there are still a lot of improvements that could be made, and we would be very happy to merge useful pull requests.

Special thanks to

Made with ❤️ for open source

At Marshmallow we use a lot of open source software as part of our daily work. So when we have an opportunity to give something back, we're super excited!

We hope you will enjoy this small contribution from us and would love to hear from you if you find it useful in your projects. Follow us on Twitter for more updates!