Renders a link. This basically wraps Phoenix.Component.link/1 with some overridable attributes, in particular class for consistent, DRY link default styling.

attributes

Attributes

• overrides (:list) - Manually set the overrides for this component (instead of config/default). Defaults to nil.

• navigate (:string) - Navigates from a LiveView to a new LiveView. The browser page is kept, but a new LiveView process is mounted and its content on the page is reloaded. It is only possible to navigate between LiveViews declared under the same router Phoenix.LiveView.Router.live_session/3. Otherwise, a full browser redirect is used.

  Defaults to nil.

• patch (:string) - Patches the current LiveView. The handle_params callback of the current LiveView will be invoked and the minimum content will be sent over the wire, as any other LiveView diff.

  Defaults to nil.

• href (:any) - Uses traditional browser navigation to the new location. This means the whole page is reloaded on the browser.

  Defaults to nil.

• method (:string) - The HTTP method to use with the link. This is intended for usage outside of LiveView and therefore only works with the href={...} attribute. It has no effect on patch and navigate instructions. In case the method is not get, the link is generated inside the form which sets the proper information. In order to submit the form, JavaScript must be enabled in the browser.

  Defaults to "get".

• csrf_token (:any) - A boolean or custom token to use for links with an HTTP method other than get. Defaults to true.

• replace (:boolean) - When using :patch or :navigate, should the browser's history be replaced with pushState? (overridable, required)

• class (:any) - Merge/override default classes of the code element (overridable, :tails_classes, required). Global attributes are accepted.

slots

Slots

• inner_block (required) - The content rendered inside of the a tag.

Renders a code block.

attributes

Attributes

• overrides (:list) - Manually set the overrides for this component (instead of config/default). Defaults to nil.
• source (:string) (required) - The code snippet.
• id (:string) (required)
• copy (:boolean) - (overridable, required).
• copy_label (:string) - (overridable, required).
• copy_class (:any) - (overridable, :tails_classes, required).
• copy_message (:string) - (overridable).
• language (:string) - Language of the code snippet. Defaults to "elixir".
• class (:any) - Merge/override default classes of the code element (overridable, :tails_classes, required).

attributes

Attributes

• overrides (:list) - Manually set the overrides for this component (instead of config/default). Defaults to nil.
• id (:string) (required)
• value (:string) (required) - Text to copy.
• label (:string) - Button label, defaults to value. Defaults to nil.
• disabled (:boolean) - Defaults to false.
• icon_name (:string) - The name of the icon to display (nil for none); see icon/1 for details. Defaults to nil.
• ttl (:integer) - How long to show the flash message after copying (overridable, required).
• case (:string) - The case of the text (overridable, required).Must be one of "uppercase", "normal-case", "lowercase", or "capitalize".
• color (:string) - The color of the button (overridable, required).
• shape (:string) - Shape of the button (overridable, required).
• size (:string) - The size of the button (overridable, required).
• variant (:string) - Style of button (overridable, required).
• class (:any) - (overridable, :tails_classes, required).
• message (:string) - Message to display after copying (overridable, required).
• icon_class (:any) - (overridable, :tails_classes, required). Global attributes are accepted.

Renders a navigation link, taking into account whether the URI is the current page.

attributes

Attributes

• overrides (:list) - Manually set the overrides for this component (instead of config/default). Defaults to nil.
• label (:string) (required) - The label of of the link.
• uri (:string) (required) - The URI of the link.
• current_uri (:string) (required) - The current URI of the page.
• is_current (:boolean) - Does :uri match :current_uri? (overridable, required).
• class (:any) - The class of the navigation link (overridable, :tails_classes, required).

A progress element. Styling the progress element is tricky, so this wraps it with some nice conveniences.

attributes

Attributes

• overrides (:list) - Manually set the overrides for this component (instead of config/default). Defaults to nil.
• max (:integer) - Defaults to 100.
• value (:integer) - Defaults to 0.
• color (:string) - The color of the progress bar (overridable, required).
• size (:string) - The size of the progress bar (overridable, required).
• class (:any) - The class of the progress bar (overridable, :tails_classes, required). Global attributes are accepted.

A simple spinner component.

attributes

Attributes

• overrides (:list) - Manually set the overrides for this component (instead of config/default). Defaults to nil.
• show (:boolean) - Show or hide spinner. Defaults to true.
• size (:string) - The size of the spinner (overridable, required).
• class (:any) - (overridable, :tails_classes, required). Global attributes are accepted.

A tooltip component.

• JS hook that "nudges" tooltip into view
• Simple props for tooltip text and custom icon
• Optional slots for icon and/or tooltip content

examples

Examples

<.tooltip id="tooltip-1" tooltip="A default tooltip!" />
<.tooltip id="tooltip-2"
          icon_name="hero-light-bulb-solid"
          tooltip="Custom icon." />
<.tooltip id="tooltip-3">
  <:icon>?</:icon>
  <div class="bg-red-500 text-white p-4 w-48 shadow-lg rounded">
    Custom tooltip slot and custom icon slot.
  </div>
</.tooltip>

attributes

Attributes

• overrides (:list) - Manually set the overrides for this component (instead of config/default). Defaults to nil.
• id (:string) (required)
• tooltip (:string) - Defaults to nil.
• vertical_offset (:string) - (overridable, required).
• horizontal_offset (:string) - (overridable, required).
• tooltip_class (:any) - (overridable, :tails_classes, required).
• tooltip_text_class (:any) - (overridable, :tails_classes, required).
• icon_class (:any) - (overridable, :tails_classes).
• icon_name (:string) - The name of the icon; see icon/1 for details (overridable, required).
• class (:any) - (overridable, :tails_classes, required).

slots

Slots

• icon
• inner_block