Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[feature] Pass component module as slot name #128

Open
mhanberg opened this issue May 23, 2021 · 0 comments
Open

[feature] Pass component module as slot name #128

mhanberg opened this issue May 23, 2021 · 0 comments
Labels
enhancement New feature or request

Comments

@mhanberg
Copy link
Owner

It would be cool to be able to pass a component as the slot name, allowing easier composition of shared markup.

Now

defmodule TempleExampleWeb.Components.LinkList do
  import Temple.Component

  defcomp Item do
    a class: "text-blue-500 hover:underline", href: @url do
      slot :default
    end
  end

  render do
    for {social, url} <- @socials do
      li do
        span do
          slot :link, url: url, text: social
        end
      end
    end
  end
end

# usage
c LinkList, socials: @user.socials do
  slot :link, %{text: text, url: url} do
    c LinkList.Item, url: url do
      text
    end
  end
end

Then

defmodule TempleExampleWeb.Components.LinkList do
  import Temple.Component

  defcomp Item do
    a class: "text-blue-500 hover:underline", href: @url do
      slot :default, text: @text
    end
  end

  render do
    for {social, url} <- @socials do
      li do
        span do
          slot LinkList.Item, url: url, text: social
        end
      end
    end
  end
end

# usage
c LinkList, socials: @user.socials do
  slot LinkList.Item, %{text: text} do
    text
  end
end

Something like that at least

@mhanberg mhanberg added the enhancement New feature or request label May 27, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

1 participant