Running ember install ember-cli-materialize on ember-cli 0.2.3 results in the following error:

The `ember generate` command requires an entity name to be specified. For more details, use `ember help`.

Full output:

version: 0.2.3
Installed packages for tooling via npm.
installing
Installing browser packages via Bower...
  cached git://github.com/Dogfalo/materialize.git#0.96.1
Installed browser packages via Bower.
  identical app/styles/app.scss
  identical app/templates/application.hbs
  identical config/environment.js
  install package ember-radio-button
Installed packages for tooling via npm.
  install package ember-new-computed
Installed packages for tooling via npm.
  install package ember-key-responder
Installed packages for tooling via npm.
  install package ember-modal-dialog
Installed packages for tooling via npm.
  install package ember-cli-sass
Installing packages for tooling via npm`darwin-x64-node-0.12` exists; testing
Binary is fine; exiting
Installed packages for tooling via npm.
installing
The `ember generate` command requires an entity name to be specified. For more details, use `ember help`.

The following Materialize code registers various listeners, which should be torn down in the component's willDestroyElement hook

this.$('.parallax').parallax();

Potentially this will entail adding some "cleanup" methods to the Materialize project, which can then be called by this component

For all components we will add an ember component:

Forms

• Form
• Input Fields
• Textareas
• Select
• Radio Buttons
• Checkboxes
• Range
• Date Picker

Buttons

• Raised
• Floating
• Flat
• Submit
• Large
• Disabled

Navbar

• Navbar with Mobile Collapse Button

Cards

• Basic Card
• Image Card
• Card Reveal
• Card Panel

Content

• Preloader
• Collections
• Badges
• Images
• Tables
• Footer

Javascript

• Collapsible
• Toasts
• Tooltips
• Modals
• Dropdowns
• Material Box
• Material Box with captions
• Slider
• Fullscreen Slider

The following code in the {{md-select}} component registers some listeners when the Materialize javascript is called

this.$('select').material_select();

Anything registered by this code needs to be cleaned up in the component's willDestroyElement hook

An action is not fired If I try to do something like:

{{md-switch checked=switchValue onLabel="Sell" offLabel="Buy" action="toggleTradeMode"}}

I've added a few lines of code to fix this. If you approve of the feature & the method, I'll be happy to follow the contribution guidelines and submit a PR. Please let me know :D

Change: master...kvnn:patch-1

The select component and date picker style seem to be broken in Safari and some in Chrome.
When you select anything or a date, it overlaps the label. Example in Chrome:

http://sgasser.github.io/ember-cli-materialize/#/forms

Things that are insufficiently documented

• Combining a bunch of elements to build a form
• Update example of how to use the form components with ember-validations

When I run ember install:addon ember-cli-materialize in a newly created ember 0.2.0 project.

The first problem encountered is jQuery incompatibility:

 conflict Unable to find suitable version for jquery
    1) jquery ^1.11.1
    2) jquery >=2.1.1
    3) jquery >= 1.7.0 < 2.2.0

Afterwards, no matter what I choose:

module.js:355
  Module._extensions[extension](this, filename);
                               ^
Error: Module did not self-register.
    at Error (native)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/private/tmp/blap/node_modules/ember-cli-sass/node_modules/broccoli-sass/node_modules/node-sass/lib/index.js:181:15)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
[email protected] postinstall: `node scripts/build.js`
Exit status 1
Error: [email protected] postinstall: `node scripts/build.js`
Exit status 1
    at EventEmitter.<anonymous> (/private/tmp/blap/node_modules/ember-cli/node_modules/npm/lib/utils/lifecycle.js:213:16)
    at EventEmitter.emit (events.js:110:17)
    at ChildProcess.<anonymous> (/private/tmp/blap/node_modules/ember-cli/node_modules/npm/lib/utils/spawn.js:14:12)
    at ChildProcess.emit (events.js:110:17)
    at maybeClose (child_process.js:1008:16)
    at Process.ChildProcess._handle.onexit (child_process.js:1080:5)

I'm writing an app that uses ember-cli-materialize heavily, and it's getting tiresome writing very long helper names. I propose that we change them all to

{{md-* }}

