Code Monkey home page Code Monkey logo

nova-email-field's Introduction

Laravel Nova Email Field

An email input and mailto link field for Laravel Nova. Version 2.0 now supports Nova 4.0 and Vue 3.0!

Latest Version on Packagist Total Downloads

Installation

Install the package into a Laravel app that uses Nova with Composer:

composer require inspheric/nova-email-field

Usage

Add the field to your resource in the fields method:

use Inspheric\Fields\Email;

Email::make('Email')
    ->rules('email', /* ... */),

The field extends the Laravel\Nova\Fields\Text field, so all the usual methods are available.

Now supports readonly, placeholder and overriding the default type="email" if you prefer not to have the validation in the browser. This is from the standard Nova Text field so is not documented here.

It is recommended that you include the standard email validation rule, as it is not automatically added.

Options

Clickable

Make the field display as a mailto link on the detail page:

Email::make('Email')
    ->clickable(),

Clickable on Index

Make the field display as a mailto link on the index page:

Email::make('Email')
    ->clickableOnIndex(),

Always Clickable

Combination of the two functions above for simplicity:

Email::make('Email')
    ->alwaysClickable(),

Appearance

Index (default)

index-field

The field is displayed as a plain <span> element. If the field value is blank, an em dash will be displayed.

Index (clickable)

index-field-clickable

The field is displayed as an <a href="mailto:..."> element with an icon. If the field value is blank, an em dash will be displayed instead of a link.

Detail (default)

detail-field

The field is displayed as a plain <span> element. If the field value is blank, an em dash will be displayed.

Detail (clickable)

detail-field-clickable

The field is displayed as an <a href="mailto:..."> element with an icon. If the field value is blank, an em dash will be displayed instead of a link.

Form

form-field

The field is displayed as an <input type="email"> element.

nova-email-field's People

Contributors

kitbs avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

Forkers

aejnsn

nova-email-field's Issues

Renders to nothing in Nova 4

This seems to have broken in Nova 4. When I set up an email field as a standard Text type, it appears fine, but when I switch it to this package, the field (including its title) is not rendered at all. I have seen similar effects after upgrading to Nova 4 with other packages too, so I suspect you're running into the same problem, though I don't know what it is.

Feature: check valid MX records for domain

Users are not very smart and can make a mistake when entering emails, for example, specify a nonexistent domain. This can be verified by checking the MX records of the domain.

Don't show email icon if email is empty

Hello,

thank you for the clickableOnIndex() !

Perhaps a small improvement would be to not show the Email icon if the field is empty, and rather this dash โ€” in the detail view as Nova does it by default.

Redirecting to empty tab.

When field is set up as clickable, after clicking email address new browser tab is open. How to open email app instead ?

Bold link

The link style deviates a bit from the usual links that are displayed on the index pages, like for belongsTo relations. Would be cool to have the ability to display the url with font-weight: bold

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.