Angular directive for Canon sections featuring:
- Expanded, Collapsed, and Loading States
- Full Keyboard Support
- Accessibility Support
- AngularJS v1.2 or higher
- Canon v1.1 or higher
This package is not currently published to either NPM or Bower. Once the API stabilizes, the built files will be published. Until then, you can install directly from the GitHub repository.
To install with Bower, add the following line to dependencies in your bower.json:
"rs-section": "https://github.com/rackerlabs/rs-section.git"
This package provides a single directive, rs-section
, that can be used as an
element or an attribute.
<rs-section title="Directive Demo" description="A description of my section." collapsible="expanded">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
</rs-section>
Type: String
, Required
Accepts any string to be rendered into the header of the section. This attribute is required.
Type: String
, Default: ''
Accepts any string to be rendered next to the title of the section. The description is only shown when the section is collapsed. This attribute is optional.
Type: String
, Default: 'expanded'
Turns the section into a collapsible section. This parameters accepts the default state of the as a value.
collapsible="expanded"
- Render a collapsible section that is expanded by default.collapsible="collapsed"
- Render a collapsible section that is collapsed by default.collapsible="loading"
- Render a collapsible section that shows a loading pattern.
If the state is omitted, the section defaults to expanded. This attribute is optional.
rs-section is released under the MIT License.