Material-foundation

That’s a bug in material components. According to the ES2016 module spec all module links must be defined at the top level. Some older libs did things stupid, but if you are running in proper ES2016 module spec then it needs to be at the top level. Run older otherwise (babel is pluggable like that).

If you are bringing it in via brunch then I bet you did not expose it globally in brunch. By default brunch sandboxes all the modules to not touch global things, as they really really should not do so, and instead you should do something like require("material-components-web").autoInit(); or from where-ever it exposes it. If you really really want it globally (always poor form in my opinion) then you can add an option like this in the brunch config file, this is for jquery for example:

  npm: {
    enabled: true,
    globals: {
      $: 'jquery',
      jQuery: 'jquery'
    }
  }

That will bind the jquery module to the window.$ and window.jQuery variables for example. But again globals are bad form.[quote=“shotleybuilder, post:3, topic:8692”]
But then I realised I could just implement the classes like I’d done with mdl (duh!). Here’s a select using the phoenix helper:
[/quote]

I use a TON of helpers. Like my Surface.ex file has gotten quite sizeable at 341 lines so far, with a couple of gems like this (because some people at work are really really weird and like their dates formatted in a wtf way, I don’t get this format…):

  def format_date_wrong(%{year: year, month: month, day: day}) do
    year = String.pad_leading(to_string(year), 4, "0")
    month = String.pad_leading(to_string(month), 2, "0")
    day = String.pad_leading(to_string(day), 2, "0")
    "#{month}/#{day}/#{year}"
  end

But also a lot of useful stuff like:

  def collapsible(unique_id, opts \\ [], [do: body]) do
    title = Keyword.get(opts, :title, humanize(unique_id))
    class = Keyword.get(opts, :class, "")
    ~E"""
    <input type="checkbox" id="collapsible-<%= unique_id %>">
    <label for="collapsible-<%= unique_id %>"><%= title %></label>
    <div class="<%= class %> collapsible-<%= unique_id %>-area">
      <%= body %>
    </div>
    """
  end

And so forth. :slight_smile:

But yeah, all of what you did had nothing to do with Phoenix except the helper you made. ^.^

Ah, that would be the module name that you’d want to import, or put in the global section. :slight_smile: