# Surface v0.12.2 - Table of Contents

## Pages

- [Changelog](changelog.md)
- [Migrating to v0.12.x](migrating.md)
- [MIT License](license.md)

## Modules

- [Surface](Surface.md): Surface is a component based library for **Phoenix LiveView**.
- [Surface.Component](Surface.Component.md): Defines a stateless component.
- [Surface.Formatter.Plugin](Surface.Formatter.Plugin.md): An [Elixir formatter
plugin](https://hexdocs.pm/mix/1.13.0-rc.1/Mix.Tasks.Format.html#module-plugins)
for Surface code.
- [Surface.LiveComponent](Surface.LiveComponent.md): A live stateful component. A wrapper around `Phoenix.LiveComponent`.
- [Surface.LiveView](Surface.LiveView.md): A wrapper component around `Phoenix.LiveView`.
- [Surface.LiveViewTest](Surface.LiveViewTest.md): Conveniences for testing Surface components.

- [Surface.MacroComponent](Surface.MacroComponent.md): A low-level component which is responsible for translating its own
content at compile time.

- [Surface.View](Surface.View.md): Use this module on regular Phoenix views to enable .sface templates

- Components
  - [Surface.Components.Context](Surface.Components.Context.md): > #### Deprecation warning {: .warning}
>
> Using this module as a component with `<Context>` has been deprecated. Support for
> scope-aware context will be removed in `v0.13` due to the lack of built-in support for
> the feature in Liveview itself, which leads to inefficient diff-tracking when using it.
>
> Global context related functions like `Context.put/3` and `Context.get/3`, as well as data/prop's
> option `:from_context`, will be kept and recommended as their usage don't affect diff-tracking
> negatively.
  - [Surface.Components.Dynamic.Component](Surface.Components.Dynamic.Component.md): A built-in component that allows users to inject dynamic components into
a Surface template.
  - [Surface.Components.Dynamic.LiveComponent](Surface.Components.Dynamic.LiveComponent.md): A built-in component that allows users to inject dynamic live components into
a Surface template.
  - [Surface.Components.Link](Surface.Components.Link.md): > #### Deprecation warning {: .warning}
>
> This component has been deprecated in favor of liveview's built-in `<.link>`
> and will be removed in `v0.13`. See https://hexdocs.pm/phoenix_live_view/live-navigation.html for
> more info and usage.
  - [Surface.Components.LivePatch](Surface.Components.LivePatch.md): > #### Deprecation warning {: .warning}
>
> This component has been deprecated in favor of liveview's built-in `<.link>`
> and will be removed in `v0.13`. See https://hexdocs.pm/phoenix_live_view/live-navigation.html for
> more info and usage.
  - [Surface.Components.LiveRedirect](Surface.Components.LiveRedirect.md): > #### Deprecation warning {: .warning}
>
> This component has been deprecated in favor of liveview's built-in `<.link>`
> and will be removed in `v0.13`. See https://hexdocs.pm/phoenix_live_view/live-navigation.html for
> more info and usage.
  - [Surface.Components.Raw](Surface.Components.Raw.md): A macro component that does not translate any of its contents.

- Catalogue
  - [Surface.Catalogue](Surface.Catalogue.md): A behaviour to provide additional information about the catalogue.
  - [Surface.Catalogue.Data](Surface.Catalogue.Data.md): Experimental module that provides conveniences for manipulating data
in Examples and Playgrounds.
  - [Surface.Catalogue.Examples](Surface.Catalogue.Examples.md): A generic LiveView to create multiple stateless examples for the Surface Catalogue.
  - [Surface.Catalogue.LiveExample](Surface.Catalogue.LiveExample.md): A generic LiveView to create a single live example for the Surface Catalogue.
  - [Surface.Catalogue.Playground](Surface.Catalogue.Playground.md): A generic LiveView to create a component's playground for the Surface Catalogue.

- Compiler
  - [Surface.Compiler](Surface.Compiler.md): Defines a behaviour that must be implemented by all HTML/Surface node translators.
  - [Surface.Compiler.CSSParserError](Surface.Compiler.CSSParserError.md)
  - [Surface.Compiler.CallerSpec](Surface.Compiler.CallerSpec.md)
  - [Surface.Compiler.CompileMeta](Surface.Compiler.CompileMeta.md)
  - [Surface.Compiler.EExEngine](Surface.Compiler.EExEngine.md): This module glues together surface's AST and Phoenix.LiveView.Engine to actually render an AST.
  - [Surface.Compiler.ParseError](Surface.Compiler.ParseError.md)

- Directives
  - [Surface.Directive](Surface.Directive.md)
  - [Surface.Directive.ComponentProps](Surface.Directive.ComponentProps.md)
  - [Surface.Directive.Debug](Surface.Directive.Debug.md)
  - [Surface.Directive.Events](Surface.Directive.Events.md)
  - [Surface.Directive.For](Surface.Directive.For.md)
  - [Surface.Directive.Hook](Surface.Directive.Hook.md)
  - [Surface.Directive.If](Surface.Directive.If.md)
  - [Surface.Directive.Let](Surface.Directive.Let.md)
  - [Surface.Directive.Show](Surface.Directive.Show.md)
  - [Surface.Directive.TagAttrs](Surface.Directive.TagAttrs.md)
  - [Surface.Directive.Values](Surface.Directive.Values.md)

- AST
  - [Surface.AST](Surface.AST.md)
  - [Surface.AST.Attribute](Surface.AST.Attribute.md): An AST node representing an attribute or property
  - [Surface.AST.AttributeExpr](Surface.AST.AttributeExpr.md): An AST node representing an attribute expression (i.e. a dynamic value for an attribute, directive, or property)
  - [Surface.AST.Block](Surface.AST.Block.md): An AST node representing a generic block.
  - [Surface.AST.Component](Surface.AST.Component.md): An AST node representing a component
  - [Surface.AST.Container](Surface.AST.Container.md): An AST node representing a container of other nodes. This does not
have content itself, just contains children which have content, and
directives that operate on the entirety of the children (i.e. for, if, debug)
  - [Surface.AST.Directive](Surface.AST.Directive.md): An AST node representing a directive
  - [Surface.AST.DynamicAttribute](Surface.AST.DynamicAttribute.md): An AST node representing a dynamic attribute (or attributes).
  - [Surface.AST.Error](Surface.AST.Error.md): An AST node representing an error. This will be rendered as an html element.
  - [Surface.AST.Expr](Surface.AST.Expr.md): An AST node representing an expression which does not resolve to a value printed out to the final DOM.
  - [Surface.AST.For](Surface.AST.For.md): An AST node representing a for comprehension.
  - [Surface.AST.FunctionComponent](Surface.AST.FunctionComponent.md): An AST node representing a function component
  - [Surface.AST.If](Surface.AST.If.md): An AST node representing an if/else expression
  - [Surface.AST.Interpolation](Surface.AST.Interpolation.md): An AST node representing interpolation within a node
  - [Surface.AST.Literal](Surface.AST.Literal.md): An AST node representing a literal value
  - [Surface.AST.MacroComponent](Surface.AST.MacroComponent.md): An AST node representing a macro component
  - [Surface.AST.Meta](Surface.AST.Meta.md): A container for metadata about compilation.
  - [Surface.AST.Slot](Surface.AST.Slot.md): An AST node representing a <#slot /> tag
  - [Surface.AST.SlotEntry](Surface.AST.SlotEntry.md): An AST node representing a <:slot> entry. This is used to provide content for slots
  - [Surface.AST.SlotableComponent](Surface.AST.SlotableComponent.md): An AST node representing a standard HTML tag
  - [Surface.AST.SubBlock](Surface.AST.SubBlock.md): An AST node representing a generic sub-block.
  - [Surface.AST.Tag](Surface.AST.Tag.md): An AST node representing a standard HTML tag
  - [Surface.AST.VoidTag](Surface.AST.VoidTag.md): An AST node representing a void (empty) HTML tag

- Exceptions
  - [Surface.CompileError](Surface.CompileError.md): An exception raised when there's a Surface compile error.

## Mix Tasks

- [mix compile.surface](Mix.Tasks.Compile.Surface.md): Generate CSS and JS/TS assets for components.
- [mix compile.surface.validate_components](Mix.Tasks.Compile.Surface.ValidateComponents.md)
- [mix surface.convert](Mix.Tasks.Surface.Convert.md): Converts .sface files and ~F sigils from v0.7 to v0.8 syntax.
- [mix surface.format](Mix.Tasks.Surface.Format.md): > #### Formatter Plugin Preferred {: .tip}
>
> To format Surface code using Elixir 1.13 or later, use
> `Surface.Formatter.Plugin`.
- [mix surface.init](Mix.Tasks.Surface.Init.md): Configures Surface on an phoenix project.