and even go so far as to abbreviate button to btn, etc... Particular with the composable components like {{materialize-card}}, it ends up being quite verbose.

Example:

{{#materialize-card title="Login"}}
  {{#materialize-card-content}}
    {{materialize-input
      type="email"
      label="Email"
      value=email}}

    {{materialize-input
      type="password"
      label="Password"
      value=password}}
  {{/materialize-card-content}}
  {{#materialize-card-action}}
    <button class="btn btn-default" {{action 'doLogin'}}>Login</button>
  {{/materialize-card-action}}
{{/materialize-card}}

Proposed approach

Pre v1.0

Map each component from the /addon folder into the /app folder twice

• once as app/components/materialize-*
• once as app/components/md-*.

A deprecation warning could be added to the {{materialize-* }} components, to encourage people to shift to the new syntax.

1.0.x

Remove all of the old stuff

Currently it only supports a subset of the options available on the {{input}} helper. In #37 I removed the hardcoded type="text" and mapped a few attributes specific to numeric inputs onto the {{input}}, but we need to go further in order to properly support the full range of behavior available on HTML5 inputs

I'm proposing an API for the materialize footer, so I can get some input from others before I get started. What we're trying to create is something that looks like this

Which is generated from the following HTML

<footer class="page-footer">
  <div class="container">
    <div class="row">
      <div class="col l6 s12">
        <h5 class="white-text">Footer Content</h5>
        <p class="grey-text text-lighten-4">You can use rows and columns here to organize your footer content.</p>
      </div>
      <div class="col l4 offset-l2 s12">
        <h5 class="white-text">Links</h5>
        <ul>
          <li><a class="grey-text text-lighten-3" href="#!">Link 1</a></li>
          <li><a class="grey-text text-lighten-3" href="#!">Link 2</a></li>
          <li><a class="grey-text text-lighten-3" href="#!">Link 3</a></li>
          <li><a class="grey-text text-lighten-3" href="#!">Link 4</a></li>
        </ul>
      </div>
    </div>
  </div>
  <div class="footer-copyright">
    <div class="container">
    © 2014 Copyright Text
    <a class="grey-text text-lighten-4 right" href="#!">More Links</a>
    </div>
  </div>
</footer>

I propose the following handlebars markup

{{#materialize-footer subfooterView="myFooterViewClass"}}
  <div class="col l6 s12">
    <h5 class="white-text">Footer Content</h5>
    <p class="grey-text text-lighten-4">You can use rows and columns here to organize your footer content.</p>
  </div>
  <div class="col l4 offset-l2 s12">
    <h5 class="white-text">Links</h5>
    <ul>
      <li><a class="grey-text text-lighten-3" href="#!">Link 1</a></li>
      <li><a class="grey-text text-lighten-3" href="#!">Link 2</a></li>
      <li><a class="grey-text text-lighten-3" href="#!">Link 3</a></li>
      <li><a class="grey-text text-lighten-3" href="#!">Link 4</a></li>
    </ul>
  </div>
{{/materialize-footer}}

Here I am regarding the "copyright footer" as a separate view, which would default to a plain copyright notice with the current year as the date. Setting subfooterView to null should remove the copyright footer entirely

 © 2015, All Rights Reserved

In order to allow for consuming applications to extend the components and to adhere to the ember component blueprint conventions (when generating a component in an addon project) the component internals should be moved to the addon directory and the component in the app directory should simply export the import from the addon directory.
Run the "ember g component" blueprint for an example of what I mean here.

Without this refactor, the following (for example) is not possible:

import MaterializeButton from 'ember-cli-materialize/components/materialize-button';

export default MaterializeButton.extend({
    attributeBindings: ['href']
});

Which results in the following error:

Uncaught Error: Could not find module `ember-cli-materialize/components/materialize-button` imported from `mat2/components/my-button`

sorry bad repo

I'm getting the following error when I start up ember cli with 0.9.0, and 0.8.1. I had been on ^0.3.1 before... not sure exactly which version. But it had been working.

version: 0.1.15
Missing template processor
Error: Missing template processor
  at module.exports.preprocessTemplates (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/preprocessors.js:83:11)
  at Class.Addon.compileTemplates (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/models/addon.js:356:12)
  at Class.Addon.compileAddon (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/models/addon.js:378:28)
  at Class.Addon.treeForAddon (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/models/addon.js:304:24)
  at Class._treeFor (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/models/addon.js:211:31)
  at Class.treeFor (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/models/addon.js:184:19)
  at EmberApp.<anonymous> (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/broccoli/ember-app.js:299:20)
  at Array.map (native)
  at EmberApp.addonTreesFor (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/broccoli/ember-app.js:297:30)
  at EmberApp._addonTree (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/broccoli/ember-app.js:589:38)
  at EmberApp._processedVendorTree (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/broccoli/ember-app.js:644:29)
  at EmberApp._processedExternalTree (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/broccoli/ember-app.js:674:21)
  at EmberApp.appAndDependencies (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/broccoli/ember-app.js:761:32)
  at EmberApp.javascript (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/broccoli/ember-app.js:814:34)
  at EmberApp.toArray (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/broccoli/ember-app.js:1115:10)
  at EmberApp.toTree (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/broccoli/ember-app.js:1137:30)
  at Object.<anonymous> (/Users/bmckay/Ember/mystics/Brocfile.js:20:22)
  at Module._compile (module.js:456:26)
  at Object.Module._extensions..js (module.js:474:10)
  at Module.load (module.js:356:32)
  at Function.Module._load (module.js:312:12)
  at Module.require (module.js:364:17)
  at require (module.js:380:17)
  at Object.loadBrocfile (/Users/bmckay/Ember/mystics/node_modules/ember-cli/node_modules/broccoli/lib/builder.js:147:14)
  at Class.module.exports.Task.extend.setupBroccoliBuilder (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/models/builder.js:20:29)
  at Class.module.exports.Task.extend.init (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/models/builder.js:34:10)
  at new Class (/Users/bmckay/Ember/mystics/node_modules/ember-cli/node_modules/core-object/core-object.js:18:12)
  at Class.module.exports.Task.extend.run (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/tasks/serve.js:15:19)
  at Class.module.exports.Command.extend.run (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/commands/serve.js:47:18)
  at Class.<anonymous> (/Users/bmckay/Ember/mystics/node_modules/ember-cli/lib/models/command.js:131:17)
  at $$$internal$$tryCatch (/Users/bmckay/Ember/mystics/node_modules/ember-cli/node_modules/rsvp/dist/rsvp.js:490:16)
  at $$$internal$$invokeCallback (/Users/bmckay/Ember/mystics/node_modules/ember-cli/node_modules/rsvp/dist/rsvp.js:502:17)
  at $$$internal$$publish (/Users/bmckay/Ember/mystics/node_modules/ember-cli/node_modules/rsvp/dist/rsvp.js:473:11)
  at Object.$$rsvp$asap$$flush [as _onImmediate] (/Users/bmckay/Ember/mystics/node_modules/ember-cli/node_modules/rsvp/dist/rsvp.js:1581:9)
  at processImmediate [as _immediateCallback] (timers.js:345:15)

The github page for the modal component describes how to implement the modal itself and includes a demo, but doesn't detail how to fire a modal

Steps to reproduce

1. Install ember-cli v0.2.2
2. ember new bugapp
3. cd bugapp
4. ember install:addon ember-cli-materialize
5. ember s
6. visit http://localhost:4200 , open your javascript console and refresh

You will now see this error

http://sgasser.github.io/ember-cli-materialize/#/navbar

Things that are insufficiently covered

• Right-aligned links in "desktop" mode
• Left-aligned links in "desktop" mode
• Active items
• Navbar dropdowns
• Fixed-to-top navbar
• Icon links
• Search bar
• Responsive navbar
• Changing the navbar color and/or text color
• Icon logo

Hello!
I don’t know why but it is somehow broken. When I submit a form with an select element, it always returns the default selection and if I add the browser-default class it converts it to the material select anyway.

When I disable the javascript-foo and change the css manually to the default, it works alright!

Maybe you can fix this, because I would like to use it so badly ;-)

System-Info:

OSX 10.9.5
Ember: 1.9.1
Ember Data: 1.0.0-beta.14.1
Handlebars: 2.0.0
jQuery: 2.1.3
Materialize: 0.93.1

Please take a look at this gist.

As you can see, I have a route called contactform which handles the final submission or cancelation.
Inside contactform there is the component contactform-component which collects all the input data and sends this to the controller of contactform.

I also filed this issue in the original MaterializeCSS repo.

Materialize - http://materializecss.com/scrollfire.html

ScrollFire is a jQuery Plugin that executes callback functions depending on how far into the page you've scrolled. We'll show you how you can use this plugin with many demos and examples.

Implementation

I feel we would be well served by using ember-idiomatic options whenever possible. @poteto at Dockyard just released ember-in-viewport, which would be a great basis for this.

I think that ember-in-viewport (demo) already does everything we need in order to be feature-equivalent with Materialize, so completing this task is all about building a great documentation page describing how to use Lauren's addon in combination with this one.

• Build one or more great examples of how to use ember-in-viewport with ember-cli-materialize in the demo app
• Create an integration test to ensure that the example(s) keep working
• Start some type of list (maybe in README.md or the wiki?) of other addons that work really well as additions to ember-cli-materialize

Since we are targeting ember apps, I think the nav bar initialization should set closeOnClick: true by default. Currently there is no way to set this option on the component without extending and over riding didInsertElement.

Hi, thanks for this awesome addon!

I'm having trouble to bind a value from controller to a input field.

In my controller:

...
name: '',
...

template:

{{materialize-input value=name label='Name' class='col s3'}}

I find out that if I remove maxlength property from input in your template it works well.

Do you need this property?

Cheers!
Thiago

http://sgasser.github.io/ember-cli-materialize/#/forms

Things that are insufficiently documented

• Combining a bunch of elements to build a form

I'm building an app with some components that go beyond the atomic elements described in Dogfalo/materialize and am leveraging this addon extensively.

For example, I plan to build a timepicker

chips

bottom sheets

And so on... Considering that we already have ember-paper, ember-cli-materialize and ember-material-design -- I'd like to avoid making a fourth library (with this as a foundation & dependency) if possible.

When including buttons on a page, e.g. I tried:

{{md-btn text='Button' action='debug'}}
{{md-btn text='Button' icon='mdi-action-favorite' action='debug'}}
{{md-btn text='Button' icon='mdi-action-favorite' iconPosition='right' action='debug'}}
{{md-btn icon='mdi-action-favorite' action='debug' buttonType='floating'}}
{{md-btn text='Flat button' action='debug' buttonType='flat'}}
{{md-btn-submit icon='mdi-content-send' iconPosition='right' text='Submit'}}
{{md-btn text='Large button' action='debug' buttonType='large'}}
{{md-btn text='Disabled button' isDisabled=true}}

Uncaught Error: Could not find module 'ember-new-computed' imported from 'ember-cli-materialize/components/md-btn'

Ember-cli crashes at Version 0.9.0 of this addon.
I'm getting the following error message:

SyntaxError: illegal character
return width: ${pct}%;

Probabily the error is at this line: https://github.com/sgasser/ember-cli-materialize/pull/37/files#diff-a2af500c710eb51c6f59334db7975aafR24

I occured in this issue when I saved my login-information and then went back to the Login-Page. The inputs are filled but the labels are in the background of it instead at the top.
I suppose that the browser (I'm using FF) fills the input fields even before the addon is completely load and so the script don't get a callback that the field is filled and so it can't set the class of the label to active.

I did a workaround, but I'm not sure that it's the best solution:
I'm setting a JS-Timeout of 300ms when the component is completely load and then check if there is any value set for the input. If yes, then I'm setting the active-class for the label. I tried also with a smaller timeout, but finished using 300ms because sometimes it took more time to load the addon.

The hero unit on the demo page has very poor contrast. Talking about this part here:

Ember Addon
for using Materialize - a CSS Framework based on Material Design in Ember applications.

The example code says to use:

{{#md-dialog action="closeModal"}}
  <div class="modal-content">
    <h4>Hello Modal</h4>
    <p>Oh hai there!</p>
  </div>
  <div class="modal-footer">
    <a class="modal-action modal-close waves-effect waves-green btn-flat"
        {{action 'agree'}}>
      Agree
    </a>
    <a class="modal-action modal-close waves-effect waves-green btn-flat"
        {{action 'closeModal'}}>
      Cancel
    </a>
  </div>
{{/md-dialog}}

but md-dialog does not exist. I suspect this is supposed to be md-modal. However, when swapping to md-modal, I get:

Uncaught Error: ember-wormhole failed to render into '#materialize-modal-root-element' because the element is not in the DOM

Error message:

/Users/newuser/Project/beauty_now_pro/ember/tmp/tree_merger-tmp_dest_dir-CDIj1KxA.tmp/app/styles/app.scss:1: file to import not found or unreadable: 'materialize'
Current dir: /Users/newuser/Project/beauty_now_pro/ember/tmp/tree_merger-tmp_dest_dir-CDIj1KxA.tmp/app/styles/
 [string exception]

My ember-cli version:
version: 0.2.0-beta.1
node: 0.10.26
npm: 2.1.8

Temporary solution:

Add these lines:

  var ENV = {

    sassOptions: {
      includePaths: ['bower_components/materialize/sass']
    },
  }

so i was trying to use the parallax thingies in materialize css and i used this ad-don to add it, so i made a few routes and inside this template each had its own parallax thingies, i realized i needed to do some jquery initialization code and since all the initialization code was not included, i added it on the index.html file just to see if it would work,

well when the first browser request occurs, the parallax effect works awesome, when i change the route and go back..BOOM! the thing breaks and the pictures in parallax disappears, I'm left with a white screen, the web app is http://sabekconsulting.com/ its supposed to be an ember app and I'm working on it right now...its supposed to look like that

so my idea is to add all the jquery initialization code in one file in master so the are added and initialized when the addon is installed...while you make the components just to help before all the components are complete...or a parallax component would be awesome...or maybe I'm doing it wrong..can you help?

Right now this addon only pulls in materialize in it's full form.

But for production apps, it is more likely that developers will want to change settings and opt in or out of certain components from the lib.

Would it make more sense to pull in the _settings.scss and replace the app.css file from a project with bower_components/materialize/sass/materialize.scss?

The code in this addon is 1.13 friendly, and has no 1.13 deprecations. However, there is some work needed in dependencies in order to ensure our tests pass deprecation-warning-free as part of CI.

• ember-key-responder - instance initializer deprecation - yapplabs/ember-key-responder#15

Hello @sgasser, my name is Leonidez. I work at Poetic Systems in Houston, Texas and we're interested in becoming the maintainers of ember-cli-materialize. We've made a big investment in ember over the last year and we'd like to incorporate the work you've done into a fully developed package. For reference to our related work please refer to our github: https://github.com/poetic/. Thank you.

Issue in materialize: Dogfalo/materialize#1079

@sgasser

http://sgasser.github.io/ember-cli-materialize/#/collapsible

Things that are insufficiently covered

• Expandible vs. accordion mode (whether 1 or N panes can be expanded at a given time)
• Pre-selected selection example is currently broken
• "Popout" collapsible

http://sgasser.github.io/ember-cli-materialize/#/badges

Aspects of badges that are not covered

• Changing a badge's color
• Changing a badge's text color

Hi, I just did a fresh install of this plugin with

ember 1.12.0
ember-cli 0.2.4
materialize 0.96

and I am following the demo for some of the form components and running into some issues:

Using

    {{md-checks
        selection=checkboxSelections
        content=checkboxChoices
        optionValuePath='id'
        optionLabelPath='label'}}

w/

checkboxChoices: [
  {id: 1, label: "lala"},
  {id: 1, label: "apple"},
  {id: 1, label: "blue"}
]

yields

Uncaught TypeError: Cannot read property 'indexOf' of undefinedindexOf @ ember.debug.js:12019
isValueSelected @ selectable-item-group.js:29get @ selectable-item.js:15
ComputedPropertyPrototype.get @ ember.debug.js:11059get @ ember.debug.js:15588
.
.
.

at console. Any idea why?

Looks like the materialize-button-submit component when isDisabled=true attribute is passed only sets the class of disabled and leaves the actual element enabled. This allows a "disabled" submit button to submit a form.

Materialize CSS Reference - http://materializecss.com/dialogs.html

Material Design Reference

http://www.google.com/design/spec/components/snackbars-toasts.html#snackbars-toasts-usage

Implementation

@poteto has a great addon called ember-cli-flash that would work very well for this. I have spiked its usage in a yahoo app here

• application.hbs - the notification center
• app.scss - the "extra" style needed to position the toasts container reasonably

Important Use Cases

• Standard "one line string" usage
• Action callback via a button
• "Sticky" alerts that must be dismissed explicitly, vs. timed automatic expiration (ember-cli-flash already supports both I believe)

after I add the Add-on via both methods old and for new add-on format, the app goes blank and the following error is shown on console after serving the app

Uncaught Error: Could not find module <%= modulePrefix %>/app

i'm using using version: 0.2.0-beta.1

plus what version of jquery is needed?..i chose 1,

override environment.js i also choose yes,

please help...

Trying this out, and started with a navbar, and ran into two things. First, the documentation for navbar says to use materialize-navbar, but then I get a deprecation in the browser console saying to use md-navbar.

Second, when I use it via:

{{#md-navbar name='Main'}}
  <li>{{#link-to 'tasks'}}Tasks{{/link-to}}</li>
{{/md-navbar}}

In "full-screen" (that is, on wide monitor) I see the word "Main", and it's a link to "/". There is no "Tasks" link visible.

If I resize the screen to mobile-type width, I get the hamburger type menu on the left, and that has the "Tasks" link, which works.

Am I doing something wrong? Thanks!

i had an working app, installed this addon app broke only to realise that some stuff had changed and replaced with some component,

I tried using ember-cli-materialize but i get

File: bower_components/materialize/sass/components/_normalize.scss (290)
invalid top-level expression

I am using ember-cli (0.2.2), node (0.12.2) - and ember-cli-materialize is the only addon added.

Hi,
I'm trying to implement the {{md-card}} component and I would like to understand the degree of customization in it. In particular regarding the parameters one could pass to the options provided.
For example, in the titleoption it's possible to insert an handlebars expression? I'm encountering problems doing it, here the code:

{{#md-card title="{{person.name}}" }}
  {{#md-card-content}}
      Just a test
  {{/md-card-content}}
  {{#md-card-action}}
    {{#md-badge}}{{person.tag_name}}{{/md-badge}}
  {{/md-card-action}}
{{/md-card}}

Any suggestion would be appreciated.

There is another Material design addon for Ember called Ember Paper by @miguelcobain.

Materialize CSS has much more css elements, javascript plugins, components, etc.
But Materialize CSS isn't the most adherent to the spec. Ember Paper look much better based on Angular Material and things are done the ember way and no external libraries are included or required,.

Should we all work on the Ember Paper and ember-cli-materialize will be only a wrapper for Materialize CSS without components?

Calling the Materialize javascript

this.$('.button-collapse').sideNav({
  closeOnClick: true
});

Sets up some click listeners, which should be torn down in the component's willDestroyElement hook. Potentially this means enhancing the upstream Materialize project, or writing some ember-idiomatic code that does the same thing

Select, radio buton and more seem to be broken if your content is a simple array of strings.

Although optionValuePath and optionLabelPath should be optional, it seems it doesn't work that way.

I'm not sure if this is an issue created by newer versions of lib-sass or Ember CLI 0.2.1+ but I have been running into an issue where when trying to compile materialize I get a hangup error:

invalid top-level expression
Error: invalid top-level expression
    at options.error (/tmp/mat-test/node_modules/ember-cli-sass/node_modules/broccoli-sass-source-maps/node_modules/node-sass/lib/index.js:261:32)

After tracking this down it has to do with the comment on line 291 in components/_normalize that interrupts the selectors and have made a PR on materialize itself to hopefully fix this by moving the comment before the selector list.

However, I would like to bring up the question of why this new error is occurring?

• Is it valid to have a comment in between selector declaration?
• Are we correctly matching the spec

Basically for the betterment of SASS and Ember SASS I want to figure out if this is a fluke or if there needs to be clarification in a higher level project?
Pinging in @chriseppstein to talk SASS spec

Aside:

If you would like to compile materialize before the PR is hopefully closed you can replace your bower dependency with "materialize": "[email protected]:rtablada/materialize.git#bugfix/invalid-top-level-expression"