Skip to content

Instantly share code, notes, and snippets.

@aforemny
Created May 9, 2018 12:10
Show Gist options
  • Select an option

  • Save aforemny/51de70f3c30506252e3253473a16d4dd to your computer and use it in GitHub Desktop.

Select an option

Save aforemny/51de70f3c30506252e3253473a16d4dd to your computer and use it in GitHub Desktop.
elm-mdc docs.json as of today
[
{
"name": "Material.Toolbar",
"comment": "\nA toolbar is a container for multiple rows that contain items such as the\napplication's title, navigation menu and tabs, among other things.\n\nBy default a toolbar scrolls with the view. You can change this using the\n`fixed` or `waterfall` properties. A `flexible` toolbar changes its height when\nthe view is scrolled.\n\n\n# Resources\n\n- [Material Design guidelines: Toolbars](https://material.io/guidelines/components/toolbars.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#toolbar)\n\n\n# Example\n\n```elm\nimport Html exposing (text)\nimport Material.Toolbar as Toolbar\n\n\nToolbar.view Mdc [0] model.mdc []\n [ Toolbar.row []\n [ Toolbar.section\n [ Toolbar.alignStart\n ]\n [ Toolbar.menuIcon [] \"menu\"\n , Toolbar.title [] [ text \"Title\" ]\n ]\n , Toolbar.section\n [ Toolbar.alignEnd\n ]\n [ Toolbar.icon [] \"file_download\"\n , Toolbar.icon [] \"print\"\n , Toolbar.icon [] \"bookmark\"\n ]\n ]\n ]\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs fixed\n@docs waterfall\n@docs flexible\n@docs flexibleDefaultBehavior\n@docs fixedLastRow\n@docs backgroundImage\n@docs row\n@docs section\n@docs alignStart\n@docs alignEnd\n@docs shrinkToFit\n@docs menuIcon\n@docs title\n@docs icon, iconToggle\n@docs fixedAdjust\n",
"aliases": [
{
"name": "Property",
"comment": " Toolbar property.\n",
"args": [
"m"
],
"type": "Material.Internal.Toolbar.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "alignEnd",
"comment": " Make section align to the end.\n",
"type": "Material.Toolbar.Property m"
},
{
"name": "alignStart",
"comment": " Make section align to the start.\n",
"type": "Material.Toolbar.Property m"
},
{
"name": "backgroundImage",
"comment": " Add a background image to the toolbar.\n",
"type": "String -> Material.Toolbar.Property m"
},
{
"name": "fixed",
"comment": " Make the toolbar fixed to the top and apply a persistent elevation.\n",
"type": "Material.Toolbar.Property m"
},
{
"name": "fixedAdjust",
"comment": " Adds a top margin to the element so that it is not covered by the toolbar.\n\nShould be applied to a direct sibling of `view`.\n",
"type": "Material.Component.Index -> Material.Model m -> Material.Options.Property c m"
},
{
"name": "fixedLastRow",
"comment": " Make the last row of the toolbar fixed.\n",
"type": "Material.Toolbar.Property m"
},
{
"name": "flexible",
"comment": " Make the height of the toolbar change as the window is scrolled.\n\nYou will likely want to specify `flexibleDefaultBehavior` as well.\n",
"type": "Material.Toolbar.Property m"
},
{
"name": "flexibleDefaultBehavior",
"comment": " Make use of the flexible default behavior.\n",
"type": "Material.Toolbar.Property m"
},
{
"name": "icon",
"comment": " Style an icon as an icon at the end of the toolbar.\n\nShould be applied to a `Icon.view`.\n",
"type": "Material.Icon.Property m"
},
{
"name": "iconToggle",
"comment": " Style an icon toggle as an icon at the end of the toolbar.\n\nShould be applied to a `IconToggle.view`.\n",
"type": "Material.IconToggle.Property m"
},
{
"name": "menuIcon",
"comment": " Style an icon to be the menu icon of the toolbar.\n",
"type": "Material.Icon.Property m"
},
{
"name": "row",
"comment": " Toolbar row.\n\nA row is divided into several `section`s. There has to be at least one row as\ndirect child of `view`.\n",
"type": "List (Material.Toolbar.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "section",
"comment": " Toolbar section.\n\nBy default sections share the available space of a row equally.\n\nHas to be a child of `row`.\n",
"type": "List (Material.Toolbar.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "shrinkToFit",
"comment": " Make a section take the width of its contents.\n",
"type": "Material.Toolbar.Property m"
},
{
"name": "title",
"comment": " Add a title to the toolbar.\n\nHas to be a child of `section`.\n",
"type": "List (Material.Toolbar.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "view",
"comment": " Toolbar view.\n\nThe first child of this function has to be a `row`.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Toolbar.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "waterfall",
"comment": " Make the toolbar gain elevation only when the window is scrolled.\n",
"type": "Material.Toolbar.Property m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Card",
"comment": "\nCard is a component that implements the Material Design card component.\n\n\n# Resources\n\n- [Material Design guidelines: Cards](https://material.io/guidelines/components/cards.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#cards)\n\n\n# Example\n\n```elm\nimport Html exposing (text)\nimport Material.Button as Button\nimport Material.Card as Card\nimport Material.IconToggle as IconToggle\nimport Material.Options as Options exposing (styled, css)\nimport Material.Typography as Typography\n\n\nCard.view\n [ css \"width\" \"350px\"\n ]\n [ Card.media\n [ Card.aspect16To9\n , Card.backgroundImage \"images/16-9.jpg\"\n ]\n []\n , styled Html.div\n [ css \"padding\" \"1rem\"\n ]\n [ styled Html.h2\n [ Typography.title\n , css \"margin\" \"0\"\n ]\n [ text \"Our Changing Planet\"\n ]\n , styled Html.h3\n [ Typography.subheading1\n , css \"margin\" \"0\"\n ]\n [ text \"by Kurt Wagner\"\n ]\n ]\n , styled Html.div\n [ css \"padding\" \"0 1rem 8px 1rem\"\n , css \"color\" \"rgba(0, 0, 0, 0.54)\"\n , Typography.body1\n ]\n [ text \"\"\"\nVisit ten places on our planet that are undergoing the\nbiggest changes today.\"\"\"\n ]\n , Card.actions []\n [ Card.actionButtons []\n [ Button.view Mdc [0] model.mdc\n [ Card.actionButton\n , Button.ripple\n ]\n [ text \"Read\"\n ]\n ]\n , Card.actionIcons []\n [ IconToggle.view Mdc [1] model.mdc\n [ Card.actionIcon\n , IconToggle.icon\n { on = \"favorite\"\n , off = \"favorite_border\"\n }\n , IconToggle.label\n { on = \"Remove from favorites\"\n , off = \"Add to favorites\"\n }\n ]\n []\n ]\n ]\n ]\n```\n\n\n# Usage\n\n\n## Card\n\n@docs Property\n@docs view\n@docs stroked\n@docs primaryAction\n\n\n## Card media\n\n@docs media\n@docs backgroundImage\n@docs square\n@docs aspect16To9\n@docs mediaContent\n\n\n## Card actions\n\n@docs actions\n@docs fullBleed\n@docs actionButtons\n@docs actionIcons\n@docs actionButton\n@docs actionIcon\n",
"aliases": [
{
"name": "Property",
"comment": " Card property.\n",
"args": [
"m"
],
"type": "Material.Internal.Card.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "actionButton",
"comment": " An action button with text.\n",
"type": "Material.Button.Property m"
},
{
"name": "actionButtons",
"comment": " A group of action buttons, displayed on the left side of the card (in LTR),\nadjacent to `actionIcons`.\n",
"type": "List (Material.Card.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "actionIcon",
"comment": " An action icon with text.\n",
"type": "Material.IconToggle.Property m"
},
{
"name": "actionIcons",
"comment": " A group of supplemental icons, displayed on the right side of the card (in\nLTR), adjacent to `actionButtons`.\n",
"type": "List (Material.Card.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "actions",
"comment": " Row containing action buttons and/or icons.\n",
"type": "List (Material.Card.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "aspect16To9",
"comment": " Automatically scales the media area's height according to its width,\nmaintaining a 16:9 aspect ratio.\n",
"type": "Material.Card.Property m"
},
{
"name": "backgroundImage",
"comment": " Sets the background image url of the card's media area.\n",
"type": "String -> Material.Card.Property m"
},
{
"name": "fullBleed",
"comment": " Removes the action area's padding and causes its only child (`actions`\nelement) to consume 100% of the action area's width.\n",
"type": "Material.Card.Property m"
},
{
"name": "media",
"comment": " Media area that displays a custom `background-image` with `background-size:\ncover`.\n",
"type": "List (Material.Card.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "mediaContent",
"comment": " An absolutely-positioned box the same size as the media area, for\ndisplaying a title or icon on top of the `background-image`.\n",
"type": "List (Material.Card.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "primaryAction",
"comment": " The main tappable area of the card. Typically contains all card content,\nexcept `cardActions`.\n\nOnly applicable to cards that have a primary action that the main surface\nshould trigger.\n",
"type": "List (Material.Card.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "square",
"comment": " Automatically scales the media area's height to equal its width.\n",
"type": "Material.Card.Property m"
},
{
"name": "stroked",
"comment": " Removes the card's shadow and displays a hairline stroke instead.\n",
"type": "Material.Card.Property m"
},
{
"name": "view",
"comment": " Card view.\n",
"type": "List (Material.Card.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Select",
"comment": "\nSelect provides Material Design single-option select menus. It functions\nanalogously to the browser's native `<select>` element\n\nBecause of limitations of the current implementation, you have to set a `width`\nmanually.\n\n\n# Resources\n\n- [Material Design guidelines: Text Fields](https://material.io/guidelines/components/text-fields.html)\n- [Material Design guidelines: Menus](https://material.io/guidelines/components/menus.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#select)\n\n\n# Example\n\n```elm\nimport Material.Menu as Menu\nimport Material.Options exposing (css)\nimport Material.Select as Select\n\n\nSelect.view (lift << Mdc) id model.mdc\n [ Select.label \"Food Group\"\n , css \"width\" \"377px\"\n ]\n [ Menu.li\n [ Menu.onSelect (Select \"Fruit Roll Ups\")\n ]\n [ text \"Fruit Roll Ups\"\n ]\n , Menu.li\n [ Menu.onSelect (Select \"Candy (cotton)\")\n ]\n [ text \"Candy (cotton)\"\n ]\n ]\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs label\n@docs selectedText\n@docs index\n@docs disabled\n@docs box\n",
"aliases": [
{
"name": "Property",
"comment": " Select property.\n",
"args": [
"m"
],
"type": "Material.Internal.Select.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "box",
"comment": " Style the select as a box select.\n",
"type": "Material.Select.Property m"
},
{
"name": "disabled",
"comment": " Disable the select.\n",
"type": "Material.Select.Property m"
},
{
"name": "index",
"comment": " Set the index of the selected item.\n",
"type": "Int -> Material.Select.Property m"
},
{
"name": "label",
"comment": " Set the select's label.\n",
"type": "String -> Material.Select.Property m"
},
{
"name": "selectedText",
"comment": " Set the textual representation of the selected item.\n",
"type": "String -> Material.Select.Property m"
},
{
"name": "view",
"comment": " Select view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Select.Property m) -> List (Material.Menu.Item m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Dialog",
"comment": "\nThe Dialog component is a spec-aligned dialog component adhering to the\nMaterial Design dialog pattern. It implements a modal dialog window that traps\nfocus when opening and restores focus when closing.\n\nThe current implementation requires that a dialog has as first child a\n`surface` element and as second child a `backdrop` element.\n\n\n# Resources\n\n- [Material Design guidelines: Dialogs](https://material.io/guidelines/components/dialogs.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#dialog)\n\n\n# Example\n\n```elm\nimport Html exposing (text)\nimport Material.Button as Button\nimport Material.Component exposing (Index)\nimport Material.Dialog as Dialog\nimport Material.Options as Options exposing (styled)\n\n\nDialog.view Mdc [0] model.mdc\n [ Dialog.open\n , Dialog.onClose Cancel\n ]\n [ Dialog.surface []\n [\n Dialog.header []\n [ styled Html.h2\n [ Dialog.title\n ]\n [ text \"Use Google's location service?\"\n ]\n ]\n ,\n Dialog.body []\n [ text\n \"\"\"\nLet Google help apps determine location. This means\nsending anonymous location data to Google, even when\nno apps are running.\n \"\"\"\n ]\n ,\n Dialog.footer []\n [\n Button.view Mdc [0,0] model.mdc\n [ Button.ripple\n , Dialog.cancel\n , Options.onClick Cancel\n ]\n [ text \"Decline\"\n ]\n ,\n Button.view Mdc [0,1] model.mdc\n [ Button.ripple\n , Dialog.accept\n , Options.onClick Accept\n ]\n [ text \"Continue\"\n ]\n ]\n ]\n , Dialog.backdrop [] []\n ]\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs open\n@docs onClose\n@docs surface\n@docs backdrop\n@docs header\n@docs title\n@docs body\n@docs scrollable\n@docs footer\n@docs cancel\n@docs accept\n",
"aliases": [
{
"name": "Property",
"comment": " Dialog property.\n",
"args": [
"m"
],
"type": "Material.Internal.Dialog.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "accept",
"comment": " Style the button as accept button.\n",
"type": "Material.Button.Property m"
},
{
"name": "backdrop",
"comment": " Dialog backdrop.\n\nThis element is required to be the second child of `view` and adds a backdrop\nto the dialog.\n",
"type": "List (Material.Dialog.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "body",
"comment": " Dialog body.\n\nThis element wraps the dialog's content except for `header` and `footer`\ncontent.\n",
"type": "List (Material.Dialog.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "cancel",
"comment": " Style the button as cancel button.\n",
"type": "Material.Button.Property m"
},
{
"name": "footer",
"comment": " Dialog footer.\n",
"type": "List (Material.Dialog.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "header",
"comment": " Dialog header.\n",
"type": "List (Material.Dialog.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "onClose",
"comment": " Sends an event when user clicks on the dialog's backdrop.\n",
"type": "m -> Material.Dialog.Property m"
},
{
"name": "open",
"comment": " Make the dialog visible.\n",
"type": "Material.Dialog.Property m"
},
{
"name": "scrollable",
"comment": " Make the dialog's body scrollable.\n",
"type": "Material.Dialog.Property m"
},
{
"name": "surface",
"comment": " Dialog surface.\n\nThis element is required to be the first child of `view` and wraps all the\ndialog's content such as the `header`, `body` and `footer`.\n",
"type": "List (Material.Dialog.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "title",
"comment": " Dialog title.\n",
"type": "Material.Options.Property c m"
},
{
"name": "view",
"comment": " Dialog view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Dialog.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Drawer.Temporary",
"comment": " The Drawer component is a spec-aligned drawer component adhering to the\nMaterial Design navigation drawer pattern. It implements permanent, persistent,\nand temporary drawers.\n\n\n# Resources\n\n- [Material Design guidelines: Navigation drawer](https://material.io/guidelines/patterns/navigation-drawer.html)\n- [Demo: Temporary Drawer](https://aforemny.github.io/elm-mdc/#temporary-drawer)\n- [Demo: Persistent Drawer](https://aforemny.github.io/elm-mdc/#persistent-drawer)\n- [Demo: Permanent Drawer Above Toolbar](https://aforemny.github.io/elm-mdc/#permanent-drawer-above)\n- [Demo: Permanent Drawer Below Toolbar](https://aforemny.github.io/elm-mdc/#permanent-drawer-below)\n\n\n# Example\n\n\n```elm\nimport Html exposing (text)\nimport Material.Drawer.Temporary as Drawer\nimport Material.List as Lists\n\n\nDrawer.view Mdc [0] model.mdc []\n [ Drawer.toolbarSpacer [] []\n , Lists.ul\n [ Drawer.content\n ]\n [ Lists.li []\n [ Lists.graphicIcon [] \"inbox\"\n , text \"Inbox\"\n ]\n , Lists.li []\n [ Lists.graphicIcon [] \"star\"\n , text \"Star\"\n ]\n , Lists.li []\n [ Lists.graphicIcon [] \"send\"\n , text \"Sent Mail\"\n ]\n , Lists.li []\n [ Lists.graphicIcon [] \"drafts\"\n , text \"Drafts\"\n ]\n ]\n ]\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs content\n@docs toolbarSpacer\n@docs header\n@docs headerContent\n@docs onClose\n@docs open\n",
"aliases": [
{
"name": "Property",
"comment": " Drawer property.\n",
"args": [
"m"
],
"type": "Material.Internal.Drawer.Temporary.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "content",
"comment": " Should be set on the list of items inside the drawer.\n",
"type": "Material.List.Property m"
},
{
"name": "header",
"comment": " Container to create a 16:9 drawer header.\n",
"type": "List (Material.Drawer.Temporary.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "headerContent",
"comment": " Content node inside `header`.\n",
"type": "List (Material.Drawer.Temporary.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "onClose",
"comment": " Message that must be sent when the drawer wants to be close\n",
"type": "m -> Material.Drawer.Temporary.Property m"
},
{
"name": "open",
"comment": " When present, makes the drawer open.\n",
"type": "Material.Drawer.Temporary.Property m"
},
{
"name": "toolbarSpacer",
"comment": " Provide the matching amount of space for toolbar.\n",
"type": "List (Material.Drawer.Temporary.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "view",
"comment": " Drawer view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Drawer.Temporary.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Ripple",
"comment": "\nThe Ripple component adds a material \"ink ripple\" interaction effect to\nHTML elements.\n\nThe ripple comes in `bounded` and `unbounded` variants. The first works well\nfor surfaces, the other works well for icons.\n\nThe view functions `unbounded` and `bounded` return a record with fields\n\n- `interactionHandler` that has to be added to the HTML element that should be\n interacted with,\n- `properties` that applies the ripple effect to the HTML element. This is\n usually the same as the one `interactionHandler` is applied to, and\n- `style` which is a HTML `<style>` element which has to be added to the DOM.\n It is recommended to make this a child of the element that is interacted\n with.\n\n\n# Resources\n- [Material Design guidelines: Choreography](https://material.io/guidelines/motion/choreography.html#choreography-radial-reaction)\n- [Demo](https://aforemny.github.io/elm-mdc/#ripple)\n\n\n# Example\n\n## Bounded Ripple effect\n\n```elm\nimport Html exposing (text)\nimport Material.Options as Options exposing (styled)\nimport Material.Ripple as Ripple\n\n\nlet\n { interactionHandler\n , properties\n , style\n } =\n Ripple.bounded Mdc [0] model.mdc\nin\nOptions.styled Html.div\n [ interactionHandler\n , properties\n ]\n [ text \"Interact with me!\"\n , style\n ]\n```\n\n\n## Unbounded Ripple effect\n\n```elm\nlet\n { interactionHandler\n , properties\n , style\n } =\n Ripple.unbounded Mdc [0] model.mdc\nin\nIcon.view\n [ interactionHandler\n , properties\n ]\n \"favorite\"\n```\n\n\n# Usage\n@docs Property\n@docs unbounded\n@docs bounded\n@docs primary\n@docs accent\n",
"aliases": [
{
"name": "Property",
"comment": " Ripple property.\n",
"args": [
"m"
],
"type": "Material.Internal.Ripple.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "accent",
"comment": " Set ripple effect to the accent color.\n",
"type": "Material.Ripple.Property m"
},
{
"name": "bounded",
"comment": " Bounded view function.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Ripple.Property m) -> { interactionHandler : Material.Options.Property c m , properties : Material.Options.Property c m , style : Html.Html m }"
},
{
"name": "primary",
"comment": " Set ripple effect to the primary color.\n",
"type": "Material.Ripple.Property m"
},
{
"name": "unbounded",
"comment": " Unbounded view function.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Ripple.Property m) -> { interactionHandler : Material.Options.Property c m , properties : Material.Options.Property c m , style : Html.Html m }"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Slider",
"comment": "\nSlider provides an implementation of the Material Design slider component.\n\nNote that vertical sliders and range (multi-thumb) sliders are not supported,\ndue to their absence from the material design spec.\n\nSlider uses custom `onChage` and `onInput` event handlers.\n\n\n# Resources\n\n- [Material Design guidelines: Sliders](https://material.io/guidelines/components/sliders.html)\n- [Demo](https://aforemny.github.io/elm-mdc/slider)\n\n\n# Example\n\n```elm\nimport Material.Slider as Slider\n\nSlider.view Mdc [0] model.mdc\n [ Slider.value 40\n , Slider.onChange Change\n ]\n []\n```\n\n\n# Usage\n\n\n## Slider\n\n@docs Property\n@docs view\n@docs value, min, max\n@docs disabled\n@docs onChange, onInput\n\n## Discrete Slider\n\n@docs discrete\n@docs steps\n@docs trackMarkers\n",
"aliases": [
{
"name": "Property",
"comment": " Properties for Slider options.\n",
"args": [
"m"
],
"type": "Material.Internal.Slider.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "disabled",
"comment": " Disable the slider.\n",
"type": "Material.Slider.Property m"
},
{
"name": "discrete",
"comment": " Make the slider only take integer values.\n",
"type": "Material.Slider.Property m"
},
{
"name": "max",
"comment": " Specify the maximum value.\n",
"type": "Int -> Material.Slider.Property m"
},
{
"name": "min",
"comment": " Specify the minimum value.\n",
"type": "Int -> Material.Slider.Property m"
},
{
"name": "onChange",
"comment": " Slider `onChange` event listener.\n",
"type": "(Float -> m) -> Material.Slider.Property m"
},
{
"name": "onInput",
"comment": " Slider `onInput` event listener.\n",
"type": "(Float -> m) -> Material.Slider.Property m"
},
{
"name": "steps",
"comment": " Specify a number of steps that value will be a multiple of.\n\nDefaults to 1.\n",
"type": "Int -> Material.Slider.Property m"
},
{
"name": "trackMarkers",
"comment": " Add track markers to the Slider every `step`.\n",
"type": "Material.Slider.Property m"
},
{
"name": "value",
"comment": " Specify the slider's value.\n\nThis will be clamped between `min` and `max`.\n",
"type": "Float -> Material.Slider.Property m"
},
{
"name": "view",
"comment": " Slider view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Slider.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Fab",
"comment": "\nA floating action button represents the primary action in an application.\n\n\n# Resources\n\n- [Material Design guidelines: Buttons](https://material.io/guidelines/components/buttons-floating-action-button.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#fab)\n\n\n# Example\n\n```elm\nimport Material.Fab as Fab\nimport Material.Options as Options\n\n\nFab.view Mdc [0] model.mdc\n [ Fab.ripple\n , Options.onClick Click\n ]\n \"favorite_border\"\n```\n\n\n# Usage\n@docs Property\n@docs view\n@docs Property\n@docs mini\n@docs ripple\n@docs exited\n",
"aliases": [
{
"name": "Property",
"comment": " Fab property.\n",
"args": [
"m"
],
"type": "Material.Internal.Fab.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "exited",
"comment": " Animates the Fab out of view when this property is set.\n\nIt returns to view when this property is removed.\n",
"type": "Material.Fab.Property m"
},
{
"name": "mini",
"comment": " Make the Fab smaller than regular size.\n",
"type": "Material.Fab.Property m"
},
{
"name": "ripple",
"comment": " Enable ripple effect on interaction.\n",
"type": "Material.Fab.Property m"
},
{
"name": "view",
"comment": " Fab view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Fab.Property m) -> String -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.IconToggle",
"comment": "\nIconToggle provides a Material Design icon toggle button. It is fully\naccessible, and is designed to work with any icon set.\n\n\n# Resources\n\n- [Material Design guidelines: Toggle buttons](https://material.io/guidelines/components/buttons.html#buttons-toggle-buttons)\n- [Demo](https://aforemny.github.io/elm-mdc/#icon-toggle)\n\n\n# Example\n\n```elm\nimport Material.IconToggle as IconToggle\n\n\nIconToggle.view Mdc [0] model.mdc\n [ IconToggle.icon\n { on = \"favorite_border\"\n , off = \"favorite\"\n }\n , IconToggle.label\n { on = \"Remove from favorites\"\n , off = \"Add to favorites\"\n }\n , IconToggle.on True\n , IconToggle.onClick Toggle\n ]\n []\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs on\n@docs icon\n@docs label\n@docs disabled\n@docs className\n",
"aliases": [
{
"name": "Property",
"comment": " IconToggle property.\n",
"args": [
"m"
],
"type": "Material.Internal.IconToggle.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "className",
"comment": " Sets an alternate classname of the icon.\n\nUseful if you want to use a different icon set. For example use `\"fa\"` for\nFontAwesome.\n",
"type": "String -> Material.IconToggle.Property m"
},
{
"name": "disabled",
"comment": " Disable the icon toggle.\n",
"type": "Material.IconToggle.Property m"
},
{
"name": "icon",
"comment": " Set the icon.\n\nSpecify an icon for the icon toggle's \"on\" and \"off\" state.\n",
"type": "{ on : String, off : String } -> Material.IconToggle.Property m"
},
{
"name": "label",
"comment": " Set the icon toggle's label.\n\nSpecify a label for the icon toggle's \"on\" and \"off\" state.\n",
"type": "{ on : String, off : String } -> Material.IconToggle.Property m"
},
{
"name": "on",
"comment": " Make the icon toggle appear in its \"on\" state.\n\nDefaults to \"off\". Use `Options.when` to make it interactive.\n",
"type": "Material.IconToggle.Property m"
},
{
"name": "view",
"comment": " IconToggle view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.IconToggle.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Menu",
"comment": "\nThe Menu component is a spec-aligned menu component adhering to the Material\nDesign menu specification.\n\n\n# Resources\n- [Material Design guidelines: Menus](https://material.io/guidelines/components/menus.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#menu)\n\n\n# Example\n\n```elm\nimport Html exposing (text)\nimport Material.Button as Button\nimport Material.Menu as Menu\nimport Material.Options exposing (styled, cs, css)\n\n\nstyled Html.div\n [ Options.cs \"mdc-menu-anchor\"\n , Options.css \"position\" \"relative\"\n ]\n [ Button.view Mdc [0] model.mdc\n [ Menu.attach (lift << Mdc) [1]\n ]\n [ text \"Show\"\n ]\n , Menu.view Mdc [1] model.mdc []\n [ Menu.ul []\n [ Menu.li\n [ Menu.onSelect (Select \"Item 1\")\n ]\n [ text \"Item 1\"\n ]\n , Menu.li\n [ Menu.onSelect (Select \"Item 2\")\n ]\n [ text \"Item 2\"\n ]\n ]\n ]\n ]\n```\n\n\n# Usage\n@docs Property\n@docs view\n@docs ul\n@docs Item\n@docs li\n@docs divider\n@docs onSelect\n@docs index\n@docs attach\n@docs anchorCorner\n@docs Corner\n@docs topStartCorner\n@docs topEndCorner\n@docs bottomStartCorner\n@docs bottomEndCorner\n@docs topLeftCorner\n@docs topRightCorner\n@docs bottomLeftCorner\n@docs bottomRightCorner\n@docs anchorMargin\n@docs Margin\n@docs quickOpen\n",
"aliases": [
{
"name": "Corner",
"comment": " One of the four corners.\n\nConsider using RTL aware corners when possible.\n",
"args": [],
"type": "Material.Internal.Menu.Implementation.Corner"
},
{
"name": "Item",
"comment": " Menu item.\n",
"args": [
"m"
],
"type": "Material.Internal.Menu.Implementation.Item m"
},
{
"name": "Margin",
"comment": " Menu margin from `anchorCorner`.\n\nDefaults to zero margin.\n",
"args": [],
"type": "Material.Internal.Menu.Implementation.Margin"
},
{
"name": "Property",
"comment": " Menu property.\n",
"args": [
"m"
],
"type": "Material.Internal.Menu.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "anchorCorner",
"comment": " Hint to anchor the menu if space is available.\n\nThe menu will auto-position itself if not enough space is available. Prefer\nRTL-aware corners when possible.\n",
"type": "Material.Menu.Corner -> Material.Menu.Property m"
},
{
"name": "anchorMargin",
"comment": " Set the menu's margin from the specified `anchorCorner`.\n",
"type": "Material.Menu.Margin -> Material.Menu.Property m"
},
{
"name": "attach",
"comment": " Component property to attach the menu.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Options.Property c m"
},
{
"name": "bottomEndCorner",
"comment": " Bottom right corner in RTL and bottom left corner otherwise.\n",
"type": "Material.Menu.Corner"
},
{
"name": "bottomLeftCorner",
"comment": " Bottom left corner.\n",
"type": "Material.Menu.Corner"
},
{
"name": "bottomRightCorner",
"comment": " Bottom right corner.\n",
"type": "Material.Menu.Corner"
},
{
"name": "bottomStartCorner",
"comment": " Bottom left corner in RTL and bottom right corner otherwise.\n",
"type": "Material.Menu.Corner"
},
{
"name": "divider",
"comment": " Menu item divider.\n",
"type": "List (Material.List.Property m) -> List (Html.Html m) -> Material.Menu.Item m"
},
{
"name": "index",
"comment": " Specify the menu item that has focus when the menu opens.\n",
"type": "Int -> Material.Menu.Property m"
},
{
"name": "li",
"comment": " Menu item wrapper.\n",
"type": "List (Material.List.Property m) -> List (Html.Html m) -> Material.Menu.Item m"
},
{
"name": "onSelect",
"comment": " Event listener for the menu's select event.\n\nUse this rather than `Options.onClick`, etc. so that it works with keyboard\nselection.\n",
"type": "m -> Material.List.Property m"
},
{
"name": "quickOpen",
"comment": " Open the menu without an animation.\n",
"type": "Material.Menu.Property m"
},
{
"name": "topEndCorner",
"comment": " Top right corner in RTL and top left corner otherwise.\n",
"type": "Material.Menu.Corner"
},
{
"name": "topLeftCorner",
"comment": " Top left corner.\n",
"type": "Material.Menu.Corner"
},
{
"name": "topRightCorner",
"comment": " Top right corner.\n",
"type": "Material.Menu.Corner"
},
{
"name": "topStartCorner",
"comment": " Top left corner in RTL and top right corner otherwise.\n",
"type": "Material.Menu.Corner"
},
{
"name": "ul",
"comment": " Menu items wrapper.\n",
"type": "List (Material.List.Property m) -> List (Material.Menu.Item m) -> Material.Menu.Menu m"
},
{
"name": "view",
"comment": " Menu view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Menu.Property m) -> Material.Menu.Menu m -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Checkbox",
"comment": "\nThe Checkbox component is a spec-aligned checkbox component adhering to the\nMaterial Design checkbox requirements.\n\n# Resources\n\n- [Material Design guidelines: Selection Controls – Checkbox](https://material.io/guidelines/components/selection-controls.html#selection-controls-checkbox)\n- [Demo](https://aforemny.github.io/elm-mdc/#checkbox)\n\n\n# Example\n\n\n```elm\nimport Html exposing (text)\nimport Material.Checkbox as Checkbox\nimport Material.FormField as FormField\nimport Material.Options as Options exposing (styled, cs)\n\n\nFormField.view []\n [ Checkbox.view Mdc [0] model.mdc\n [ Checkbox.checked True\n , Options.onClick Toggle\n ]\n []\n , Html.label\n [ Options.onClick Toggle\n ]\n [ text \"My checkbox\"\n ]\n ]\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs checked\n@docs disabled\n@docs nativeControl\n",
"aliases": [
{
"name": "Property",
"comment": " Checkbox property.\n",
"args": [
"m"
],
"type": "Material.Internal.Checkbox.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "checked",
"comment": " Set checked state to True or False.\n\nIf not set, the checkbox will be in indeterminate state.\n",
"type": "Bool -> Material.Checkbox.Property m"
},
{
"name": "disabled",
"comment": " Disable the checkbox.\n",
"type": "Material.Checkbox.Property m"
},
{
"name": "nativeControl",
"comment": " Apply properties to underlying native control element.\n",
"type": "List (Material.Options.Property () m) -> Material.Checkbox.Property m"
},
{
"name": "view",
"comment": " Checkbox view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Checkbox.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Drawer.Permanent",
"comment": " The Drawer component is a spec-aligned drawer component adhering to the\nMaterial Design navigation drawer pattern. It implements permanent, persistent,\nand temporary drawers.\n\n\n# Resources\n\n- [Material Design guidelines: Navigation drawer](https://material.io/guidelines/patterns/navigation-drawer.html)\n- [Demo: Temporary Drawer](https://aforemny.github.io/elm-mdc/#temporary-drawer)\n- [Demo: Persistent Drawer](https://aforemny.github.io/elm-mdc/#persistent-drawer)\n- [Demo: Permanent Drawer Above Toolbar](https://aforemny.github.io/elm-mdc/#permanent-drawer-above)\n- [Demo: Permanent Drawer Below Toolbar](https://aforemny.github.io/elm-mdc/#permanent-drawer-below)\n\n\n# Example\n\n\n```elm\nimport Html exposing (text)\nimport Material.Drawer.Permanent as Drawer\nimport Material.List as Lists\n\n\nDrawer.view Mdc [0] model.mdc []\n [ Lists.ul\n [ Drawer.content\n ]\n [ Lists.li []\n [ Lists.graphicIcon [] \"inbox\"\n , text \"Inbox\"\n ]\n , Lists.li []\n [ Lists.graphicIcon [] \"star\"\n , text \"Star\"\n ]\n , Lists.li []\n [ Lists.graphicIcon [] \"send\"\n , text \"Sent Mail\"\n ]\n , Lists.li []\n [ Lists.graphicIcon [] \"drafts\"\n , text \"Drafts\"\n ]\n ]\n ]\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs content\n@docs toolbarSpacer\n@docs header\n@docs headerContent\n",
"aliases": [
{
"name": "Property",
"comment": " Drawer property.\n",
"args": [
"m"
],
"type": "Material.Internal.Drawer.Permanent.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "content",
"comment": " Should be set on the list of items inside the drawer.\n",
"type": "Material.List.Property m"
},
{
"name": "header",
"comment": " Container to create a 16:9 drawer header.\n",
"type": "List (Material.Drawer.Permanent.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "headerContent",
"comment": " Content node inside `header`.\n",
"type": "List (Material.Drawer.Permanent.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "toolbarSpacer",
"comment": " Provide the matching amount of space for toolbar.\n",
"type": "List (Material.Drawer.Permanent.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "view",
"comment": " Drawer view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Drawer.Permanent.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Drawer.Persistent",
"comment": " The Drawer component is a spec-aligned drawer component adhering to the\nMaterial Design navigation drawer pattern. It implements permanent, persistent,\nand temporary drawers.\n\n\n# Resources\n\n- [Material Design guidelines: Navigation drawer](https://material.io/guidelines/patterns/navigation-drawer.html)\n- [Demo: Temporary Drawer](https://aforemny.github.io/elm-mdc/#temporary-drawer)\n- [Demo: Persistent Drawer](https://aforemny.github.io/elm-mdc/#persistent-drawer)\n- [Demo: Permanent Drawer Above Toolbar](https://aforemny.github.io/elm-mdc/#permanent-drawer-above)\n- [Demo: Permanent Drawer Below Toolbar](https://aforemny.github.io/elm-mdc/#permanent-drawer-below)\n\n\n# Example\n\n\n```elm\nimport Html exposing (text)\nimport Material.Drawer.Persistent as Drawer\nimport Material.List as Lists\n\n\nDrawer.view Mdc [0] model.mdc []\n [ Drawer.header []\n [ Drawer.headerContent []\n [ text \"Header here\"\n ]\n ]\n , Lists.ul\n [ Drawer.content\n ]\n [ Lists.li []\n [ Lists.graphicIcon [] \"inbox\"\n , text \"Inbox\"\n ]\n , Lists.li []\n [ Lists.graphicIcon [] \"star\"\n , text \"Star\"\n ]\n , Lists.li []\n [ Lists.graphicIcon [] \"send\"\n , text \"Sent Mail\"\n ]\n , Lists.li []\n [ Lists.graphicIcon [] \"drafts\"\n , text \"Drafts\"\n ]\n ]\n ]\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs content\n@docs toolbarSpacer\n@docs header\n@docs headerContent\n@docs open\n",
"aliases": [
{
"name": "Property",
"comment": " Drawer property.\n",
"args": [
"m"
],
"type": "Material.Internal.Drawer.Persistent.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "content",
"comment": " Should be set on the list of items inside the drawer.\n",
"type": "Material.List.Property m"
},
{
"name": "header",
"comment": " Container to create a 16:9 drawer header.\n",
"type": "List (Material.Drawer.Persistent.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "headerContent",
"comment": " Content node inside `header`.\n",
"type": "List (Material.Drawer.Persistent.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "open",
"comment": " When present, makes the drawer open.\n",
"type": "Material.Drawer.Persistent.Property m"
},
{
"name": "toolbarSpacer",
"comment": " Provide the matching amount of space for toolbar.\n",
"type": "List (Material.Drawer.Persistent.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "view",
"comment": " Drawer view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Drawer.Persistent.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Snackbar",
"comment": "\nThe Snackbar component is a spec-aligned snackbar/toast component adhering to\nthe Material Design snackbars & toasts requirements.\n\n\n# Resources\n\n- [Material Design guidelines: Snackbars & toasts](https://material.io/guidelines/components/snackbars-toasts.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#snackbar)\n\n\n# Example\n\n```elm\nimport Material.Snackbar as Snackbar\n\nSnackbar.view Mdc [0] model.mdc [] []\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs alignStart, alignEnd\n\n\n## Contents\n\n@docs Contents\n@docs add\n@docs toast\n@docs snack\n",
"aliases": [
{
"name": "Contents",
"comment": " Snackbar Contents.\n",
"args": [
"m"
],
"type": "{ message : String , action : Maybe.Maybe String , timeout : Time.Time , fade : Time.Time , multiline : Bool , actionOnBottom : Bool , dismissOnAction : Bool , onDismiss : Maybe.Maybe m }"
},
{
"name": "Property",
"comment": " Snackbar property.\n",
"args": [
"m"
],
"type": "Material.Internal.Snackbar.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "add",
"comment": " Add a message to the snackbar. If another message is currently displayed,\nthe provided message will be queued.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Snackbar.Contents m -> Material.Model m -> ( Material.Model m, Platform.Cmd.Cmd m )"
},
{
"name": "alignEnd",
"comment": " End-align the Snackbar.\n\nBy default Snackbars are center aligned. This is only configurable on tablet\nand desktops creens.\n",
"type": "Material.Snackbar.Property m"
},
{
"name": "alignStart",
"comment": " Start-align the Snackbar.\n\nBy default Snackbars are center aligned. This is only configurable on tablet\nand desktops creens.\n",
"type": "Material.Snackbar.Property m"
},
{
"name": "snack",
"comment": " Generate snack with given message and label.\nTimeout is 2750ms, fade 250ms.\n",
"type": "Maybe.Maybe m -> String -> String -> Material.Snackbar.Contents m"
},
{
"name": "toast",
"comment": " Generate toast with given message. Timeout is 2750ms, fade 250ms.\n",
"type": "Maybe.Maybe m -> String -> Material.Snackbar.Contents m"
},
{
"name": "view",
"comment": " Snackbar view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Snackbar.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.RadioButton",
"comment": "\nThe RadioButton component provides a radio button adhering to the Material\nDesign Specification.\n\n\n# Resources\n\n- [Material Design guidelines: Selection Controls – Radio buttons](https://material.io/guidelines/components/selection-controls.html#selection-controls-radio-button)\n- [Demo](https://aforemny.github.io/elm-mdc/#radio-buttons)\n\n\n# Example\n\n```elm\nimport Html exposing (text)\nimport Material.FormField as FormField\nimport Material.Options as Options exposing (styled, cs)\nimport Material.RadioButton as RadioButton\n\n\nFormField.view []\n [ RadioButton.view Mdc [0] model.mdc\n [ RadioButton.selected\n , Options.onClick Select\n ]\n []\n , Html.label\n [ Options.onClick Select\n ]\n [ text \"Radio\"\n ]\n ]\n```\n\n# Usage\n@docs Property\n@docs view\n@docs selected\n@docs disabled\n@docs nativeControl\n",
"aliases": [
{
"name": "Property",
"comment": " RadioButton property.\n",
"args": [
"m"
],
"type": "Material.Internal.RadioButton.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "disabled",
"comment": " Disable the radio button.\n",
"type": "Material.RadioButton.Property m"
},
{
"name": "nativeControl",
"comment": " Apply properties to underlying native control element.\n",
"type": "List (Material.Options.Property () m) -> Material.RadioButton.Property m"
},
{
"name": "selected",
"comment": " Make the radio button selected.\n\nDefaults to not selected. Use `Options.when` to make it interactive.\n",
"type": "Material.RadioButton.Property m"
},
{
"name": "view",
"comment": " RadioButton view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.RadioButton.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Textfield",
"comment": "\nText fields allow users to input, edit, and select text.\n\n\n# Resources\n\n- [Material Design guidelines: Text Fields](https://material.io/guidelines/components/text-fields.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#text-field)\n\n\n# Example\n\n```elm\nimport Material.Textfield as Textfield\n\nTextfield.view Mdc [0] model.mdc\n [ Textfield.label \"Text field\"\n ]\n []\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs label\n@docs value\n@docs placeholder\n@docs box\n@docs outlined\n@docs fullwidth\n@docs disabled\n@docs dense\n@docs email\n@docs password\n@docs type_\n@docs textarea\n@docs rows\n@docs cols\n@docs leadingIcon\n@docs trailingIcon\n@docs iconUnclickable\n@docs required\n@docs invalid\n@docs pattern\n@docs nativeControl\n",
"aliases": [
{
"name": "Property",
"comment": " Textfield property.\n",
"args": [
"m"
],
"type": "Material.Internal.Textfield.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "box",
"comment": " Style the textfield as a box textfield.\n",
"type": "Material.Textfield.Property m"
},
{
"name": "cols",
"comment": " Set the number of columns in a `textarea` textfield.\n",
"type": "Int -> Material.Textfield.Property m"
},
{
"name": "dense",
"comment": " Style the textfield as a dense textfield.\n",
"type": "Material.Textfield.Property m"
},
{
"name": "disabled",
"comment": " Disable the textfield.\n",
"type": "Material.Textfield.Property m"
},
{
"name": "email",
"comment": " Set the textfield's `type` to `email`.\n",
"type": "Material.Textfield.Property m"
},
{
"name": "fullwidth",
"comment": " Make the textfield take up all the available horizontal space.\n",
"type": "Material.Textfield.Property m"
},
{
"name": "iconUnclickable",
"comment": " Make textfield icons unclickable.\n",
"type": "Material.Textfield.Property m"
},
{
"name": "invalid",
"comment": " Mark the textfield as invalid.\n",
"type": "Material.Textfield.Property m"
},
{
"name": "label",
"comment": " Set a label for the textfield.\n",
"type": "String -> Material.Textfield.Property m"
},
{
"name": "leadingIcon",
"comment": " Add a leading icon to the textfield.\n",
"type": "String -> Material.Textfield.Property m"
},
{
"name": "nativeControl",
"comment": " Apply properties to underlying native control element.\n",
"type": "List (Material.Options.Property () m) -> Material.Textfield.Property m"
},
{
"name": "outlined",
"comment": " Style the textfield as an outlined textfield.\n",
"type": "Material.Textfield.Property m"
},
{
"name": "password",
"comment": " Set the textfield's `type` to `password`.\n",
"type": "Material.Textfield.Property m"
},
{
"name": "pattern",
"comment": " Set a pattern to validate the textfield's input against.\n\nThe text field is automatically marked invalid if the pattern does not match\nits input.\n",
"type": "String -> Material.Textfield.Property m"
},
{
"name": "placeholder",
"comment": " Sets the placeholder of the textfield.\n",
"type": "String -> Material.Textfield.Property m"
},
{
"name": "required",
"comment": " Mark the textfield as required.\n",
"type": "Material.Textfield.Property m"
},
{
"name": "rows",
"comment": " Set the number of rows in a `textarea` textfield.\n",
"type": "Int -> Material.Textfield.Property m"
},
{
"name": "textarea",
"comment": " Make the textfield a `textarea` element instead of `input`.\n",
"type": "Material.Textfield.Property m"
},
{
"name": "trailingIcon",
"comment": " Add a trailing icon to the textfield.\n",
"type": "String -> Material.Textfield.Property m"
},
{
"name": "type_",
"comment": " Set the textfield's type.\n",
"type": "String -> Material.Textfield.Property m"
},
{
"name": "value",
"comment": " Set the textfield's value.\n",
"type": "String -> Material.Textfield.Property m"
},
{
"name": "view",
"comment": " Textfield view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Textfield.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.GridList",
"comment": "\nGrid List provides a RTL-aware Material Design Grid list component adhering to\nthe Material Design Grid list spec. Grid Lists are best suited for presenting\nhomogeneous data, typically images. Each item in a grid list is called a tile.\nTiles maintain consistent width, height, and padding across screen sizes.\n\n\n# Resources\n\n- [Material Design guidelines: Grid lists](https://material.io/guidelines/components/grid-lists.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#grid-list)\n\n\n# Example\n\n```elm\nimport Html exposing (text)\nimport Material.GridList as GridList\n\n\nGridList.view Mdc [0] model.mdc []\n ( List.repeat 6 <|\n GridList.tile []\n [ GridList.primary []\n [ GridList.image [] \"images/1-1.jpg\"\n ]\n , GridList.secondary []\n [ GridList.title []\n [ text \"Tile Title\"\n ]\n ]\n ]\n )\n```\n\n\n# Usage\n\n\n## Grid List\n\n@docs Property\n@docs view\n@docs headerCaption, twolineCaption\n@docs gutter1\n@docs iconAlignStart, iconAlignEnd\n@docs tileAspect16To9, tileAspect4To3, tileAspect3To4, tileAspect2To3, tileAspect3To2\n\n\n## Tiles\n\n@docs tile\n@docs primary\n@docs secondary\n@docs image\n@docs icon\n@docs title\n@docs supportText\n@docs primaryContent\n",
"aliases": [
{
"name": "Property",
"comment": " GridList property.\n",
"args": [
"m"
],
"type": "Material.Internal.GridList.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "gutter1",
"comment": " Style a GridList to have a 1px padding.\n\nBy default a GridList has a 4px padding.\n",
"type": "Material.GridList.Property m"
},
{
"name": "headerCaption",
"comment": " Style a GridList so that its tiles have a header caption.\n\nBy default GridList tile's have a footer caption.\n",
"type": "Material.GridList.Property m"
},
{
"name": "icon",
"comment": " Add an icon to a tile's caption.\n\nShould be a direct child of `secondary`.\n",
"type": "List (Material.GridList.Property m) -> String -> Html.Html m"
},
{
"name": "iconAlignEnd",
"comment": " Configure a GridList tile's icon to be aligned to the end.\n",
"type": "Material.GridList.Property m"
},
{
"name": "iconAlignStart",
"comment": " Configure a GridList tile's icon to be aligned to the start.\n",
"type": "Material.GridList.Property m"
},
{
"name": "image",
"comment": " Specify an image as a GridList tile's primary content.\n",
"type": "List (Material.GridList.Property m) -> String -> Html.Html m"
},
{
"name": "primary",
"comment": " GridList tile's primary block.\n\nContains `primaryContent` or `image`.\n",
"type": "List (Material.GridList.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "primaryContent",
"comment": " GridList tile's primary content wrapper.\n\nShould be a d direct child of `primary`.\n",
"type": "List (Material.GridList.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "secondary",
"comment": " GridList tile's secondary block.\n\nThis contains the caption made up of `title`, `icon` and/or `supportText`.\n",
"type": "List (Material.GridList.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "supportText",
"comment": " Add supporting text to a tile's caption.\n\nShould be a direct child of `secondary`.\n",
"type": "List (Material.GridList.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "tile",
"comment": " GridList tile.\n",
"type": "List (Material.GridList.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "tileAspect16To9",
"comment": " Style a GridList so that its tiles `primary` content preserves a 16 to 9\naspect ratio.\n",
"type": "Material.GridList.Property m"
},
{
"name": "tileAspect2To3",
"comment": " Style a GridList so that its tiles `primary` content preserves a 2 to 3\naspect ratio.\n",
"type": "Material.GridList.Property m"
},
{
"name": "tileAspect3To2",
"comment": " Style a GridList so that its tiles `primary` content preserves a 3 to 2\naspect ratio.\n",
"type": "Material.GridList.Property m"
},
{
"name": "tileAspect3To4",
"comment": " Style a GridList so that its tiles `primary` content preserves a 3 to 4\naspect ratio.\n",
"type": "Material.GridList.Property m"
},
{
"name": "tileAspect4To3",
"comment": " Style a GridList so that its tiles `primary` content preserves a 4 to 3\naspect ratio.\n",
"type": "Material.GridList.Property m"
},
{
"name": "title",
"comment": " Add a title caption to the tile.\n\nShould be a direct child of `secondary`.\n",
"type": "List (Material.GridList.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "twolineCaption",
"comment": " Style a GridList so that tile's captions have two lines.\n\nBy default a tile's caption is single line.\n",
"type": "Material.GridList.Property m"
},
{
"name": "view",
"comment": " GridList view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.GridList.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Tabs",
"comment": "\nThe Tabs component contains components which are used to create spec-aligned\ntabbed navigation components adhering to the Material Design tabs guidelines.\n\nThis component consists of a TabBar containing Tabs. It supports scrolling of\nTabs.\n\n# Resources\n\n- [Material Design guidelines: Tabs](https://material.io/guidelines/components/tabs.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#tabs)\n\n\n# Example\n\n```elm\nimport Html exposing (text)\nimport Material.Tabs as TabBar\n\n\nTabBar.view Mdc [0] model.mdc\n [ TabBar.indicator\n ]\n [ TabBar.tab [] [ text \"Item One\" ]\n , TabBar.tab [] [ text \"Item Two\" ]\n , TabBar.tab [] [ text \"Item Three\" ]\n ]\n```\n\n\n# Usage\n\n## TabBar\n\n@docs Property\n@docs view\n@docs scrolling\n@docs indicator\n\n\n## Tabs\n\n@docs Tab\n@docs tab\n@docs withIconAndText\n@docs icon\n@docs iconText\n",
"aliases": [
{
"name": "Property",
"comment": " TabBar property.\n",
"args": [
"m"
],
"type": "Material.Internal.Tabs.Implementation.Property m"
},
{
"name": "Tab",
"comment": " A TabBar's tab type.\n\nUse `tab` to construct.\n",
"args": [
"m"
],
"type": "Material.Internal.Tabs.Implementation.Tab m"
}
],
"types": [],
"values": [
{
"name": "icon",
"comment": " A tab's icon.\n",
"type": "List (Material.Options.Property c m) -> String -> Html.Html m"
},
{
"name": "iconText",
"comment": " A tab's icon text.\n",
"type": "List (Material.Options.Property c m) -> String -> Html.Html m"
},
{
"name": "indicator",
"comment": " Make the TabBar's tabs have an active indicator.\n",
"type": "Material.Tabs.Property m"
},
{
"name": "scrolling",
"comment": " Make the TabBar scroll if its tabs do not fit inside.\n\nDisplays forward and backward navigation arrows on either side if necessary and\nadvances scroll on pressing the Tab key.\n",
"type": "Material.Tabs.Property m"
},
{
"name": "tab",
"comment": " A TabBar's tab.\n",
"type": "List (Material.Tabs.Property m) -> List (Html.Html m) -> Material.Tabs.Tab m"
},
{
"name": "view",
"comment": " TabBar view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Tabs.Property m) -> List (Material.Tabs.Tab m) -> Html.Html m"
},
{
"name": "withIconAndText",
"comment": " Configure tab to show both an icon and a text.\n\nUse `icon` and `iconText` as children.\n",
"type": "Material.Tabs.Property m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Button",
"comment": "\nThe Button component is a spec-aligned button component adhering to the\nMaterial Design button requirements.\n\n\n# Resources\n\n- [Material Design guidelines: Buttons](https://material.io/guidelines/components/buttons.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#buttons)\n\n\n# Example\n\n```elm\nimport Html exposing (text)\nimport Material.Button as Button\nimport Material.Options as Options\n\n\nButton.view Mdc [0] model.mdc\n [ Button.ripple\n , Options.onClick Click\n ]\n [ text \"Button\"\n ]\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs ripple\n@docs raised\n@docs unelevated\n@docs stroked\n@docs dense\n@docs compact\n@docs icon\n@docs disabled\n@docs link\n@docs onClick\n",
"aliases": [
{
"name": "Property",
"comment": " Button property.\n",
"args": [
"m"
],
"type": "Material.Internal.Button.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "compact",
"comment": " Reduce the amount of horizontal padding in the button.\n",
"type": "Material.Button.Property m"
},
{
"name": "dense",
"comment": " Make button's text slightly smaller.\n",
"type": "Material.Button.Property m"
},
{
"name": "disabled",
"comment": " Disable the button.\n",
"type": "Material.Button.Property m"
},
{
"name": "icon",
"comment": " Give the button an icon.\n",
"type": "String -> Material.Button.Property m"
},
{
"name": "link",
"comment": " Make the button be an anchor tag instead of a div.\n",
"type": "String -> Material.Button.Property m"
},
{
"name": "onClick",
"comment": " Click handler that respects `ripple`.\n\nThe event will be raised only after the ripple animation finished playing. If\nthe button does not ripple, it is identical to `Options.onClick`.\n",
"type": "m -> Material.Button.Property m"
},
{
"name": "raised",
"comment": " Make the button elevated upon the surface.\n",
"type": "Material.Button.Property m"
},
{
"name": "ripple",
"comment": " Enable ripple ink effect for the button.\n",
"type": "Material.Button.Property m"
},
{
"name": "stroked",
"comment": " Make the button flush with the surface, but have a visible border.\n",
"type": "Material.Button.Property m"
},
{
"name": "unelevated",
"comment": " Make the button flush with the surface.\n",
"type": "Material.Button.Property m"
},
{
"name": "view",
"comment": " Button view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Button.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Switch",
"comment": "\nThe Switch component is a spec-aligned switch component adhering to the\nMaterial Design Switch requirements.\n\n\n# Resources\n\n- [Material Design guidelines: Switches](https://material.io/guidelines/components/selection-controls.html#selection-controls-switch)\n- [Demo](https://aforemny.github.io/elm-mdc/#switch)\n\n\n# Example\n\n\n```elm\nimport Html exposing (text)\nimport Material.FormField as FormField\nimport Material.Options as Options exposing (styled)\nimport Material.Switch as Switch\n\n\nFormField.view []\n [ Switch.view Mdc [0] model.mdc\n [ Switch.on\n , Options.onClick Toggle\n ]\n []\n , Html.label\n [ Options.onClick Toggle\n ]\n [ text \"on/off\"\n ]\n ]\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs on\n@docs disabled\n@docs nativeControl\n",
"aliases": [
{
"name": "Property",
"comment": " Switch property.\n",
"args": [
"m"
],
"type": "Material.Internal.Switch.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "disabled",
"comment": " Disable the switch.\n",
"type": "Material.Switch.Property m"
},
{
"name": "nativeControl",
"comment": " Apply properties to underlying native control element.\n",
"type": "List (Material.Options.Property () m) -> Material.Switch.Property m"
},
{
"name": "on",
"comment": " Make switch display its \"on\" state.\n\nDefaults to \"off\". Use `Options.when` to make it interactive.\n",
"type": "Material.Switch.Property m"
},
{
"name": "view",
"comment": " Switch view.\n",
"type": "(Material.Msg m -> m) -> Material.Component.Index -> Material.Model m -> List (Material.Switch.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material",
"comment": "\nMaterial is a re-implementation of Google's Material Components for Web (MDC\nWeb) library in pure Elm, with resorting to JavaScript assets only when\nabsolutely necessary.\n\nThis module defines the basic boilerplate that you will have to set up to use\nthis library, with individual components living in their respective modules.\n\nHave a look at the following example to get you started. Most parts should\ncorrespond to your basic TEA program.\n\nSome things of note are:\n\n- `Material.Model` and `Material.Msg` have to know your top-level message type\n `Msg` for technical reasons.\n- Your message constructor `Mdc : Material.Msg Msg -> Msg` *lifts* internal\n component messages to your top-level message type and appears throughout the\n library.\n- To distinguish components, ie. one button from another, this library uses a\n list of integers as indices. Those indices must be unique within a\n `Material.Model`, but you can have as many `Material.Model`s as you like.\n\nHave a look at the demo's source code for an example of how to structure large\napplications using this library.\n\nYou are expected to have a `index.html` set up and include the following\nresources:\n\n```html\n<link href=\"https://fonts.googleapis.com/css?family=Roboto+Mono\" rel=\"stylesheet\">\n<link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500\" rel=\"stylesheet\">\n<link href=\"https://fonts.googleapis.com/icon?family=Material+Icons\" rel=\"stylesheet\">\n<link href=\"https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css\" rel=\"stylesheet\">\n<script src=\"elm-autofocus.js\"></script>\n<script src=\"elm-focus-trap.js\"></script>\n<script src=\"elm-global-events.js\"></script>\n<script src=\"elm-mdc.js\"></script>\n```\n\n# Resources\n\n- [Demo](https://aforemny.github.io/elm-mdc)\n\n\n# Example\n\n```elm\nimport Html exposing (Html, text)\nimport Material\nimport Material.Button as Button\nimport Material.Options as Options\n\n\ntype alias Model\n { mdc : Material.Model Msg\n }\n\n\ndefaultModel : Model\ndefaultModel =\n { mdc = Material.defaultModel\n }\n\n\ntype Msg\n = Mdc (Material.Msg Msg)\n | Click\n\n\nmain : Program Never Model Msg\nmain =\n Html.program\n { init = init\n , subscriptions = subscriptions\n , update = update\n , view = view\n }\n\n\ninit : ( Model, Cmd Msg )\ninit =\n ( defaultModel, Material.init Mdc )\n\n\nsubscriptions : Model -> Sub Msg\nsubscriptions model =\n Material.subscriptions Mdc model\n\n\nupdate : Msg -> Model -> ( Model, Cmd Msg )\nupdate msg model =\n case msg of\n Mdc msg_ ->\n Material.update Mdc msg_ model\n\n Click ->\n let\n _ =\n Debug.log \"Msg\" \"Click\"\n in\n ( model, Cmd.none )\n\n\nview : Model -> Html Msg\nview model =\n Material.top <|\n Html.div []\n [\n Button.view Mdc [0] model.mdc\n [ Button.ripple\n , Options.onClick Click\n ]\n [ text \"Click me!\" ]\n ]\n```\n\n\n# Usage\n\n## The Elm Architecture\n\n@docs Model\n@docs defaultModel\n@docs Msg\n@docs init\n@docs subscriptions\n@docs update\n\n## Prototyping\n\n@docs top\n",
"aliases": [
{
"name": "Model",
"comment": " Material model.\n\nThis takes as argument a reference to your top-level message type `Msg`.\n\n```elm\ntype alias Model =\n { mdc : Material.Model Msg\n , …\n }\n```\n",
"args": [
"m"
],
"type": "{ button : Material.Internal.Component.Indexed Material.Internal.Button.Model.Model , checkbox : Material.Internal.Component.Indexed Material.Internal.Checkbox.Model.Model , dialog : Material.Internal.Component.Indexed Material.Internal.Dialog.Model.Model , drawer : Material.Internal.Component.Indexed Material.Internal.Drawer.Model.Model , fab : Material.Internal.Component.Indexed Material.Internal.Fab.Model.Model , gridList : Material.Internal.Component.Indexed Material.Internal.GridList.Model.Model , iconToggle : Material.Internal.Component.Indexed Material.Internal.IconToggle.Model.Model , menu : Material.Internal.Component.Indexed Material.Internal.Menu.Model.Model , radio : Material.Internal.Component.Indexed Material.Internal.RadioButton.Model.Model , ripple : Material.Internal.Component.Indexed Material.Internal.Ripple.Model.Model , select : Material.Internal.Component.Indexed Material.Internal.Select.Model.Model , slider : Material.Internal.Component.Indexed Material.Internal.Slider.Model.Model , snackbar : Material.Internal.Component.Indexed (Material.Internal.Snackbar.Model.Model m) , switch : Material.Internal.Component.Indexed Material.Internal.Switch.Model.Model , tabs : Material.Internal.Component.Indexed Material.Internal.Tabs.Model.Model , textfield : Material.Internal.Component.Indexed Material.Internal.Textfield.Model.Model , toolbar : Material.Internal.Component.Indexed Material.Internal.Toolbar.Model.Model }"
},
{
"name": "Msg",
"comment": " Material message type.\n\nThis takes as argument a reference to your top-level message type `Msg`.\n\n```elm\ntype Msg\n = Mdc (Material.Msg Msg)\n | …\n```\n",
"args": [
"m"
],
"type": "Material.Internal.Msg.Msg m"
}
],
"types": [],
"values": [
{
"name": "defaultModel",
"comment": " Material default model.\n\n```elm\ndefaultModel =\n { mdc = Material.defaultModel\n , …\n }\n```\n",
"type": "Material.Model m"
},
{
"name": "init",
"comment": " Material init.\n\n```elm\ninit =\n let\n defaultModel =\n …\n\n effects =\n Cmd.map\n [ Material.init Mdc\n , …\n ]\n in\n ( defaultModel, effects )\n```\n",
"type": "(Material.Msg m -> m) -> Platform.Cmd.Cmd m"
},
{
"name": "subscriptions",
"comment": " Material subscriptions.\n\n```elm\nsubscriptions model =\n Sub.batch\n [ Material.subscriptions Mdc model\n , …\n ]\n```\n",
"type": "(Material.Msg m -> m) -> { model | mdc : Material.Model m } -> Platform.Sub.Sub m"
},
{
"name": "top",
"comment": " A top-level wrapper for quick prototyping. This wraps your HTML content and\nadds the necessary CSS and JavaScript imports.\n\nFor production use, you will want to do this yourself in `index.html` to\nprevent an unstyled flash of content and to properly manage assets.\n",
"type": "Html.Html a -> Html.Html a"
},
{
"name": "update",
"comment": " Material update.\n\n```elm\n update msg model =\n case msg of\n Mdc msg_ ->\n Material.update Mdc msg_ model\n\n …\n```\n",
"type": "(Material.Msg m -> m) -> Material.Msg m -> { c | mdc : Material.Model m } -> ( { c | mdc : Material.Model m }, Platform.Cmd.Cmd m )"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Typography",
"comment": "\nMaterial Design's text sizes and styles were developed to balance content\ndensity and reading comfort under typical usage conditions.\n\n\n# Resources\n\n- [Material Design guidelines: Typography](https://material.io/guidelines/style/typography.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#typography)\n\n\n# Example\n\n```\nimport Html exposing (text)\nimport Material.Options exposing (styled)\nimport Material.Typography as Typography\n\nstyled Html.div\n [ Typography.typography\n ]\n [ styled Html.h1\n [ Typography.display4\n ]\n [ text \"Big header\"\n ]\n ]\n```\n\n\n# Usage\n\n@docs typography\n@docs display4, display3, display2, display1\n@docs headline\n@docs title\n@docs subheading2, subheading1\n@docs body2, body1\n@docs caption\n@docs button\n@docs adjustMargin\n",
"aliases": [],
"types": [],
"values": [
{
"name": "adjustMargin",
"comment": " Positions text, used in conjunction with font classes above.\n\nThis property will change the margin properties of the element it is applied\nto, to align text correctly. It should only be used in a text context; using\nthis property on UI elements such as buttons may cause them to be positioned\nincorrectly.\n",
"type": "Material.Options.Property c m"
},
{
"name": "body1",
"comment": " Sets font properties as Body 1.\n",
"type": "Material.Options.Property c m"
},
{
"name": "body2",
"comment": " Sets font properties as Body 2.\n",
"type": "Material.Options.Property c m"
},
{
"name": "button",
"comment": " Sets font properties as Button.\n",
"type": "Material.Options.Property c m"
},
{
"name": "caption",
"comment": " Sets font properties as Caption.\n",
"type": "Material.Options.Property c m"
},
{
"name": "display1",
"comment": " Sets font properties as Display 1.\n",
"type": "Material.Options.Property c m"
},
{
"name": "display2",
"comment": " Sets font properties as Display 2.\n",
"type": "Material.Options.Property c m"
},
{
"name": "display3",
"comment": " Sets font properties as Display 3.\n",
"type": "Material.Options.Property c m"
},
{
"name": "display4",
"comment": " Sets font properties as Display 4.\n",
"type": "Material.Options.Property c m"
},
{
"name": "headline",
"comment": " Sets font properties as Headline.\n",
"type": "Material.Options.Property c m"
},
{
"name": "subheading1",
"comment": " Sets font properties as Subheading 1.\n",
"type": "Material.Options.Property c m"
},
{
"name": "subheading2",
"comment": " Sets font properties as Subheading 2.\n",
"type": "Material.Options.Property c m"
},
{
"name": "title",
"comment": " Sets font properties as Title.\n",
"type": "Material.Options.Property c m"
},
{
"name": "typography",
"comment": " Sets the font to Roboto.\n",
"type": "Material.Options.Property c m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Theme",
"comment": "\nThis color palette comprises primary and secondary colors that can be used for\nillustration or to develop your brand colors.\n\nThe colors in this module are derived from three theme colors:\n\n- Primary: the primary color used in your application, applies to a number of\n UI elements.\n- Secondary: the secondary color used in your application, applies to a number\n of UI elements. (Previously called \"accent\".)\n- Background: the background color for your application, aka the color on top\n of which your UI is drawn.\n\nand five text styles:\n\n- Primary: used for most text\n- Secondary: used for text which is lower in the visual hierarchy\n- Hint: used for text hints, such as those in text fields and labels\n- Disabled: used for text in disabled components and content\n- Icon: used for icons\n\n\n# Resources\n\n- [Material Design guidelines: Color](https://material.io/guidelines/style/color.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#theme)\n\n\n# Usage\n\n\n## Text color\n\n@docs primary, primaryLight, primaryDark\n@docs secondary, secondaryLight, secondaryDark\n\n\n## Background colors\n\n@docs background\n@docs primaryBg, primaryLightBg, primaryDarkBg\n@docs secondaryBg, secondaryLightBg, secondaryDarkBg\n\n\n## Text colors on specific background colors\n\n@docs textPrimaryOnPrimary\n@docs textSecondaryOnPrimary\n@docs textHintOnPrimary\n@docs textDisabledOnPrimary\n@docs textIconOnPrimary\n@docs textPrimaryOnSecondary\n@docs textSecondaryOnSecondary\n@docs textHintOnSecondary\n@docs textDisabledOnSecondary\n@docs textIconOnSecondary\n@docs textPrimaryOnBackground\n@docs textSecondaryOnBackground\n@docs textHintOnBackground\n@docs textDisabledOnBackground\n@docs textIconOnBackground\n\n\n## Text colors on generic background colors\n\n@docs textPrimaryOnLight\n@docs textSecondaryOnLight\n@docs textHintOnLight\n@docs textDisabledOnLight\n@docs textIconOnLight\n@docs textPrimaryOnDark\n@docs textSecondaryOnDark\n@docs textHintOnDark\n@docs textDisabledOnDark\n@docs textIconOnDark\n",
"aliases": [],
"types": [],
"values": [
{
"name": "background",
"comment": " Sets the background color to the theme background color.\n",
"type": "Material.Options.Property c m"
},
{
"name": "primary",
"comment": " Sets the text color to the theme primary color.\n",
"type": "Material.Options.Property c m"
},
{
"name": "primaryBg",
"comment": " Sets the background color to the theme primary color.\n",
"type": "Material.Options.Property c m"
},
{
"name": "primaryDark",
"comment": " Sets the text color to the theme primary color (dark variant).\n",
"type": "Material.Options.Property c m"
},
{
"name": "primaryDarkBg",
"comment": " Sets the background color to the theme primary color (dark variant).\n",
"type": "Material.Options.Property c m"
},
{
"name": "primaryLight",
"comment": " Sets the text color to the theme primary color (light variant).\n",
"type": "Material.Options.Property c m"
},
{
"name": "primaryLightBg",
"comment": " Sets the background color to the theme primary color (light variant).\n",
"type": "Material.Options.Property c m"
},
{
"name": "secondary",
"comment": " Sets the text color to the theme secondary color.\n",
"type": "Material.Options.Property c m"
},
{
"name": "secondaryBg",
"comment": " Sets the background color to the theme secondary color.\n",
"type": "Material.Options.Property c m"
},
{
"name": "secondaryDark",
"comment": " Sets the text color to the theme secondary color (dark variant).\n",
"type": "Material.Options.Property c m"
},
{
"name": "secondaryDarkBg",
"comment": " Sets the background color to the theme secondary color (dark variant).\n",
"type": "Material.Options.Property c m"
},
{
"name": "secondaryLight",
"comment": " Sets the text color to the theme secondary color (light variant).\n",
"type": "Material.Options.Property c m"
},
{
"name": "secondaryLightBg",
"comment": " Sets the background color to the theme secondary color (light variant).\n",
"type": "Material.Options.Property c m"
},
{
"name": "textDisabledOnBackground",
"comment": " Sets text to a suitable color for disabled text on top of background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textDisabledOnDark",
"comment": " Sets text to a suitable color for disabled text on top of dark background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textDisabledOnLight",
"comment": " Sets text to a suitable color for disabled text on top of light background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textDisabledOnPrimary",
"comment": " Sets text to a suitable color for disabled text on top of primary color\nbackground.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textDisabledOnSecondary",
"comment": " Sets text to a suitable color for disabled text on top of secondary color\nbackground.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textHintOnBackground",
"comment": " Sets text to a suitable color for hint text on top of background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textHintOnDark",
"comment": " Sets text to a suitable color for hint text on top of dark background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textHintOnLight",
"comment": " Sets text to a suitable color for hint text on top of light background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textHintOnPrimary",
"comment": " Sets text to a suitable color for hint text on top of primary color\nbackground.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textHintOnSecondary",
"comment": " Sets text to a suitable color for hint text on top of secondary color\nbackground.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textIconOnBackground",
"comment": " Sets text to a suitable color for icons on top of background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textIconOnDark",
"comment": " Sets text to a suitable color for icons on top of dark background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textIconOnLight",
"comment": " Sets text to a suitable color for icons on top of light background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textIconOnPrimary",
"comment": " Sets text to a suitable color for icons on top of primary color\nbackground.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textIconOnSecondary",
"comment": " Sets text to a suitable color for icons on top of secondary color\nbackground.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textPrimaryOnBackground",
"comment": " Sets text to a suitable color for primary text on top of background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textPrimaryOnDark",
"comment": " Sets text to a suitable color for primary text on top of dark background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textPrimaryOnLight",
"comment": " Sets text to a suitable color for primary text on top of light background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textPrimaryOnPrimary",
"comment": " Sets text to a suitable color for primary text on top of primary color\nbackground.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textPrimaryOnSecondary",
"comment": " Sets text to a suitable color for primary text on top of secondary color\nbackground.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textSecondaryOnBackground",
"comment": " Sets text to a suitable color for secondary text on top of background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textSecondaryOnDark",
"comment": " Sets text to a suitable color for secondary text on top of dark background.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textSecondaryOnLight",
"comment": " Sets text to a suitable color for secondary text on top of light\nbackground.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textSecondaryOnPrimary",
"comment": " Sets text to a suitable color for secondary text on top of primary color\nbackground.\n",
"type": "Material.Options.Property c m"
},
{
"name": "textSecondaryOnSecondary",
"comment": " Sets text to a suitable color for secondary text on top of secondary color\nbackground.\n",
"type": "Material.Options.Property c m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Elevation",
"comment": "\nShadows provide important visual cues about objects’ depth and directional\nmovement. They are the only visual cue indicating the amount of separation\nbetween surfaces. An object’s elevation determines the appearance of its\nshadow. The elevation values are mapped out in a \"z-space\" and range from 0 to\n24.\n\n\n# Resources\n\n- [Material Design guidelines: Shadows & elevation](https://material.io/components/web/catalog/elevation/)\n- [Demo](https://aforemny.github.io/elm-mdc/#elevation)\n\n\n# Example\n\n```elm\nimport Html exposing (text)\nimport Material.Elevation as Elevation\nimport Material.Options exposing (styled)\n\n\nstyled Html.div\n [ Elevation.z8\n ]\n [ text \"Hello\"\n ]\n```\n\n\n# Usage\n\n@docs z0, z1, z2, z3, z4, z5, z6, z7, z8\n@docs z9, z10, z11, z12, z13, z14, z15, z16\n@docs z17, z18, z19, z20, z21, z22, z23, z24\n@docs transition\n",
"aliases": [],
"types": [],
"values": [
{
"name": "transition",
"comment": " Applies the correct css rules to transition an element between elevations.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z0",
"comment": " Sets the elevation to 0 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z1",
"comment": " Sets the elevation to 1 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z10",
"comment": " Sets the elevation to 10 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z11",
"comment": " Sets the elevation to 11 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z12",
"comment": " Sets the elevation to 12 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z13",
"comment": " Sets the elevation to 13 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z14",
"comment": " Sets the elevation to 14 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z15",
"comment": " Sets the elevation to 15 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z16",
"comment": " Sets the elevation to 16 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z17",
"comment": " Sets the elevation to 17 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z18",
"comment": " Sets the elevation to 18 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z19",
"comment": " Sets the elevation to 19 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z2",
"comment": " Sets the elevation to 2 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z20",
"comment": " Sets the elevation to 20 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z21",
"comment": " Sets the elevation to 21 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z22",
"comment": " Sets the elevation to 22 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z23",
"comment": " Sets the elevation to 23 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z24",
"comment": " Sets the elevation to 24 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z3",
"comment": " Sets the elevation to 3 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z4",
"comment": " Sets the elevation to 4 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z5",
"comment": " Sets the elevation to 5 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z6",
"comment": " Sets the elevation to 6 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z7",
"comment": " Sets the elevation to 7 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z8",
"comment": " Sets the elevation to 8 dp.\n",
"type": "Material.Options.Property c m"
},
{
"name": "z9",
"comment": " Sets the elevation to 9 dp.\n",
"type": "Material.Options.Property c m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Options",
"comment": "\n\n# Properties\n\n@docs Property, styled\n@docs cs, css\n@docs many\n@docs when\n@docs nop\n@docs attribute\n@docs data, aria\n\n\n# Events\n\n@docs on\n@docs onWithOptions\n\n@docs onClick\n@docs onDoubleClick\n@docs onMouseDown\n@docs onMouseUp\n@docs onMouseEnter\n@docs onMouseLeave\n@docs onMouseOver\n@docs onMouseOut\n\n@docs onInput, onChange\n@docs onCheck\n@docs onSubmit\n\n@docs onBlur\n@docs onFocus\n",
"aliases": [
{
"name": "Property",
"comment": " Generic component property.\n\nThe `c` stands for a component's configuration type, and each component exports\nits own `Property`.\n",
"args": [
"c",
"m"
],
"type": "Material.Internal.Options.Property c m"
}
],
"types": [],
"values": [
{
"name": "aria",
"comment": " HTML aria-* attributes. Prefix \"aria-\" is added automatically.\n",
"type": "String -> String -> Material.Options.Property c m"
},
{
"name": "attribute",
"comment": " Install arbitrary `Html.Attribute`s.\n\n```elm\nstyled Html.div\n [ Options.attribute <| Html.title \"title\" ]\n [ … ]\n```\n",
"type": "Html.Attribute Basics.Never -> Material.Options.Property c m"
},
{
"name": "cs",
"comment": " Add a HTML class to a component.\n",
"type": "String -> Material.Options.Property c m"
},
{
"name": "css",
"comment": " Add a CSS style to a component.\n",
"type": "String -> String -> Material.Options.Property c m"
},
{
"name": "data",
"comment": " HTML data-* attributes. Prefix \"data-\" is added automatically.\n",
"type": "String -> String -> Material.Options.Property c m"
},
{
"name": "many",
"comment": " Multiple options.\n",
"type": "List (Material.Options.Property c m) -> Material.Options.Property c m"
},
{
"name": "nop",
"comment": " Do nothing. Convenient when the absence or\npresence of Options depends dynamically on other values, e.g.,\n\n```elm\nHtml.div\n [ if isActive then cs \"active\" else nop ]\n [ … ]\n```\n",
"type": "Material.Options.Property c m"
},
{
"name": "on",
"comment": " ",
"type": "String -> Json.Decode.Decoder m -> Material.Options.Property c m"
},
{
"name": "onBlur",
"comment": " ",
"type": "msg -> Material.Options.Property c msg"
},
{
"name": "onChange",
"comment": " ",
"type": "(String -> m) -> Material.Options.Property c m"
},
{
"name": "onCheck",
"comment": " ",
"type": "(Bool -> msg) -> Material.Options.Property c msg"
},
{
"name": "onClick",
"comment": " ",
"type": "msg -> Material.Options.Property c msg"
},
{
"name": "onDoubleClick",
"comment": " ",
"type": "msg -> Material.Options.Property c msg"
},
{
"name": "onFocus",
"comment": " ",
"type": "msg -> Material.Options.Property c msg"
},
{
"name": "onInput",
"comment": " ",
"type": "(String -> m) -> Material.Options.Property c m"
},
{
"name": "onMouseDown",
"comment": " ",
"type": "msg -> Material.Options.Property c msg"
},
{
"name": "onMouseEnter",
"comment": " ",
"type": "msg -> Material.Options.Property c msg"
},
{
"name": "onMouseLeave",
"comment": " ",
"type": "msg -> Material.Options.Property c msg"
},
{
"name": "onMouseOut",
"comment": " ",
"type": "msg -> Material.Options.Property c msg"
},
{
"name": "onMouseOver",
"comment": " ",
"type": "msg -> Material.Options.Property c msg"
},
{
"name": "onMouseUp",
"comment": " ",
"type": "msg -> Material.Options.Property c msg"
},
{
"name": "onSubmit",
"comment": " ",
"type": "(String -> m) -> Material.Options.Property c m"
},
{
"name": "onWithOptions",
"comment": " ",
"type": "String -> Html.Events.Options -> Json.Decode.Decoder m -> Material.Options.Property c m"
},
{
"name": "styled",
"comment": " Make a standard Html element take properties instead of attributes.\n\n```elm\nstyled Html.div\n [ css \"margin\" \"0 auto\"\n ]\n [ text \"\"\n ]\n```\n\nNote: Most frequently you use styled with a more specialize type on `Html.*`\nelements, \n\n```elm\nstyled\n : (List (Attribute m) -> List (Html m) -> Html m)\n -> List (Property c m)\n -> List (Html m) -> Html m\n```\n\nThe type annotation for `styled` is more general so that it also works with\n`Markdown.toHtml`, etc.\n",
"type": "(List (Html.Attribute m) -> a) -> List (Material.Options.Property c m) -> a"
},
{
"name": "when",
"comment": " Conditional option. When the guard evaluates to `true`, the option is\napplied; otherwise it is ignored. Use like this:\n\n Button.disabled |> when (not model.isRunning)\n",
"type": "Bool -> Material.Options.Property c m -> Material.Options.Property c m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.LinearProgress",
"comment": "\nThe Linear Progress component is a spec-aligned linear progress indicator\ncomponent adhering to the Material Design progress & activity requirements.\n\n\n# Resources\n\n- [Material Design guidelines: Progress & activity](https://material.io/guidelines/components/progress-activity.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#linear-progress)\n\n\n# Example\n\n```elm\nimport Material.LinearProgress as LinearProgress\n\nLinearProgress.view\n [ LinearProgress.indeterminate\n ]\n []\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs determinate\n@docs indeterminate\n@docs buffered\n@docs reversed\n",
"aliases": [
{
"name": "Property",
"comment": " LinearProgress property.\n",
"args": [
"m"
],
"type": "Material.Internal.LinearProgress.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "buffered",
"comment": " Include a buffer indicator along with a regular determinate indicator.\n\nThe first value is the determinate indicator and the second value is the buffer\nindicator as a floating point value between 0 and 1.\n",
"type": "Float -> Float -> Material.LinearProgress.Property m"
},
{
"name": "determinate",
"comment": " Determinate indicators display how long an operation will take.\n\nThe first argument is the determinate indicator as a floating point value\nbetween 0 and 1.\n",
"type": "Float -> Material.LinearProgress.Property m"
},
{
"name": "indeterminate",
"comment": " Indeterminate indicators visualize an unspecified wait time.\n",
"type": "Material.LinearProgress.Property m"
},
{
"name": "reversed",
"comment": " Reverse the indicator.\n",
"type": "Material.LinearProgress.Property m"
},
{
"name": "view",
"comment": " LinearProgress view.\n",
"type": "List (Material.LinearProgress.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Textfield.HelperText",
"comment": "\nHelper text gives context about a field’s input, such as how the input will be\nused. It should be visible either persistently or only on focus.\n\n\n# Resources\n\n- [Material Design guidelines: Text Fields Layout](https://material.io/guidelines/components/text-fields.html#text-fields-layout)\n- [Demo](https://aforemny.github.io/elm-mc/#text-field)\n\n\n# Example\n\n```elm\nimport Html exposing (text)\nimport Material.Textfield as Textfield\nimport Material.Textfield.HelperText as Textfield\n\n\nHtml.div []\n [ Textfield.view Mdc [0] model.mdc\n [ Textfield.label \"Email Adress\"\n ]\n []\n , Textfield.helperText\n [ Textfield.persistent\n , Textfield.validationMsg\n ]\n [ text \"Help Text (possibly validation message)\"\n ]\n ]\n```\n\n\n# Usage\n\n@docs Property\n@docs helperText\n@docs persistent\n@docs validationMsg\n\n",
"aliases": [
{
"name": "Property",
"comment": " HelperText property.\n",
"args": [
"m"
],
"type": "Material.Internal.Textfield.HelperText.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "helperText",
"comment": " HelperText view.\n",
"type": "List (Material.Textfield.HelperText.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "persistent",
"comment": " Make the helper text permanently visible.\n",
"type": "Material.Textfield.HelperText.Property m"
},
{
"name": "validationMsg",
"comment": " Indicates the helper text is a validation message.\n\nIt will only show when the text field is marked as invalid or if it is\n`persistent`.\n",
"type": "Material.Textfield.HelperText.Property m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.List",
"comment": "\nList provides styles which implement Material Design Lists - “A single\ncontinuous column of tessellated subdivisions of equal width.” Both single-line\nand two-line lists are supported.\n\nTo avoid namespace conflicts with the `List` module, this module should be\nimported qualified as `Lists`.\n\n\n# Resources\n\n- [Material Design guidelines: Lists](https://material.io/guidelines/components/lists.html)\n- [Demo](https://aforemny.github.io/elm-mdc/#lists)\n\n\n# Example\n\n\n```elm\nimport Html exposing (text)\nimport Material.List as Lists\n\n\nLists.ul\n [ Lists.twoLine\n , Lists.avatarList\n ]\n [ Lists.li []\n [ Lists.graphicIcon [] \"folder\"\n , Lists.text []\n [ text \"Photos\"\n , Lists.secondaryText []\n [ text \"Jan 9, 2014\"\n ]\n ]\n , Lists.metaIcon [] \"info\"\n ]\n , Lists.li []\n [ Lists.graphicIcon [] \"folder\"\n , Lists.text []\n [ text \"Recipes\"\n , Lists.secondaryText []\n [ text \"Jan 17, 2014\"\n ]\n ]\n , Lists.metaIcon [] \"info\"\n ]\n , Lists.li []\n [ Lists.graphicIcon [] \"folder\"\n , Lists.text []\n [ text \"Work\"\n , Lists.secondaryText []\n [ text \"Jan 28, 2014\"\n ]\n ]\n , Lists.metaIcon [] \"info\"\n ]\n ]\n```\n\n\n# Usage\n\n## Lists\n\n@docs Property\n@docs ul\n@docs nonInteractive\n@docs dense\n@docs avatarList\n@docs twoLine\n\n\n## List Items\n\n@docs li\n@docs text\n@docs secondaryText\n@docs selected\n@docs activated\n@docs graphic, graphicIcon, graphicImage\n@docs meta, metaText, metaIcon, metaImage\n\n\n## List Groups\n\n@docs group\n@docs subheader\n\n\n## Dividers\n\n@docs divider\n@docs groupDivider\n@docs padded\n@docs inset\n",
"aliases": [
{
"name": "Property",
"comment": " List property.\n",
"args": [
"m"
],
"type": "Material.Internal.List.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "activated",
"comment": " Styles a row in activated state.\n",
"type": "Material.List.Property m"
},
{
"name": "avatarList",
"comment": " Configure the leading tiles of each row to display images instead of icons.\n",
"type": "Material.List.Property m"
},
{
"name": "dense",
"comment": " Make the list appear more compact.\n",
"type": "Material.List.Property m"
},
{
"name": "divider",
"comment": " List divider element.\n",
"type": "List (Material.List.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "graphic",
"comment": " The first tile in a row, typically an icon or image.\n",
"type": "List (Material.List.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "graphicIcon",
"comment": " The first tile in a row as an icon.\n\nThe second argument is a Material Icon identifier.\n",
"type": "List (Material.Internal.Icon.Implementation.Property m) -> String -> Html.Html m"
},
{
"name": "graphicImage",
"comment": " The first tile in a row as an image.\n\nThe second argument is the URL of the image.\n",
"type": "List (Material.List.Property m) -> String -> Html.Html m"
},
{
"name": "group",
"comment": " Wrapper around two or more list elements to be grouped together.\n",
"type": "List (Material.List.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "groupDivider",
"comment": " List divider element for groups.\n",
"type": "List (Material.List.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "inset",
"comment": " Increases the leading margin of the divider so that it does not intersect\nthe avatar column.\n",
"type": "Material.List.Property m"
},
{
"name": "li",
"comment": " List item element.\n",
"type": "List (Material.List.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "meta",
"comment": " The last tile in a row, typically small text, and icon or image.\n",
"type": "List (Material.List.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "metaIcon",
"comment": " The last tile in a row as an icon.\n\nThe second argument is a Material Icon identifier.\n",
"type": "List (Material.Internal.Icon.Implementation.Property m) -> String -> Html.Html m"
},
{
"name": "metaImage",
"comment": " The last tile in a row as an image.\n\nThe second argument is the url of the image.\n",
"type": "List (Material.List.Property m) -> String -> Html.Html m"
},
{
"name": "metaText",
"comment": " The last tile in a row as text.\n",
"type": "List (Material.List.Property m) -> String -> Html.Html m"
},
{
"name": "nonInteractive",
"comment": " Disables interactivity affordances.\n",
"type": "Material.List.Property m"
},
{
"name": "padded",
"comment": " Leaves a gap on each side of the divider to match the padding of `meta`.\n",
"type": "Material.List.Property m"
},
{
"name": "secondaryText",
"comment": " Secondary text for the row, in case the list is `twoLine`.\n",
"type": "List (Material.List.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "selected",
"comment": " Styles a row in selected state.\n",
"type": "Material.List.Property m"
},
{
"name": "subheader",
"comment": " Heading text displayed above each list in a group.\n",
"type": "List (Material.List.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "text",
"comment": " Primary text for the row.\n",
"type": "List (Material.List.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "twoLine",
"comment": " List items have primary and secondary lines.\n",
"type": "Material.List.Property m"
},
{
"name": "ul",
"comment": " The list element.\n",
"type": "List (Material.List.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.LayoutGrid",
"comment": "\nMaterial design’s responsive UI is based on a column-variate grid layout. It\nhas 12 columns on desktop, 8 columns on tablet and 4 columns on phone.\n\n\n# Resources\n\n- [Material Design guidelines: Layout grid](https://material.io/guidelines/layout/responsive-ui.html#responsive-ui-grid)\n- [Demo](https://aforemny.github.io/elm-mdc/#layout-grid)\n\n\n# Example\n\n```elm\nimport Material.LayoutGrid as LayoutGrid\n\n\nLayoutGrid.view []\n [ LayoutGrid.cell\n [ LayoutGrid.span6\n , LayoutGrid.span8Tablet\n ]\n []\n , LayoutGrid.cell\n [ LayoutGrid.span4\n , LayoutGrid.span6Tablet\n ]\n []\n , LayoutGrid.cell\n [ LayoutGrid.span2\n , LayoutGrid.span4Phone\n ]\n []\n ]\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n@docs fixedColumnWidth\n@docs alignRight, alignLeft\n\n\n# Cells\n\n@docs cell\n@docs span1, span2, span3, span4, span5, span6, span7, span8, span9, span10, span11, span12\n@docs span1Phone, span2Phone, span3Phone, span4Phone\n@docs span1Tablet, span2Tablet, span3Tablet, span4Tablet, span5Tablet, span6Tablet, span7Tablet, span8Tablet\n@docs span1Desktop, span2Desktop, span3Desktop, span4Desktop, span5Desktop, span6Desktop, span7Desktop, span8Desktop, span9Desktop, span10Desktop, span11Desktop, span12Desktop\n\n\n# Nested LayoutGrids\n\n```elm\nimport Material.LayoutGrid as LayoutGrid\n\nLayoutGrid.view []\n [ LayoutGrid.cell\n [ LayoutGrid.span4\n ]\n [ LayoutGrid.inner []\n [ LayoutGrid.cell [ LayoutGrid.span4 ] []\n , LayoutGrid.cell [ LayoutGrid.span4 ] []\n , LayoutGrid.cell [ LayoutGrid.span4 ] []\n ]\n ]\n , LayoutGrid.cell [ LayoutGrid.span4 ] []\n , LayoutGrid.cell [ LayoutGrid.span4 ] []\n ]\n```\n\n@docs inner\n",
"aliases": [
{
"name": "Property",
"comment": " LayoutGrid property.\n",
"args": [
"m"
],
"type": "Material.Internal.LayoutGrid.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "alignLeft",
"comment": " Make the LayoutGrid left aligned instead of center aligned.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "alignRight",
"comment": " Make the LayoutGrid right aligned instead of center aligned.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "cell",
"comment": " LayoutGrid cell.\n",
"type": "List (Material.LayoutGrid.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "fixedColumnWidth",
"comment": " Specifiy that the grid should have fixed column width.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "inner",
"comment": " When your contents need extra structure that cannot be supported by single\nlayout grid, you can nest layout grid within each other. Use `inner` to nest\nlayout grids by wrapping around nested cell.\n",
"type": "List (Material.LayoutGrid.Property m) -> List (Html.Html m) -> Html.Html m"
},
{
"name": "span1",
"comment": " Span 1 columns.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span10",
"comment": " Span 10 columns.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span10Desktop",
"comment": " Span 10 columns on a desktop.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span11",
"comment": " Span 11 columns.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span11Desktop",
"comment": " Span 11 columns on a desktop.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span12",
"comment": " Span 12 columns.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span12Desktop",
"comment": " Span 12 columns on a desktop.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span1Desktop",
"comment": " Span 1 columns on a desktop.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span1Phone",
"comment": " Span 1 columns on a phone.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span1Tablet",
"comment": " Span 1 columns on a tablet.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span2",
"comment": " Span 2 columns.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span2Desktop",
"comment": " Span 2 columns on a desktop.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span2Phone",
"comment": " Span 2 columns on a phone.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span2Tablet",
"comment": " Span 2 columns on a tablet.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span3",
"comment": " Span 3 columns.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span3Desktop",
"comment": " Span 3 columns on a desktop.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span3Phone",
"comment": " Span 3 columns on a phone.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span3Tablet",
"comment": " Span 3 columns on a tablet.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span4",
"comment": " Span 4 columns.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span4Desktop",
"comment": " Span 4 columns on a desktop.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span4Phone",
"comment": " Span 4 columns on a phone.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span4Tablet",
"comment": " Span 4 columns on a tablet.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span5",
"comment": " Span 5 columns.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span5Desktop",
"comment": " Span 5 columns on a desktop.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span5Tablet",
"comment": " Span 5 columns on a tablet.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span6",
"comment": " Span 6 columns.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span6Desktop",
"comment": " Span 6 columns on a desktop.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span6Tablet",
"comment": " Span 6 columns on a tablet.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span7",
"comment": " Span 7 columns.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span7Desktop",
"comment": " Span 7 columns on a desktop.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span7Tablet",
"comment": " Span 7 columns on a tablet.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span8",
"comment": " Span 8 columns.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span8Desktop",
"comment": " Span 8 columns on a desktop.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span8Tablet",
"comment": " Span 8 columns on a tablet.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span9",
"comment": " Span 9 columns.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "span9Desktop",
"comment": " Span 9 columns on a desktop.\n",
"type": "Material.LayoutGrid.Property m"
},
{
"name": "view",
"comment": " LayoutGrid view.\n",
"type": "List (Material.LayoutGrid.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.FormField",
"comment": "\nFormField provides a helper view for easily making theme-aware, RTL-aware form\nfield + label combinations.\n\n\n# Example\n\n```elm\nimport Html exposing (text)\nimport Materail.Checkbox as Checkbox\nimport Material.FormField as FormField\nimport Material.Options as Options\n\n\nFormField.view []\n [ Checkbox.view Mdc [0] model.mdc\n [ Options.onClick Toggle\n ]\n []\n , Html.label\n [ Options.onClick Toggle\n ]\n [ text \"Toggle\"\n ]\n ]\n```\n\n# Usage\n\n@docs Property\n@docs view\n@docs alignEnd\n",
"aliases": [
{
"name": "Property",
"comment": " FormField property.\n",
"args": [
"m"
],
"type": "Material.Internal.FormField.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "alignEnd",
"comment": " Position the label before the input.\n\nBy default, the label is positioned after the input.\n",
"type": "Material.FormField.Property m"
},
{
"name": "view",
"comment": " FormField view.\n",
"type": "List (Material.FormField.Property m) -> List (Html.Html m) -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
},
{
"name": "Material.Icon",
"comment": " Convenience functions for producing Material Design Icons. Refer to the\n[Material Design Icons page](https://google.github.io/material-design-icons),\nor skip straight to the [Material Icons Library](https://design.google.com/icons/).\n\nThis implementation assumes that you have\n\n```html\n<link href=\"https://fonts.googleapis.com/icon?family=Material+Icons\" rel=\"stylesheet\">\n```\n\nor an equivalent means of loading the icons in your HTML header.\n\n\n# Example\n\n```elm\nimport Material.Icon as Icon\n\n\nIcon.view [] \"settings\"\n```\n\n\n# Usage\n\n@docs Property\n@docs view\n\n\n## Icon sizes\n\n@docs size18\n@docs size24\n@docs size36\n@docs size48\n\n\n## Html node\n\n@docs anchor\n@docs button\n@docs span\n",
"aliases": [
{
"name": "Property",
"comment": " Icon property.\n",
"args": [
"m"
],
"type": "Material.Internal.Icon.Implementation.Property m"
}
],
"types": [],
"values": [
{
"name": "anchor",
"comment": " Icon will be a HTML `a` element.\n",
"type": "Material.Icon.Property m"
},
{
"name": "button",
"comment": " Icon will be a HTML `button` element.\n",
"type": "Material.Icon.Property m"
},
{
"name": "size18",
"comment": " Set icon to have size 18px.\n",
"type": "Material.Icon.Property m"
},
{
"name": "size24",
"comment": " Set icon to have size 24px.\n",
"type": "Material.Icon.Property m"
},
{
"name": "size36",
"comment": " Set icon to have size 36px.\n",
"type": "Material.Icon.Property m"
},
{
"name": "size48",
"comment": " Set icon to have size 48px.\n",
"type": "Material.Icon.Property m"
},
{
"name": "span",
"comment": " Icon will be a HTML `span` element.\n",
"type": "Material.Icon.Property m"
},
{
"name": "view",
"comment": " Icon view.\n\nRenders a HTML `i` node by default.\n",
"type": "List (Material.Icon.Property m) -> String -> Html.Html m"
}
],
"generated-with-elm-version": "0.18.0"
}
]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment