From 74d8cf40d53407852495569cbc2f18c153dacb92 Mon Sep 17 00:00:00 2001
From: Sawyer Hollenshead <sawyerh@users.noreply.github.com>
Date: Thu, 29 Jun 2017 16:11:49 -0400
Subject: [PATCH 1/2] Update guidance; Minor component updates (#76)

* Maintain active tab state on page reload

* Add modifiers and guidance for Badge component

* Update Button guidance

* Use badge variations

* Reiterate guidance about secondary actions

* Add USWDS links to Button and Badge

* Combine Choice CSS examples

* Update guidance of Choice component

* Fix lint errors

* Add related pattern to Choices

* Update guidance for lists

* Add related pattern to Select component

* Fix failing lint test with ...spread

* Update Alert guidance

* Update Select guidance

* Reorder links

* Refine PageBlock UI

* Update Table guidance + add more examples

* Remove Alpha banner; Add basic header

* Update Grid guidance

* Update Tabs guidance

* Remove "React -" from headings

* Update TextField guidance

* Update VerticalNav guidance

* Add Forms guidelines page

* Add redundant link

* Reformat markdown blocks

* Update generator template

* Add USWDS credit

* Fix server-side rendering
---
 .eslintrc                                     |   1 +
 packages/core/src/base/typography.scss        |   4 +-
 packages/core/src/components/Alert/Alert.scss |  39 +++---
 packages/core/src/components/Badge/Badge.scss |  73 +++++++++--
 .../core/src/components/Button/Button.scss    |  66 +++++++---
 .../core/src/components/ChoiceList/Choice.jsx |   1 +
 .../src/components/ChoiceList/Choice.scss     | 114 +++++++++---------
 .../src/components/ChoiceList/ChoiceList.jsx  |   6 +-
 .../components/ChoiceList/ChoiceList.test.jsx |   2 +-
 .../components/ChoiceList/Select.example.jsx  |   4 +
 .../core/src/components/ChoiceList/Select.jsx |   2 +
 .../src/components/ChoiceList/Select.scss     |  63 +++++++---
 .../src/components/ChoiceList/Select.test.jsx |   2 +-
 packages/core/src/components/List/List.scss   |  44 ++++++-
 packages/core/src/components/Table/Table.scss |  97 +++++++++++++--
 packages/core/src/components/Tabs/Tabs.scss   |  33 ++---
 .../src/components/TextField/TextField.scss   |  59 ++++++---
 .../components/TextField/TextField.test.jsx   |   2 +-
 .../components/VerticalNav/VerticalNav.scss   |  93 ++++++--------
 .../core/src/settings/_variables.layout.scss  |   4 +
 .../core/src/utilities/border-radius.scss     |   4 +-
 .../src/utilities/display-visibility.scss     |  22 ++--
 packages/core/src/utilities/float.scss        |   4 +-
 packages/core/src/utilities/font-size.scss    |   4 +-
 packages/core/src/utilities/margin.scss       |   4 +-
 packages/core/src/utilities/padding.scss      |   4 +-
 packages/core/src/utilities/text-align.scss   |   4 +-
 packages/docs/src/pages/guidelines/forms.md   |  59 +++++++++
 packages/docs/src/pages/guidelines/grid.md    |   5 +-
 packages/docs/src/pages/index.md              |   6 +-
 .../docs/src/scripts/components/Header.jsx    |   7 +-
 packages/docs/src/scripts/components/Page.jsx |  15 ++-
 .../docs/src/scripts/components/PageBlock.jsx |  18 +--
 .../src/scripts/components/PageHeader.jsx     |  12 +-
 .../docs/src/scripts/components/Source.jsx    |   5 +-
 .../generators/app/templates/index.scss       |  40 +++++-
 tools/gulp/common/log-util.js                 |   2 +-
 .../docs/__tests__/processSection.test.js     |   2 +-
 tools/gulp/docs/generatePage.js               |   2 +-
 tools/gulp/docs/processSection.js             |  11 +-
 40 files changed, 646 insertions(+), 293 deletions(-)
 create mode 100644 packages/docs/src/pages/guidelines/forms.md

diff --git a/.eslintrc b/.eslintrc
index 077d505254..a640dc1472 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -15,6 +15,7 @@
   },
   "parserOptions": {
     "ecmaFeatures": {
+      "experimentalObjectRestSpread": true,
       "jsx": true
     },
     "sourceType": "module"
diff --git a/packages/core/src/base/typography.scss b/packages/core/src/base/typography.scss
index cf36874502..0856acc157 100644
--- a/packages/core/src/base/typography.scss
+++ b/packages/core/src/base/typography.scss
@@ -146,9 +146,7 @@ Style guide: base.typography
 }
 
 /*
----
-
-## Responsive
+Responsive
 
 Responsive typography can be accomplished by using the [responsive prefixed font size utility class](/utilites/font-size#responsive). Since the base typography margins and line height is measured in `em` units, they'll automatically adjust as you change the font size.
 
diff --git a/packages/core/src/components/Alert/Alert.scss b/packages/core/src/components/Alert/Alert.scss
index f6db65de46..4da1954f5e 100644
--- a/packages/core/src/components/Alert/Alert.scss
+++ b/packages/core/src/components/Alert/Alert.scss
@@ -3,7 +3,7 @@
 /*
 Alert
 
-@status prototype
+@status recommended
 
 @uswds https://standards.usa.gov/components/alerts
 
@@ -154,31 +154,38 @@ Style guide: components.alert.react
 /*
 ---
 
-## Accessibility
-
-- Use the ARIA `role="alert"` to inform assistive technologies of a time-sensitive and important message that is not interactive. If the message is interactive, use the `alertdialog` role instead.
-- Do not visually hide alert messages on the page and then make them visible when they are needed. Users of older assistive technologies may still be able to perceive the alert messages even if they are not currently applicable.
-
-## Usability
+## When to use
 
-### When to use
-
-- As a notification that keeps people informed of the status of the system and which may or may not require the user to respond. This includes errors, warnings, and general updates.
 - As a validation message that alerts someone that they just did something that needs to be corrected or as confirmation that a task was completed successfully.
+- As a callout or notification for important or timely information. This includes errors, warnings, and general information.
 
-### When to consider something else
+## When to consider alternatives
 
-- On long forms, always include in-line validation in addition to any error messages that appear at the top of the form.
+- On long forms, always include in-line validation in addition to any error messages that appear at the top of the form. When possible, simplify forms by rewriting and where possible, splitting long forms across multiple pages
 - If an action will result in destroying a user’s work (for example, deleting an application) use a more intrusive pattern, such as a confirmation modal dialogue, to allow the user to confirm that this is what they want.
 
 ## Guidance
 
-- When the user is required to do something in response to an alert, let them know what they need to do and make that task as easy as possible. Think about how much context to provide with your message. For example, a notification of a system change may require more contextual information than a validation message. Write the message in concise, human readable language; avoid jargon and computer code.
+- Don’t overdo it — too many notifications will either overwhelm or annoy the user and are likely to be ignored.
+- Write the message in concise, human readable language; avoid jargon and computer code.
+- Don’t include notifications that aren’t related to the user’s current goal.
+- When the user is required to do something in response to an alert, let them know what they need to do and make that task as easy as possible.
+
+**When the alert is for an error:**
+
 - Be polite in error messages — don’t place blame on the user.
 - Users generally won’t read documentation but will read a message that helps them resolve an error; include some educational material in your error message.
-- But don’t overdo it — too many notifications will either overwhelm or annoy the user and are likely to be ignored.
-- Allow a user to dismiss a notification wherever appropriate.
-- Don’t include notifications that aren’t related to the user’s current goal.
+- If the error relates to specific text fields, give these fields an error state as well.
+
+## Accessibility
+
+- Use the ARIA `role="alert"` to inform assistive technologies of a time-sensitive and important message that is not interactive. If the message is interactive, use the `alertdialog` role instead.
+- Do not visually hide alert messages on the page and then make them visible when they are needed. Users of older assistive technologies may still be able to perceive the alert messages even if they are not currently applicable.
+
+## Learn more
+
+- [18F Content Guide \- Active voice](https://content-guide.18f.gov/active-voice/)
+
 
 Style guide: components.alert.guidance
 */
diff --git a/packages/core/src/components/Badge/Badge.scss b/packages/core/src/components/Badge/Badge.scss
index e0f73b62a9..072664ce08 100644
--- a/packages/core/src/components/Badge/Badge.scss
+++ b/packages/core/src/components/Badge/Badge.scss
@@ -3,29 +3,84 @@
 /*
 Badge
 
-Badges draw attention to new or important content.
+Badges hold small amounts of information and draw attention to new or important content.
 
-@react-component Badge
+@status beta
 
-@status prototype
+@uswds https://standards.usa.gov/components/labels/
+
+.ds-c-badge--info - Info badge
+.ds-c-badge--success - Success badge
+.ds-c-badge--warn - Warning badge
+.ds-c-badge--alert - Alert or error badge
 
 Markup:
-<span class="ds-c-badge">New</span>
-<span class="ds-c-badge ds-u-fill--error">Due: December 31, 2018</span>
+<span class="ds-c-badge {{modifier}}">5</span>
+<span class="ds-c-badge {{modifier}}">Badge label</span>
+<span class="ds-c-badge {{modifier}} ds-u-font-size--base">Badge label</span>
 
 Style guide: components.badge
 */
 .ds-c-badge {
-  background-color: $color-primary-alt;
-  border-radius: $border-radius;
+  background-color: $color-gray;
+  border-radius: $border-radius-pill;
   color: $color-white;
   display: inline-block;
   font-size: $small-font-size;
   line-height: $heading-line-height;
-  margin-right: 5px;
-  padding: 3px 6px;
+  margin-right: $spacer-half;
+  padding: $spacer-half $spacer-1;
 
   &:only-of-type {
     margin-right: 0;
   }
 }
+
+.ds-c-badge--info {
+  background-color: $color-primary;
+}
+
+.ds-c-badge--success {
+  background-color: $color-success;
+}
+
+.ds-c-badge--warn {
+  background-color: $color-warn;
+  color: $color-base;
+}
+
+.ds-c-badge--alert {
+  background-color: $color-error;
+}
+
+/*
+---
+
+## When to use
+
+- To draw attention to new, important content on a page that might otherwise be missed.
+- To filter results with one or more tags.
+- To indicate the number of new or unread items within a container. For example, to indicate the number of unread messages within a person’s inbox.
+
+## When to consider alternatives
+
+- When users are likely to confuse a badge with a button. For example, when the badge appears in the same area of the page as buttons.
+- To call attention to new or updated content, consider changing the background color of the object itself or experiment with changing the font weight.
+- When users already expect content to be updated frequently. For example, on a site dedicated to breaking news. In this case placing the new content at the top may be enough.
+
+## Guidance
+
+- Don’t overdo it — if everything on a page is called out as important, nothing is important.
+- Users may confuse badges as buttons. Always conduct usability testing to make sure your particular implementation is not causing frustration.
+- Don’t mix interactive and static badges on your site. Once you establish a pattern for how badges behave, users will expect that behavior every time.
+
+## Accessibility
+
+- When badges are used to call out new content that is dynamically loaded onto a page, be sure to use [ARIA live regions](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions) to alert screen readers of the change.
+
+## Future research
+
+- Further usability testing should be done to ensure badges aren't being confused with buttons. Further iteration can be done with sizing and colors if there is confusion.
+
+Style guide: components.badge.guidance
+*/
diff --git a/packages/core/src/components/Button/Button.scss b/packages/core/src/components/Button/Button.scss
index c333e96782..b2416f8c98 100644
--- a/packages/core/src/components/Button/Button.scss
+++ b/packages/core/src/components/Button/Button.scss
@@ -4,7 +4,9 @@
 /*
 Button
 
-@status prototype
+@status recommended
+
+@uswds https://standards.usa.gov/components/buttons
 
 Use buttons to signal actions.
 
@@ -260,30 +262,60 @@ Style guide: components.button.react
 /*
 ---
 
-## Accessibility
+## When to use
 
-- Buttons should display a visible focus state when users tab to them.
-- Avoid using `<div>` or `<img>` tags to create buttons. Screen readers don't automatically know either is a usable button.
-- When styling links to look like buttons, remember that screen readers handle links slightly differently than they do buttons. Pressing the Space key triggers a button, but pressing the Enter key triggers a link.
+- Use buttons for the most important actions you want users to take on your site, such as "Download," "Sign up," or "Apply."
 
-## Usability
+## When to consider alternatives
 
-### When to use
-- Use buttons for the most important actions you want users to take on your site, such as "download," "sign up," or "log out."
-
-### When to consider something else
-- If you want to lead users between pages of a website. Use links instead.
 - Less popular or less important actions may be visually styled as links.
+- Buttons are for performing actions, not making choices. If you need your users to make a choice, use something else like radio buttons. Alternatively, if one choice is much less important then try styling it as a link instead.
 
 ## Guidance
-- Generally, use primary buttons for actions that go to the next step and use secondary buttons for actions that happen on the current page.
-- Style the button most users should click in a way that distinguishes from other buttons on the page. Try using the “large button” or the most visually distinct fill color.
-- Make sure buttons look clickable—use color variations to distinguish static, hover and active states.
-- Avoid using too many buttons on a page.
+
+- Use the "primary" button variation for the button most users should click. This is your primary call-to-action.
+- Avoid using too many buttons on a page. Aim to use only one button per page.
+- Avoid similar styles elsewhere on the page that could be confused for buttons.
+- Use buttons for the primary action and links for secondary actions.
+
+**Label text**
+
 - Use sentence case for button labels.
-- Button labels should be as short as possible with “trigger words” that your users will recognize to clearly explain what will happen when the button is clicked (for example, “download,” “view” or “sign up”).
+- Button labels should be as short as possible with “trigger words” that your users will recognize to clearly explain what will happen when the button is clicked (for example, “Save and continue,” “Download” or “Sign up”).
 - Make the first word of the button’s label a verb. For example, instead of “Complaint Filing”, label the button “File a complaint.”
-- At times, consider adding an icon to signal specific actions (“download”, “open in a new window”, etc).
+- If a button has an icon, it should still have accompanying text describing the action.
+
+**Destructive buttons**
+
+- Use the "danger" button variation for destructive buttons. For example, buttons that delete or reset a user's information.
+- Confirm the user meant to trigger a destructive action before following through with the action.
+- Provide a method for a user to undo a destructive action.
+
+**Disabled buttons**
+
+- Don’t disable buttons, unless there’s a good reason to.
+- If you do disable a button, make sure it receives the disabled styling. A `button` element will automatically be styled as a disabled button when it has the `disabled` HTML attribute, but an `a` element will need to have the disabled modifier class applied to it.
+
+## Accessibility
+
+- Buttons should display a visible focus state when users tab to them.
+- Create a button with a `button` or `a` element to retain the native click functionality. Avoid using `<div>` or `<img>` tags to create buttons. Screen readers don't automatically know either is a usable button.
+- When styling links to look like buttons, remember that screen readers handle links slightly differently than they do buttons. Pressing the `Space` key triggers a button, but pressing the `Enter` key triggers a link.
+
+## Learn more
+
+- [Beyond Blue Links: Making Clickable Elements Recognizable](https://www.nngroup.com/articles/clickable-elements/)
+- [7 Basic Best Practices for Buttons](http://www.uxmatters.com/mt/archives/2012/05/7-basic-best-practices-for-buttons.php)
+- [The Grammar of Interactivity](http://www.uxbooth.com/articles/the-grammar-of-interactivity/)
+- [GOV.UK navigation buttons discussion](https://paper.dropbox.com/doc/Navigation-buttons-continue-next-previous-ghLqL5a9Ostxxb3rvBhyO)
+
+**Button alignment**
+- [Buttons on forms and surveys: a look at some research](http://www.slideshare.net/cjforms/buttons-on-forms-and-surveys-a-look-at-some-research-2012)
+- [Previous and Next Actions in Web Forms](https://www.lukew.com/ff/entry.asp?730=)
+
+**ARIA**
+- [Using the button role](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_button_role)
+- [Building Accessible Buttons with ARIA](https://www.deque.com/blog/accessible-aria-buttons)
 
 Style guide: components.button.guidance
 */
diff --git a/packages/core/src/components/ChoiceList/Choice.jsx b/packages/core/src/components/ChoiceList/Choice.jsx
index 325ebf627e..08dd6409b8 100644
--- a/packages/core/src/components/ChoiceList/Choice.jsx
+++ b/packages/core/src/components/ChoiceList/Choice.jsx
@@ -5,6 +5,7 @@ import uniqueId from 'lodash.uniqueid';
 
 /**
  * A `Choice` component can be used to render a checkbox or radio button.
+ *
  * Any _undocumented_ props that you pass to this component will be passed
  * to the `input` element, so you can use this to set additional attributes if
  * necessary.
diff --git a/packages/core/src/components/ChoiceList/Choice.scss b/packages/core/src/components/ChoiceList/Choice.scss
index da0066d56f..3b525d7615 100644
--- a/packages/core/src/components/ChoiceList/Choice.scss
+++ b/packages/core/src/components/ChoiceList/Choice.scss
@@ -18,17 +18,11 @@ Markup:
 /*
 Checkbox & Radio
 
-@status prototype
+Checkboxes allow users to select one or more options from a visible list, whereas radio buttons allow a user to select only one option.
 
-@uswds https://standards.usa.gov/components/form-controls
-
-Style guide: components.choice
-*/
+@status recommended
 
-/*
-Checkbox
-
-Checkboxes allow users to select one or more options from a visible list.
+@uswds https://standards.usa.gov/components/form-controls
 
 Markup:
 <fieldset class="ds-c-fieldset ds-u-margin-top--0">
@@ -43,9 +37,19 @@ Markup:
   <input class="ds-c-choice" id="carver-1" type="checkbox" name="historical-figures-1" disabled>
   <label for="carver-1">George Washington Carver</label>
 </fieldset>
+<fieldset class="ds-c-fieldset">
+  <legend class="ds-c-label">Select a historical figure</legend>
+  <input class="ds-c-choice" id="truth-3" type="radio" name="historical-figures-3" value="truth" checked>
+  <label for="truth-3">Sojourner Truth</label>
+  <input class="ds-c-choice" id="douglass-3" type="radio" name="historical-figures-3" value="douglass">
+  <label for="douglass-3">Frederick Douglass</label>
+  <input class="ds-c-choice" id="washington-3" type="radio" name="historical-figures-3" value="washington">
+  <label for="washington-3">Booker T. Washington</label>
+</fieldset>
 <div class="ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2">
   <fieldset class="ds-c-fieldset ds-u-margin-top--0">
-    <legend class="ds-c-label">Select a historical figure</legend>
+    <legend class="ds-c-label">Historical figures</legend>
+    <span class="ds-c-field__hint ds-c-field__hint--inverse">Select all that apply</span>
     <input class="ds-c-choice ds-c-choice--inverse" id="truth-2" type="checkbox" name="historical-figures-2" value="truth" checked>
     <label for="truth-2">Sojourner Truth</label>
     <input class="ds-c-choice ds-c-choice--inverse" id="douglass-2" type="checkbox" name="historical-figures-2" value="douglass">
@@ -55,26 +59,7 @@ Markup:
     <input class="ds-c-choice ds-c-choice--inverse" id="carver-2" type="checkbox" name="historical-figures-2" disabled>
     <label for="carver-2">George Washington Carver</label>
   </fieldset>
-</div>
-
-Style guide: components.choice.checkbox
-*/
-
-/*
-Radio option
-
-Markup:
-<fieldset class="ds-c-fieldset ds-u-margin-top--0">
-  <legend class="ds-c-label">Select a historical figure</legend>
-  <input class="ds-c-choice" id="truth-3" type="radio" name="historical-figures-3" value="truth" checked>
-  <label for="truth-3">Sojourner Truth</label>
-  <input class="ds-c-choice" id="douglass-3" type="radio" name="historical-figures-3" value="douglass">
-  <label for="douglass-3">Frederick Douglass</label>
-  <input class="ds-c-choice" id="washington-3" type="radio" name="historical-figures-3" value="washington">
-  <label for="washington-3">Booker T. Washington</label>
-</fieldset>
-<div class="ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2">
-  <fieldset class="ds-c-fieldset ds-u-margin-top--0">
+  <fieldset class="ds-c-fieldset">
     <legend class="ds-c-label">Select a historical figure</legend>
     <input class="ds-c-choice ds-c-choice--inverse" id="truth-4" type="radio" name="historical-figures-4" value="truth" checked>
     <label for="truth-4">Sojourner Truth</label>
@@ -85,7 +70,7 @@ Markup:
   </fieldset>
 </div>
 
-Style guide: components.choice.radio
+Style guide: components.choice
 */
 
 // Hide the default browser checkbox/radio button since we'll
@@ -178,7 +163,7 @@ Style guide: components.choice.radio
 }
 
 /*
-React - `<Choice>`
+`<Choice>`
 
 @react-component Choice
 
@@ -186,7 +171,7 @@ Style guide: components.choice.react
 */
 
 /*
-React - `<ChoiceList>`
+`<ChoiceList>`
 
 @react-component ChoiceList
 
@@ -196,49 +181,60 @@ Style guide: components.choice.choicelist-react
 /*
 ---
 
-## Accessibility
+## When to use
 
-- Surround a related set of choices with a `<fieldset>`. The `<legend>` provides context for the grouping. Do not use `fieldset` and `legend` for a single check.
-- The custom checkboxes and radio buttons here are accessible to screen readers because the default fields are moved off-screen.
-- Each input should have a semantic `id` attribute, and its corresponding `label` should have the same value in its `for` attribute.
+**Checkboxes**
+
+- When a user can select any number of choices from a set list.
+- When a user needs to choose “yes” or “no” on only one option (use a stand-alone checkbox). For example, to toggle a setting on or off.
+- When users need to see all the available options at a glance.
+- When users should be able to select zero of the options.
+
+**Radio buttons**
+
+- When users need to select only one option out of a set of mutually exclusive choices.
 
-## Guidelines
+## When to consider alternatives
 
+- If there are too many options to display on a mobile screen. Consider a `select` menu if you don’t have enough space to list out all available options, and if the user can only select one of the options.
+- Never use radio buttons for optional questions, since once a radio button is selected from a list, it or another choice will remain selected.
+
+## Guidance
+
+- Don't rely on the visual difference between radio buttons and checkboxes. Make it clear with words when users can select one or multiple options.
 - Users should be able to tap on or click on either the text label or the checkbox to select or deselect an option.
-- List options vertically if possible; horizontal listings can make it difficult to tell which label pertains to which checkbox.
+- In general, list choices vertically; horizontal listings can make it difficult to tell which label pertains to which choice. An exception is where you have binary choices with short labels, like 'Yes / No'. The convention here is for horizontal alignment.
 - Avoid using negative language in labels as they can be counterintuitive. For example, “I want to receive a promotional email” instead of “I don’t want to receive promotional email.”
-- If you customize, make sure selections are adequately spaced for touch screens.
-- Use caution if you decide to set a default value. Setting a default value can discourage users from making conscious decisions, seem pushy, or alienate users who don’t fit into your assumptions. If you are unsure, leave nothing selected by default.
+- Use caution if you decide to set a default value. Setting a default value can discourage users from making conscious decisions, seem pushy, or alienate users who don’t fit into your assumptions. In addition, you'll never know if the user explicitly chose that option or just didn't notice the question. If you're unsure, leave nothing selected by default.
+
+**[View the "Forms" guidelines for additional guidance and best practices.]({{root}}/guidelines/forms/)**
+
+## Accessibility
+
+- Surround a related set of choices with a `<fieldset>`. The `<legend>` provides context for the grouping. Do not use `fieldset` and `legend` for a single checkbox.
+- Some screen readers read the `legend` text for each `fieldset`, so it should be brief and descriptive.
+- Each input should have a semantic `id` attribute, and its corresponding `label` should have the same value in its `for` attribute.
+- The custom checkboxes and radio buttons here are accessible to screen readers because the default fields are moved off-screen.
 
 ## Theming
 
-The following Sass variables can be overridden to theme checkbox/radio options:
+The following Sass variables can be overridden to theme choice fields:
 
 - `$choice-border-width`
 - `$choice-border-color`
 - `$choice-border-color-inverse`
 - `$choice-checked-background-color`
 
-## Checkboxes
+## Related patterns
 
-### When to use
-- When a user can select any number of choices from a set list.
-- When a user needs to choose “yes” or “no” on only one option (use a stand-alone checkbox). For example, to toggle a setting on or off.
-- When users need to see all the available options at a glance.
+- [Select menu]({{root}}/components/select)
 
-### When to consider something different
-- If there are too many options to display on a mobile screen.
-- If a user can only select one option from a list (use `radio` buttons instead).
-
-## Radio buttons
-
-- When users need to select only one option out of a set of mutually exclusive choices.
-- When the number of available options can fit onto a mobile screen.
+## Learn more
 
-### When to consider something else
-- Consider checkboxes if users need to select more than one option or if there is only one item to select.
-- Consider a dropdown if you don’t have enough space to list out all available options.
-- If users should be able to select zero of the options.
+- [Form Guidelines]({{root}}/guidelines/forms/)
+- [GOV.UK Checkbox/Radio buttons discussion](https://paper.dropbox.com/doc/Radio-buttons-oIwWoxwBKClt5IXvDbnpF)
+- ["We've updated the radios and checkboxes on GOV.UK"](https://designnotes.blog.gov.uk/2016/11/30/weve-updated-the-radios-and-checkboxes-on-gov-uk/)
+- [Four steps for choosing form elements on the Web (PDF)](http://www.formsthatwork.com/files/Articles/dropdown.pdf)
 
 Style guide: components.choice.guidance
 */
diff --git a/packages/core/src/components/ChoiceList/ChoiceList.jsx b/packages/core/src/components/ChoiceList/ChoiceList.jsx
index e111d733c8..3704dc2ca3 100644
--- a/packages/core/src/components/ChoiceList/ChoiceList.jsx
+++ b/packages/core/src/components/ChoiceList/ChoiceList.jsx
@@ -8,13 +8,13 @@ import uniqueId from 'lodash.uniqueid';
 
 /**
  * A `ChoiceList` component can be used to render a `select` menu, radio
- * button group, or checkbox group, and their corresponding `label` or `legend`.
+ * button group, or checkbox group.
  *
  * You can manually pass in the `type` prop, but the real power of this component
  * is unleashed when you let it determine the type of fields for you. It takes
  * into account accessibility and usability best practices, so you can pass in
- * an array of choices and let it determine whether the choices should be
- * presented as radio buttons, checkboxes, or a `select` menu.
+ * an array of choices and let it determine what type of field would be best for
+ * the user.
  */
 export class ChoiceList extends React.PureComponent {
   /**
diff --git a/packages/core/src/components/ChoiceList/ChoiceList.test.jsx b/packages/core/src/components/ChoiceList/ChoiceList.test.jsx
index d79eb5324c..ba5bbbfd1a 100644
--- a/packages/core/src/components/ChoiceList/ChoiceList.test.jsx
+++ b/packages/core/src/components/ChoiceList/ChoiceList.test.jsx
@@ -122,7 +122,7 @@ describe('ChoiceList', () => {
         .toBe(true);
     });
 
-    it("doesn't pass an ID prop", () => {
+    it('doesn\'t pass an ID prop', () => {
       const data = shallowRender();
 
       expect(data.wrapper.find('Choice').first().prop('id'))
diff --git a/packages/core/src/components/ChoiceList/Select.example.jsx b/packages/core/src/components/ChoiceList/Select.example.jsx
index eeb5843ad3..fd2f148e8e 100644
--- a/packages/core/src/components/ChoiceList/Select.example.jsx
+++ b/packages/core/src/components/ChoiceList/Select.example.jsx
@@ -8,6 +8,10 @@ export default () => {
       <option value='1'>Option 1</option>
       <option value='2'>Option 2</option>
       <option value='3'>Option 3</option>
+      <option value='4'>Option 4</option>
+      <option value='5'>Option 5</option>
+      <option value='6'>Option 6</option>
+      <option value='7'>Option 7</option>
     </Select>
   );
 };
diff --git a/packages/core/src/components/ChoiceList/Select.jsx b/packages/core/src/components/ChoiceList/Select.jsx
index 85d0076c0f..7e227b1ebf 100644
--- a/packages/core/src/components/ChoiceList/Select.jsx
+++ b/packages/core/src/components/ChoiceList/Select.jsx
@@ -66,10 +66,12 @@ Select.propTypes = {
    */
   multiple: function(props, propName, componentName) {
     if (props[propName]) {
+      /* eslint-disable quotes */
       return new Error(
         `'${propName}' supplied to '${componentName}'. [A11Y]: Users often don’t` +
         ` understand how to select multiple items from dropdowns. Use checkboxes instead.`
       );
+      /* eslint-enable */
     }
   },
   name: PropTypes.string.isRequired,
diff --git a/packages/core/src/components/ChoiceList/Select.scss b/packages/core/src/components/ChoiceList/Select.scss
index 28cc1148f8..2515fad4ed 100644
--- a/packages/core/src/components/ChoiceList/Select.scss
+++ b/packages/core/src/components/ChoiceList/Select.scss
@@ -5,23 +5,31 @@ Select
 
 A select field allows users to select one option from a list.
 
-@status prototype
+@status recommended
 
 @uswds https://standards.usa.gov/components/form-controls/#dropdown
 
 Markup:
 <label class="ds-c-label ds-u-margin-top--0" for="options">Field label</label>
 <select class="ds-c-field ds-c-field--select" name="options" id="options">
-  <option value="value1">Option A</option>
-  <option value="value2">Option B</option>
-  <option value="value3">Option C</option>
+  <option value="1">Option 1</option>
+  <option value="2">Option 2</option>
+  <option value="3">Option 3</option>
+  <option value="4">Option 4</option>
+  <option value="5">Option 5</option>
+  <option value="6">Option 6</option>
+  <option value="7">Option 7</option>
 </select>
 <div class="ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2">
   <label class="ds-c-label ds-u-margin-top--0" for="options-inverse">Field label</label>
   <select class="ds-c-field ds-c-field--select ds-c-field--inverse" name="options-inverse" id="options-inverse">
-    <option value="value1">Option A</option>
-    <option value="value2">Option B</option>
-    <option value="value3">Option C</option>
+    <option value="1">Option 1</option>
+    <option value="2">Option 2</option>
+    <option value="3">Option 3</option>
+    <option value="4">Option 4</option>
+    <option value="5">Option 5</option>
+    <option value="6">Option 6</option>
+    <option value="7">Option 7</option>
   </select>
 </div>
 
@@ -43,7 +51,7 @@ Style guide: components.select
 }
 
 /*
-React - `<Select>`
+`<Select>`
 
 @react-component Select
 
@@ -51,7 +59,7 @@ Style guide: components.select.react
 */
 
 /*
-React - `<ChoiceList>`
+`<ChoiceList>`
 
 @react-component ChoiceList
 
@@ -61,29 +69,44 @@ Style guide: components.select.choicelist-react
 /*
 ---
 
-## Accessibility
-
-- Make sure your dropdown has a label. Don’t replace it with the default menu option (for example, removing the “State” label and just having the dropdown read “Select a state” by default).
-- Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Auto-submission disrupts screen readers because they select each option as they read them.
-
-## Usability
-
 ### When to use
 
 - Use sparingly — only when a user needs to choose from about seven to 15 possible options and you have limited space to display the options.
 
-### When to consider something else
+### When to consider alternatives
 
-- If the list of options is very short. Use radio buttons instead.
-- If the list of options is very long. Let users type the same information into a text input that suggests possible options instead.
+- If the list of options is short. Use radio or checkboxes buttons instead.
+- If the list of options is very long. Let users type the same information into a text input that suggests possible options instead. Long lists can sometimes be broken into multiple shorter lists by asking a few questions up-front to filter out options.
 - If you need to allow users to select more than one option at once. Users often don’t understand how to select multiple items from dropdowns. Use checkboxes instead.
+- If the data is highly familiar to users, such as the day, month, or year of their birth.
 
-### Guidance
+## Guidance
 
+- Choose a sensible order for the options to enable visual scanning of the lists.
 - Test dropdowns thoroughly with members of your target audience. Several usability experts suggest they should be the “UI of last resort.” Many users find them confusing and difficult to use.
 - Avoid making options in one dropdown menu change based on the input to another. Users often don’t understand how selecting an item in one impacts another.
 - When most users will (or should) pick a particular option, make it the default: `<option selected="selected">Default</option>`
 - Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Offer a “submit” button at the end of the form instead. Users often change their choices multiple times. Auto-submission is also less accessible.
 
+**[View the "Forms" guidelines for additional guidance and best practices.]({{root}}/guidelines/forms/)**
+
+## Accessibility
+
+- Make sure your dropdown has a label. Don’t replace it with the default menu option (for example, removing the “State” label and just having the dropdown read “Select a state” by default).
+- Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Auto-submission disrupts screen readers because they select each option as they read them.
+- On some devices the list of options cannot be zoomed, which means that some people with visual impairments cannot use them.
+
+## Related patterns
+
+- [Checkbox and Radio]({{root}}/components/choice)
+- [Text field]({{root}}/components/text-field)
+
+## Learn more
+
+- [Form Guidelines]({{root}}/guidelines/forms/)
+- [Asking for a date of birth](https://designnotes.blog.gov.uk/2013/12/05/asking-for-a-date-of-birth/)
+- [Four steps for choosing form elements on the Web (PDF)](http://www.formsthatwork.com/files/Articles/dropdown.pdf)
+- [Dropdowns: Design Guidelines](https://www.nngroup.com/articles/drop-down-menus/)
+
 Style guide: components.select.guidance
 */
diff --git a/packages/core/src/components/ChoiceList/Select.test.jsx b/packages/core/src/components/ChoiceList/Select.test.jsx
index fb2fadfab2..806577d58c 100644
--- a/packages/core/src/components/ChoiceList/Select.test.jsx
+++ b/packages/core/src/components/ChoiceList/Select.test.jsx
@@ -49,7 +49,7 @@ describe('Select', () => {
     expect(data.wrapper.hasClass('ds-c-field--select')).toBe(true);
   });
 
-  it("renders <option>'s as children", () => {
+  it('renders <option>\'s as children', () => {
     const data = shallowRender({}, 10);
 
     expect(data.wrapper.children('option').length).toBe(10);
diff --git a/packages/core/src/components/List/List.scss b/packages/core/src/components/List/List.scss
index ca86224237..d9660bdd6b 100644
--- a/packages/core/src/components/List/List.scss
+++ b/packages/core/src/components/List/List.scss
@@ -4,26 +4,36 @@
 /*
 List
 
-@status prototype
+Lists organize written information for users.
+
+@status recommended
+
+@uswds https://standards.usa.gov/components/typography/#lists
 
 Markup:
+<h6 class="ds-h6">Unordered list</h6>
 <ul class="ds-c-list {{modifier}}">
   <li>List item 1</li>
   <li>List item 2</li>
 </ul>
+<h6 class="ds-h6">Ordered list</h6>
+<ol class="ds-c-list {{modifier}}">
+  <li>List item 1</li>
+  <li>List item 2</li>
+</ol>
 
 .ds-c-list--bare - Unstyled list (no `margin`, `padding` or `list-style`)
 
 Style guide: components.list
 */
 .ds-c-list {
-  margin-bottom: 1em;
-  margin-top: 1em;
-  padding-left: 1.94em; // Approximately 15px left padding at default font size
+  margin-bottom: $spacer-2;
+  margin-top: $spacer-2;
+  padding-left: $spacer-4;
 
   li {
     line-height: $base-line-height;
-    margin-bottom: 0.5em;
+    margin-bottom: $spacer-1;
 
     &:last-child {
       margin-bottom: 0;
@@ -34,3 +44,27 @@ Style guide: components.list
 .ds-c-list--bare {
   @include ds-unstyled-list;
 }
+
+/*
+---
+
+## When to use
+
+- Use an ordered list when you need to display text in some ranking, hierarchy, or series of steps.
+- Use unordered lists to display text in no specific order.
+
+## When to consider alternatives
+
+- If you need to communicate long lists of narrative text.
+
+## Guidance
+
+- Use sentence case and begin lists with a capital letter.
+- Use punctuation appropriate to the text. Do not leave sentences without periods.
+
+## Learn more
+
+- [18F Content Guide \- Bulleted lists](https://content-guide.18f.gov/punctuation/#bulleted-lists)
+
+Style guide: components.list.guidance
+*/
diff --git a/packages/core/src/components/Table/Table.scss b/packages/core/src/components/Table/Table.scss
index 8d45f72840..c319fb00bb 100644
--- a/packages/core/src/components/Table/Table.scss
+++ b/packages/core/src/components/Table/Table.scss
@@ -3,21 +3,32 @@
 /*
 Table
 
-@status prototype
+Tables show tabular data in columns and rows.
+
+@status recommended
+
+@uswds https://standards.usa.gov/components/tables/
 
 Markup:
 <table class="ds-c-table {{modifier}}">
   <thead>
     <tr>
       <th>Name</th>
+      <th class="ds-u-text-align--right">Rate</th>
       <th>Favorite fruit</th>
     </tr>
   </thead>
   <tbody>
     <tr>
       <td>Fred</td>
+      <td class="ds-u-text-align--right">51.25%</td>
       <td>Apples</td>
     </tr>
+    <tr>
+      <td>Tamara</td>
+      <td class="ds-u-text-align--right">98.70%</td>
+      <td>Strawberries</td>
+    </tr>
   </tbody>
 </table>
 
@@ -31,26 +42,21 @@ Style guide: components.table
   margin: 0;
   min-width: 100%;
 
-  thead {
-    th,
-    td {
-      background-color: $color-gray-lightest;
-    }
+  td {
+    background-color: $color-white;
   }
 
-  th {
+  th, thead td {
+    background-color: $color-gray-lightest;
     text-align: left;
   }
 
-  tbody {
-    th {
-      font-weight: $font-normal;
-    }
+  tbody th {
+    font-weight: $font-normal;
   }
 
   th,
   td {
-    background-color: $color-white;
     border: 1px solid $color-gray;
     padding: 1.5rem;
   }
@@ -73,3 +79,70 @@ Style guide: components.table
     border-right: 0;
   }
 }
+
+.ds-c-table__caption {
+  font-weight: $font-bold;
+  margin-bottom: $spacer-1;
+  text-align: left;
+}
+
+/*
+Table with two headers and a caption
+
+Markup:
+<table class="ds-c-table {{modifier}}">
+  <caption class="ds-c-table__caption">Household members</caption>
+  <thead>
+    <tr>
+      <th scope="col">Name</th>
+      <th scope="col">Street</th>
+      <th scope="col">Employer</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <th scope="row">John Doe</th>
+      <td>123 Braavos Ave.</td>
+      <td>Acme Co.</td>
+    </tr>
+    <tr>
+      <th scope="row">Jane Doe</th>
+      <td>456 King's Landing</td>
+      <td>Acme Co.</td>
+    </tr>
+  </tbody>
+</table>
+
+Style guide: components.table.complex
+*/
+
+/*
+---
+
+## When to use
+
+- When you need tabular information, such as statistical data.
+- When users need to compare sets of information.
+
+## When to consider alternatives
+
+- Depending on the type of content, consider using other presentation formats such as definition lists or hierarchical lists.
+- If you're writing out name / value pairs, there's often a more compact way compared to using a table.
+
+## Guidance
+
+- Right-align numerical data in tables. You can use a [text alignment utility class]({{root}}/utilities/text-align) for this. This makes it easier to scan and compare values.
+
+## Accessibility
+
+- Tables can have two levels of headers. Each header cell should have `scope="col"` or `scope="row"`. [Learn more about the "scope" attribute.](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th#attr-scope)
+- Complex tables are tables with more than two levels of headers. Each header should be given a unique `id` and each data cell should have a `headers` attribute with each related header cell’s `id` listed.
+- When adding a title to a table, include it in a `<caption>` tag inside of the `<table>` element.
+
+## Learn more
+
+- [W3C Web Accessibility Tutorial \- Table Concepts](https://www.w3.org/WAI/tutorials/tables/)
+- [Design Better Data Tables](https://medium.com/mission-log/design-better-data-tables-430a30a00d8c)
+
+Style guide: components.table.guidance
+*/
diff --git a/packages/core/src/components/Tabs/Tabs.scss b/packages/core/src/components/Tabs/Tabs.scss
index 0c13d6a4ec..2b1f69aa03 100644
--- a/packages/core/src/components/Tabs/Tabs.scss
+++ b/packages/core/src/components/Tabs/Tabs.scss
@@ -6,7 +6,7 @@ Tabs
 
 Tabs can be used as a navigation pattern, allowing a user to switch between panels of related content within the same context.
 
-@status prototype
+@status beta
 
 Markup:
 <div class="ds-c-tabs" role="tablist" aria-label="Settings">
@@ -163,7 +163,22 @@ Style guide: components.tabs.react-tab
 }
 
 /*
-Guidelines
+---
+
+## When to use
+
+- If you have 2-3 panels of related content that needs to be condensed.
+
+## When to consider alternatives
+
+- If you have more than three tabs. Consider using a different pattern if your content requires being split into more than three panels.
+- If the panel contents aren't related.
+- If the panel contents can be displayed at once. This will improve the scanability of your page's content and it's more likely the user will be able to find what they're looking for.
+
+## Guidance
+
+- Don't hide tabs on small screens. If the tabs can't fit on one row on small screens, consider using utility classes to apply additional responsive styles or use a different pattern.
+- Each Tab label should be descriptive of its content and set the user's expectations. Labels should be no more than two words.
 
 ## Accessibility
 
@@ -173,19 +188,7 @@ Guidelines
   - For the tabs list parent: `role`, `aria-label`
   - For a tab panel: `role`, `aria-labelledby`
 
-## Guidance
-
-### Responsiveness
-
-Hiding tabs on small screens is not a user-friendly solution. If the tabs can't fit on one row on small screens, consider using utility classes to apply additional responsive styles or use a different pattern.
-
-### General guidance
-
-- The content within tab panels should be related.
-- Each Tab label should be descriptive of its content and set the user's expectations. Labels shoud be no more than two words.
-- A maximum of three tabs should be displayed. Consider using a different pattern if your content requries being split into more than three panels.
-
-## Further reading
+## Learn more
 
 - [How Tabs Should Work](https://24ways.org/2015/how-tabs-should-work/)
 - [Simple ARIA tab interface](http://heydonworks.com/practical_aria_examples/#tab-interface)
diff --git a/packages/core/src/components/TextField/TextField.scss b/packages/core/src/components/TextField/TextField.scss
index 811e7dfa01..bf0ba092fe 100644
--- a/packages/core/src/components/TextField/TextField.scss
+++ b/packages/core/src/components/TextField/TextField.scss
@@ -4,11 +4,11 @@
 /*
 Text field
 
-@status prototype
+@status recommended
 
 @uswds https://standards.usa.gov/components/form-controls/#text-input
 
-A text field can be an `input` or `textarea` HTML element.
+Text fields allow people to enter any combination of letters, numbers, or symbols of their choosing (unless otherwise restricted). Text fields can span single or multiple lines.
 
 Markup:
 <label class="ds-c-label ds-u-margin-top--0" for="input-firstname">
@@ -59,7 +59,7 @@ Style guide: components.text-field
 }
 
 /*
-Inverse theme
+---
 
 Markup:
 <div class="ds-base--inverse ds-u-padding--2">
@@ -103,7 +103,7 @@ Style guide: components.text-field.inverse
 }
 
 /*
-React - `<TextField>`
+`<TextField>`
 
 @react-component TextField
 
@@ -113,31 +113,52 @@ Style guide: components.text-field.react
 /*
 ---
 
-## Accessibility
+## When to use
+
+- If you can’t reasonably predict a user’s answer to a prompt and there might be wide variability in users’ answers.
+- When using another type of input will make answering more difficult. For example, birthdays and other known dates are easier to type in than they are to select from a calendar picker.
+- When users want to paste in a response.
+
+## When to consider alternatives
 
-- Display form controls in the same order in HTML as they appear on screen. Do not use CSS to rearrange the form controls. Screen readers narrate forms in the order they appear in the HTML.
-- Visually align validation messages with the input fields, so people using screen magnifiers can read them quickly.
-- Group each set of thematically related controls in a fieldset element. Use the legend element to offer a label within each one. The fieldset and legend elements make it easier for screen reader users to navigate the form.
-- Use a single legend for fieldset (this is required). One example of a common use of fieldset and legend is a question with radio button options for answers. The question text and radio buttons are wrapped in a fieldset, with the question itself being inside the legend tag.
-- Embed multiple fieldsets and legends for more complex forms.x
-- Keep your form blocks in a vertical pattern. This approach is ideal, from an accessibility standpoint, because of limited vision that makes it hard to scan from right to left.
+- When users are choosing from a specific set of options. Consider checkboxes, radio buttons, or a select menu in these cases.
 
-## Usability
+## Guidance
 
-### Guidance
+- Don't use placeholder text in form fields. Use hint text instead, if you need to provide contextual information. Placeholder text disappears after a user types a value, therefore users will no longer have that text available when they need to review their entries. People who have cognitive or visual disabilities have additional problems with placeholder text.
+- The length of the text field provides a hint to users as to how much text to write. Do not require users to write paragraphs of text into a single-line `input` box; use a `textarea` instead.
+- Text fields are among the easiest type of input for desktop users but are more difficult for mobile users.
+- Only show error messages or styling after a user has interacted with a particular field.
 
-- The length of the text input provides a hint to users as to how much text to write. Do not require users to write paragraphs of text into a single-line `input` box; use a `textarea` instead.
-- Text inputs are among the easiest type of input for desktop users but are more difficult for mobile users.
-- Only show error messages or stylings after a user has interacted with a particular field.
-- Avoid using placeholder text that appears within a text field before a user starts typing. If placeholder text is no longer visible after a user clicks into the field, users will no longer have that text available when they need to review their entries. (People who have cognitive or visual disabilities have additional problems with placeholder text.)
+**[View the "Forms" guidelines for additional guidance and best practices.]({{root}}/guidelines/forms/)**
+
+## Accessibility
+
+- Group each set of thematically related controls in a `fieldset` element. Use the `legend` element to offer a label within each `fieldset`. The `fieldset` and `legend` elements make it easier for screen reader users to navigate the form.
+- Keep your form blocks in a vertical pattern. This approach is ideal, from an accessibility standpoint, because of limited vision that makes it hard to scan from left to right.
 
 ## Theming
 
-The following Sass variables can be overridden to theme a field: `$color-focus`, `$color-focus-inverse`, `$focus-shadow`, `$focus-shadow-inverse`, `$input-border-color`, `$input-border-color-inverse`, `$input-border-radius`, `$input-line-height`, `$input-border-width`, `$input-padding`
+The following Sass variables can be overridden to theme a field:
+
+- `$color-focus`
+- `$color-focus-inverse`
+- `$focus-shadow`
+- `$focus-shadow-inverse`
+- `$input-border-color`
+- `$input-border-color-inverse`
+- `$input-border-radius`
+- `$input-line-height`
+- `$input-border-width`
+- `$input-padding`
 
-## Further reading
+## Learn more
 
+- [Form Guidelines]({{root}}/guidelines/forms/)
 - ["Placeholders in Form Fields Are Harmful"](https://www.nngroup.com/articles/form-design-placeholders/)
+- [Asking for a date of birth](https://designnotes.blog.gov.uk/2013/12/05/asking-for-a-date-of-birth/)
+- [GOV.UK text boxes discussion](https://paper.dropbox.com/doc/Text-boxes-8NLlgz9tjR8OzTz2N9wE3)
+- [Four steps for choosing form elements on the Web (PDF)](http://www.formsthatwork.com/files/Articles/dropdown.pdf)
 
 Style guide: components.text-field.guidance
 */
diff --git a/packages/core/src/components/TextField/TextField.test.jsx b/packages/core/src/components/TextField/TextField.test.jsx
index e3b302946d..ebeef18c7d 100644
--- a/packages/core/src/components/TextField/TextField.test.jsx
+++ b/packages/core/src/components/TextField/TextField.test.jsx
@@ -85,7 +85,7 @@ describe('TextField', function() {
     const field1 = fieldData1.wrapper.find('.ds-c-field').first();
     const label1 = fieldData1.wrapper.find('FormLabel').first();
     const field2 = fieldData2.wrapper.find('.ds-c-field').first();
-    const idRegex = new RegExp(`textfield_[0-9]+`);
+    const idRegex = new RegExp('textfield_[0-9]+');
 
     expect(field1.prop('id')).toMatch(idRegex);
     expect(label1.prop('fieldId')).toBe(field1.prop('id'));
diff --git a/packages/core/src/components/VerticalNav/VerticalNav.scss b/packages/core/src/components/VerticalNav/VerticalNav.scss
index 7b56843211..63475c8a5e 100644
--- a/packages/core/src/components/VerticalNav/VerticalNav.scss
+++ b/packages/core/src/components/VerticalNav/VerticalNav.scss
@@ -4,17 +4,38 @@
 /*
 Vertical navigation
 
-@status beta
+Hierarchical, vertical navigation.
+
+@status recommended
 
 @uswds https://standards.usa.gov/components/sidenav/
 
 Markup:
 <ul class="ds-c-vertical-nav">
   <li class="ds-c-vertical-nav__item">
-    <a class="ds-c-vertical-nav__link ds-c-vertical-nav__link--current" href="http://example.com">Current page</a>
+    <a class="ds-c-vertical-nav__link" href="http://example.com">Parent link</a>
   </li>
   <li class="ds-c-vertical-nav__item">
-    <a class="ds-c-vertical-nav__link" href="http://example.com">Parent link</a>
+    <a class="ds-c-vertical-nav__link ds-c-vertical-nav__link--current" href="http://example.com">Current page</a>
+    <ul class="ds-c-vertical-nav__subnav">
+      <li class="ds-c-vertical-nav__item">
+        <a class="ds-c-vertical-nav__link" href="http://example.com">Child link</a>
+      </li>
+      <li class="ds-c-vertical-nav__item">
+        <a class="ds-c-vertical-nav__link" href="http://example.com">Child link</a>
+        <ul class="ds-c-vertical-nav__subnav">
+          <li class="ds-c-vertical-nav__item">
+            <a class="ds-c-vertical-nav__link" href="http://example.com">Grandchild link</a>
+          </li>
+          <li class="ds-c-vertical-nav__item">
+            <a class="ds-c-vertical-nav__link ds-c-vertical-nav__link--current" href="http://example.com">Grandchild link</a>
+          </li>
+        </ul>
+      </li>
+      <li class="ds-c-vertical-nav__item">
+        <a class="ds-c-vertical-nav__link" href="http://example.com">Child link</a>
+      </li>
+    </ul>
   </li>
   <li class="ds-c-vertical-nav__item">
     <a class="ds-c-vertical-nav__link" href="http://example.com">Parent link</a>
@@ -67,43 +88,6 @@ a.ds-c-vertical-nav__link:hover {
   text-decoration: none;
 }
 
-/*
-Nested menus
-
-Markup:
-<ul class="ds-c-vertical-nav">
-  <li class="ds-c-vertical-nav__item">
-    <a class="ds-c-vertical-nav__link" href="http://example.com">Parent link</a>
-  </li>
-  <li class="ds-c-vertical-nav__item">
-    <a class="ds-c-vertical-nav__link ds-c-vertical-nav__link--current" href="http://example.com">Current page</a>
-    <ul class="ds-c-vertical-nav__subnav">
-      <li class="ds-c-vertical-nav__item">
-        <a class="ds-c-vertical-nav__link" href="http://example.com">Child link</a>
-      </li>
-      <li class="ds-c-vertical-nav__item">
-        <a class="ds-c-vertical-nav__link" href="http://example.com">Child link</a>
-        <ul class="ds-c-vertical-nav__subnav">
-          <li class="ds-c-vertical-nav__item">
-            <a class="ds-c-vertical-nav__link" href="http://example.com">Grandchild link</a>
-          </li>
-          <li class="ds-c-vertical-nav__item">
-            <a class="ds-c-vertical-nav__link ds-c-vertical-nav__link--current" href="http://example.com">Grandchild link</a>
-          </li>
-        </ul>
-      </li>
-      <li class="ds-c-vertical-nav__item">
-        <a class="ds-c-vertical-nav__link" href="http://example.com">Child link</a>
-      </li>
-    </ul>
-  </li>
-  <li class="ds-c-vertical-nav__item">
-    <a class="ds-c-vertical-nav__link" href="http://example.com">Parent link</a>
-  </li>
-</ul>
-
-Style guide: components.vertical-nav.nested
-*/
 .ds-c-vertical-nav__subnav {
   @include ds-unstyled-list;
 
@@ -156,7 +140,7 @@ Style guide: components.vertical-nav.nested
 }
 
 /*
-React - `<VerticalNav>`
+`<VerticalNav>`
 
 @react-component VerticalNav
 
@@ -164,7 +148,7 @@ Style guide: components.vertical-nav.VerticalNav
 */
 
 /*
-React - `<VerticalNavItem>`
+`<VerticalNavItem>`
 
 @hide-example
 
@@ -176,20 +160,12 @@ Style guide: components.vertical-nav.VerticalNavItem
 /*
 ---
 
-## Accessibility
-
-- Users should be able to tab through each link.
-- If you have nested menus that are collapsible, ensure the toggle button has its `aria-controls` and `aria-expanded` attributes set. This is done automatically for you
-if you're using the React components.
-
-## Usability
-
-### When to use
+## When to use
 
 - To display a navigational hierarchy with one to three levels.
 - To display the “sub-navigation” within a section of the website.
 
-### When to consider something else
+## When to consider alternatives
 
 - If the site has fewer than five pages, consider organizing the page without a navigational hierarchy.
 - If your page already has a horizontal and vertical navigation bar, consider ways to simplify your navigation system.
@@ -198,8 +174,19 @@ if you're using the React components.
 ## Guidance
 
 - Indicate where a user is within the navigational hierarchy. Use the `ds-c-vertical-nav__link--current` modifier to show users which page they have navigated to.
-- Keep the navigation links short. They can be shorter derivatives of page titles themselves.
+- Keep the navigation links short and follow sentence case. They can be shorter derivatives of page titles themselves.
 - If the navigation hierarchy is too long, users may miss items at the bottom. If it’s too deep, users may miss items that require too many clicks. Usability test to find the right balance between breadth and depth.
 
+## Accessibility
+
+- Users should be able to tab through each link.
+- If you have nested menus that are collapsible, ensure the toggle button has its `aria-controls` and `aria-expanded` attributes set. This is done automatically for you
+if you're using the React components.
+
+## Learn more
+
+- [18F Content Guide \- Heading capitalization](https://content-guide.18f.gov/capitalization/#headings)
+- [18F Content Guide \- Headings and titles](https://content-guide.18f.gov/headings-and-titles/)
+
 Style guide: components.vertical-nav.guidance
 */
diff --git a/packages/core/src/settings/_variables.layout.scss b/packages/core/src/settings/_variables.layout.scss
index 6f2f1851f1..6b11c254d5 100644
--- a/packages/core/src/settings/_variables.layout.scss
+++ b/packages/core/src/settings/_variables.layout.scss
@@ -41,3 +41,7 @@ $breakpoints: (
   // Extra large screen / wide desktop
   xl: $width-xl
 ) !default;
+
+// Borders
+$border-radius-circle: 100%;
+$border-radius-pill: 9999px;
diff --git a/packages/core/src/utilities/border-radius.scss b/packages/core/src/utilities/border-radius.scss
index 8ae1f185d8..5e86008f94 100644
--- a/packages/core/src/utilities/border-radius.scss
+++ b/packages/core/src/utilities/border-radius.scss
@@ -30,9 +30,9 @@ Style guide: utilities.border-radius
 }
 
 .ds-u-radius--pill {
-  border-radius: 9999px;
+  border-radius: $border-radius-pill;
 }
 
 .ds-u-radius--circle {
-  border-radius: 100%;
+  border-radius: $border-radius-circle;
 }
diff --git a/packages/core/src/utilities/display-visibility.scss b/packages/core/src/utilities/display-visibility.scss
index 2fea7b9a58..59259bcd80 100644
--- a/packages/core/src/utilities/display-visibility.scss
+++ b/packages/core/src/utilities/display-visibility.scss
@@ -2,17 +2,15 @@
 @import '../settings/index';
 
 /*
-Visibility
+Display/Visibility
 
 Use the `display` and `visibility` utility classes to show and hide elements.
 
-Style guide: utilities.visibility
+Style guide: utilities.display-visibility
 */
 
 /*
----
-
-## Display
+Display
 
 > The display CSS property specifies the type of rendering box used for an element. In HTML, default display property values are taken from behaviors described in the HTML specifications or from the browser/user default stylesheet. &mdash; [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/display)
 
@@ -29,7 +27,7 @@ Markup:
 <span class="ds-u-display--inline-block">I'm displayed as <code>inline-block</code></span>
 <span class="ds-u-display--none">I'm hidden</span>
 
-Style guide: utilities.visibility.display
+Style guide: utilities.display-visibility.display
 */
 .ds-u-display--block {
   display: block !important;
@@ -44,9 +42,7 @@ Style guide: utilities.visibility.display
 }
 
 /*
----
-
-## Visibility
+Visibility
 
 > The visibility property can be used to hide an element while leaving the space where it would have been. &mdash; [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/visibility)
 
@@ -67,7 +63,7 @@ Markup:
 <span class="ds-u-visibility--screen-reader">I'm visible to screen readers only</span>
 <span class="ds-u-visibility--visible">I'm visible</span>
 
-Style guide: utilities.visibility.visibility
+Style guide: utilities.display-visibility.visibility
 */
 .ds-u-visibility--hidden {
   visibility: hidden !important;
@@ -90,9 +86,7 @@ Style guide: utilities.visibility.visibility
 }
 
 /*
----
-
-## Responsive
+Responsive
 
 Use a [responsive prefix](/responsive) to show/hide content at specific breakpoints.
 
@@ -116,7 +110,7 @@ Markup:
   </div>
 <% }) %>
 
-Style guide: utilities.visibility.responsive
+Style guide: utilities.display-visibility.responsive
 */
 @each $breakpoint in map-keys($breakpoints) {
   $value: map-get($breakpoints, $breakpoint);
diff --git a/packages/core/src/utilities/float.scss b/packages/core/src/utilities/float.scss
index b4709670e4..f8cd7cc774 100644
--- a/packages/core/src/utilities/float.scss
+++ b/packages/core/src/utilities/float.scss
@@ -40,9 +40,7 @@ Style guide: utilities.float
 }
 
 /*
----
-
-## Responsive
+Responsive
 
 Use a [responsive prefix](/responsive) to change how an element is floated at specific breakpoints.
 
diff --git a/packages/core/src/utilities/font-size.scss b/packages/core/src/utilities/font-size.scss
index 6b047144c2..b5193bd4be 100644
--- a/packages/core/src/utilities/font-size.scss
+++ b/packages/core/src/utilities/font-size.scss
@@ -53,9 +53,7 @@ Style guide: utilities.font-size
 }
 
 /*
----
-
-## Responsive
+Responsive
 
 Use a [responsive prefix](/responsive) to change the font size at specific breakpoints.
 
diff --git a/packages/core/src/utilities/margin.scss b/packages/core/src/utilities/margin.scss
index 4278d901ce..d1f82293a9 100644
--- a/packages/core/src/utilities/margin.scss
+++ b/packages/core/src/utilities/margin.scss
@@ -63,9 +63,7 @@ Style guide: utilities.margin
 }
 
 /*
----
-
-## Responsive
+Responsive
 
 Use a [responsive prefix](/responsive) to change the margin at specific breakpoints.
 
diff --git a/packages/core/src/utilities/padding.scss b/packages/core/src/utilities/padding.scss
index 63ee030397..5d06c6d894 100644
--- a/packages/core/src/utilities/padding.scss
+++ b/packages/core/src/utilities/padding.scss
@@ -60,9 +60,7 @@ Style guide: utilities.padding
 }
 
 /*
----
-
-## Responsive
+Responsive
 
 Use a [responsive prefix](/responsive) to change the padding at specific breakpoints.
 
diff --git a/packages/core/src/utilities/text-align.scss b/packages/core/src/utilities/text-align.scss
index ee94d4468b..21944c0515 100644
--- a/packages/core/src/utilities/text-align.scss
+++ b/packages/core/src/utilities/text-align.scss
@@ -28,9 +28,7 @@ Style guide: utilities.text-align
 }
 
 /*
----
-
-## Responsive
+Responsive
 
 Use a [responsive prefix](/responsive) to change the text alignment at specific breakpoints.
 
diff --git a/packages/docs/src/pages/guidelines/forms.md b/packages/docs/src/pages/guidelines/forms.md
new file mode 100644
index 0000000000..f507b48611
--- /dev/null
+++ b/packages/docs/src/pages/guidelines/forms.md
@@ -0,0 +1,59 @@
+---
+title: Forms
+---
+
+The design system includes components for the standard HTML form elements: [checkboxes and radio buttons]({{root}}/components/choice), [text fields]({{root}}/components/text-field), [select menus]({{root}}/components/select), fieldsets, labels, and so on.
+
+Below are some best practices your project should aim to follow in order to provide the most accessible and usable experience for your users. Additional guidance, specific to each form field, is provided in each component's guidance tab.
+
+## Best practices
+
+- Keep forms as simple as possible – only ask for what's absolutely needed.
+- Display form fields in the same order in HTML as they appear on screen. Do not use CSS to rearrange the form fields. Screen readers narrate, and keyboard navigate, forms in the order they appear in the HTML.
+- Ensure there's sufficient spacing between form fields. Your fields shouldn't feel cramped and users shouldn't confuse which labels and hint text belong to which fields. Use the [margin]({{root}}/utilities/margin) or [padding]({{root}}/utilities/padding) utility classes, if necessary, to add extra spacing.
+
+### Labels
+
+- Apply the `ds-c-label` class to `<label>` elements.
+- Each field should have a `<label>`. Never use a field's `placeholder` attribute as the primary way to label the field.
+- Labels should have a `for` attribute, referencing the corresponding input's unique `id` attribute. Only one label can be associated to each unique form element.
+- Labels should be placed above their fields.
+- Label text should be short and in sentence case.
+- Avoid colons at the end of labels.
+
+#### Hint text
+
+- Place hint text within the field's `<label>` element.
+- Apply the `ds-c-field__hint` class to hint text.
+- Use hint text for supporting contextual help, this will always be shown.
+- Hint text should sit above a form field, and below the label text.
+
+#### Validation
+
+- Place inline validation messages within the field's `<label>` element.
+- Visually align inline validation messages with the input fields, so people using screen magnifiers can read them quickly.
+
+##### Example
+
+```html
+<label class="ds-c-label" for="lastname">
+  ID Number
+  <span class="ds-c-field__hint ds-u-color--error" role="alert">
+    Please enter your ID Number
+  </span>
+  <span class="ds-c-field__hint">
+    It's on your benefit card and benefit letter. For example, ‘12 34 56B’.
+  </span>
+</label>
+```
+
+### Required and Optional fields
+
+If most of the fields in a form are required, indicate the few that are optional. If most of the fields in a form are optional, indicate the few that are required. When indicating what form fields are either required or optional, always use text.
+
+Whichever choice you choose, ensure the pattern is consistent when the form is split across multiple pages.
+
+## Learn more
+
+- [Website Forms Usability: Top 10 Recommendations](https://www.nngroup.com/articles/web-form-design/)
+- [Form Design Quick Fix: Group Form Elements Effectively Using White Space](https://www.nngroup.com/articles/form-design-white-space/)
diff --git a/packages/docs/src/pages/guidelines/grid.md b/packages/docs/src/pages/guidelines/grid.md
index fc92d7bd7c..cff8aa6323 100644
--- a/packages/docs/src/pages/guidelines/grid.md
+++ b/packages/docs/src/pages/guidelines/grid.md
@@ -2,12 +2,13 @@
 title: Grid layout
 ---
 
-Choosing a suitable grid framework is dependent on several factors. Some of these factors are browser support, if and which CSS preprocessor is being used, degree of customizability, and [layout mode](https://developer.mozilla.org/en-US/docs/Web/CSS/Layout_mode) preference.
+Choosing a suitable grid solution is dependent on several factors. Some of these factors are browser support, if and which CSS preprocessor is being used, degree of customizability, and [layout mode](https://developer.mozilla.org/en-US/docs/Web/CSS/Layout_mode) preference.
 
-As a result, the design system doesn't currently include its own grid framework and instead suggests that you pick from existing solutions, based on what works best for your project and preferences.
+As a result, the design system doesn't currently include its own grid framework and instead suggests that you create your own simple grid solution, or pick from existing solutions, based on what works best for your project and preferences.
 
 Below is a non-exhaustive list of existing grid solutions:
 
+- [Flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
 - [Neat](http://neat.bourbon.io/)
 - [Flexbox Grid](http://flexboxgrid.com/)
 - [Susy](http://susy.oddbird.net/)
diff --git a/packages/docs/src/pages/index.md b/packages/docs/src/pages/index.md
index 183ac37ed7..a74ccd9245 100644
--- a/packages/docs/src/pages/index.md
+++ b/packages/docs/src/pages/index.md
@@ -144,4 +144,8 @@ The design system follows a variation of [ITCSS](http://thomasbyttebier.be/blog/
 
 ## Examples
 
-[**View example projects**](https://github.com/CMSgov/design-system/tree/master/examples/) to see ways you can use the design system and incorporate it into your development process.
\ No newline at end of file
+[**View example projects**](https://github.com/CMSgov/design-system/tree/master/examples/) to see ways you can use the design system and incorporate it into your development process.
+
+## Credits
+
+Our design system is a variation and extension of the [U.S. Web Design Standards](https://standards.usa.gov). Thank you to 18F and GSA for the hard work they put into the Standards. We're excited to contribute our learnings and progress.
\ No newline at end of file
diff --git a/packages/docs/src/scripts/components/Header.jsx b/packages/docs/src/scripts/components/Header.jsx
index e8afd8f0da..bb961110f9 100644
--- a/packages/docs/src/scripts/components/Header.jsx
+++ b/packages/docs/src/scripts/components/Header.jsx
@@ -2,11 +2,8 @@ import React from 'react';
 
 const Header = () => {
   return (
-    <header className='ds-base--inverse'>
-      <div className='ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small'>
-        <strong>Alpha status</strong>:
-        The design system is under active development and working towards a 1.0 release.
-      </div>
+    <header className='ds-base--inverse ds-u-padding--3'>
+      <h1 className='ds-h3'>CMS.gov Design System</h1>
     </header>
   );
 };
diff --git a/packages/docs/src/scripts/components/Page.jsx b/packages/docs/src/scripts/components/Page.jsx
index be5127847d..bb3818de8d 100644
--- a/packages/docs/src/scripts/components/Page.jsx
+++ b/packages/docs/src/scripts/components/Page.jsx
@@ -19,6 +19,16 @@ class Page extends React.PureComponent {
     this.hasTabs = (this.props.sections.length && this.props.depth >= 2);
   }
 
+  defaultSelectedTabId() {
+    if (this.guidanceSections().length &&
+      typeof window !== 'undefined' &&
+      window.location.hash === '#guidance') {
+      return 'guidance';
+    }
+
+    return 'usage';
+  }
+
   usageSections() {
     return this.props.sections.filter(s => !isGuidanceSection(s));
   }
@@ -42,7 +52,10 @@ class Page extends React.PureComponent {
   renderContent() {
     if (this.hasTabs) {
       return (
-        <Tabs tablistClassName='ds-u-padding-left--6 ds-u-fill--gray-lightest'>
+        <Tabs
+          defaultSelectedId={this.defaultSelectedTabId()}
+          tablistClassName='ds-u-padding-left--6 ds-u-fill--gray-lightest'
+        >
           <TabPanel
             className='ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0'
             id='usage'
diff --git a/packages/docs/src/scripts/components/PageBlock.jsx b/packages/docs/src/scripts/components/PageBlock.jsx
index 82547fdb36..3173e2709b 100644
--- a/packages/docs/src/scripts/components/PageBlock.jsx
+++ b/packages/docs/src/scripts/components/PageBlock.jsx
@@ -61,18 +61,22 @@ class PageBlock extends React.PureComponent {
     // text below the title + code snippet block. It's hacky, but works.
     if (this.props.hideHeader || this.props.header.match(/---/)) return;
 
+    const source = this.props.reactComponent ? (
+      <Source
+        reactComponent={this.props.reactComponent}
+        source={this.props.source}
+      />
+    ) : null;
+
     return (
       <div>
-        <h1
-          className='ds-h1'
+        <h2
+          className='ds-h2'
           // Headers can contain HTML markup, therefore dangerously set...
           dangerouslySetInnerHTML={{ __html: this.props.header }}
           id={this.props.reference}
         />
-        <Source
-          reactComponent={this.props.reactComponent}
-          source={this.props.source}
-        />
+        {source}
       </div>
     );
   }
@@ -94,7 +98,7 @@ class PageBlock extends React.PureComponent {
     const docs = reactDoc[`${path}.jsx`];
 
     if (docs && docs.length) {
-      // There should only ever be one exported component definiton
+      // There should only ever be one exported component definition
       const doc = docs[0];
 
       return (
diff --git a/packages/docs/src/scripts/components/PageHeader.jsx b/packages/docs/src/scripts/components/PageHeader.jsx
index 787464ebad..22bbd5d0e9 100644
--- a/packages/docs/src/scripts/components/PageHeader.jsx
+++ b/packages/docs/src/scripts/components/PageHeader.jsx
@@ -1,6 +1,7 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 import Source from './Source';
+import classNames from 'classnames';
 
 class PageHeader extends React.PureComponent {
   uswdsLink() {
@@ -15,8 +16,17 @@ class PageHeader extends React.PureComponent {
 
   statusPill() {
     if (this.props.status) {
+      const classes = classNames(
+        'ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize',
+        {
+          'ds-c-badge--success': this.props.status === 'recommended',
+          'ds-c-badge--warn': this.props.status === 'beta',
+          'ds-c-badge--alert': this.props.status === 'alpha'
+        }
+      );
+
       return (
-        <span className='ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-u-fill--warn ds-u-color--base'>
+        <span className={classes}>
           {this.props.status}
         </span>
       );
diff --git a/packages/docs/src/scripts/components/Source.jsx b/packages/docs/src/scripts/components/Source.jsx
index 48f3727e59..89d9f9874f 100644
--- a/packages/docs/src/scripts/components/Source.jsx
+++ b/packages/docs/src/scripts/components/Source.jsx
@@ -4,9 +4,8 @@ import reactComponentPath from '../shared/reactComponentPath';
 
 const Source = props => {
   if (props.reactComponent || props.source) {
-    const path = props.reactComponent
-      ? reactComponentPath(props.source.path, props.reactComponent).replace(/[a-z-]+\/src\//, '')
-      : props.source.filename;
+    const reactPath = props.reactComponent && reactComponentPath(props.source.path, props.reactComponent).replace(/[a-z-]+\/src\//, '');
+    const path = props.reactComponent ? `${reactPath}.jsx` : props.source.filename;
 
     return <code className='ds-u-font-size--small'>{path}</code>;
   }
diff --git a/packages/generator-cmsgov/generators/app/templates/index.scss b/packages/generator-cmsgov/generators/app/templates/index.scss
index 67e2578723..a112761383 100644
--- a/packages/generator-cmsgov/generators/app/templates/index.scss
+++ b/packages/generator-cmsgov/generators/app/templates/index.scss
@@ -3,7 +3,7 @@
 /*
 <%= title %>
 
-@status prototype
+@status alpha
 
 TODO: Enter your description here
 
@@ -16,3 +16,41 @@ Style guide: components.<%= slug %>
 .ds-c-<%= slug %> {
   // TODO: Enter your ruleset here
 }
+
+/*
+---
+
+## When to use
+
+- List typical use cases for this component
+
+## When to consider alternatives
+
+- List commonly confused use cases where an alternative component would be a better solution
+
+## Guidance
+
+- List any design or content guidelines related to how this component should be used
+
+## Accessibility
+
+- List any accessibility considerations like required keyboard functionality, ARIA attributes, etc
+
+## Theming
+
+- List any Sass variables a developer could override to customize the appearance of the component
+
+## Future research
+
+- Optionally list any suggestions for future research that could mature and extend the component
+
+## Related patterns
+
+- List any related components or utility classes that connect with the component, whether as a parent, sibling, or child within the pattern's taxonomy.
+
+## Learn more
+
+- List any links that served as inspiration, references, or research related to this component.
+
+Style guide: components.<%= slug %>.guidance
+*/
diff --git a/tools/gulp/common/log-util.js b/tools/gulp/common/log-util.js
index ef81f35446..11885c0937 100644
--- a/tools/gulp/common/log-util.js
+++ b/tools/gulp/common/log-util.js
@@ -73,7 +73,7 @@ module.exports = {
 
   logIntroduction: function(message) {
 
-    message = message || 'HealthCare.gov Design System';
+    message = message || 'CMS.gov Design System';
 
     gutil.log(
       chalk.yellow(pkg.name),
diff --git a/tools/gulp/docs/__tests__/processSection.test.js b/tools/gulp/docs/__tests__/processSection.test.js
index c1ca5bb5aa..a1ccbd4329 100644
--- a/tools/gulp/docs/__tests__/processSection.test.js
+++ b/tools/gulp/docs/__tests__/processSection.test.js
@@ -6,7 +6,7 @@ describe('processSection', () => {
     return {
       toJSON: () => (
         {
-          // These paragraphs need to be seperated by a newline in order for
+          // These paragraphs need to be separated by a newline in order for
           // the flag processing to work properly.
           description: `<p>Hello world</p>\n<p>@react-component Component</p>\n<p>@hide-markup</p>\n<p>@status prototype</p>`,
           deprecated: false,
diff --git a/tools/gulp/docs/generatePage.js b/tools/gulp/docs/generatePage.js
index a94b8098cb..4c133db61e 100644
--- a/tools/gulp/docs/generatePage.js
+++ b/tools/gulp/docs/generatePage.js
@@ -26,7 +26,7 @@ function generatePage(routes, page, rootPath) {
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>${page.header} - CMSgov Design System</title>
+  <title>${page.header} - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/${rootPath}public/styles/docs.css" />
diff --git a/tools/gulp/docs/processSection.js b/tools/gulp/docs/processSection.js
index 542ee64026..66f3c868e5 100644
--- a/tools/gulp/docs/processSection.js
+++ b/tools/gulp/docs/processSection.js
@@ -42,14 +42,17 @@ function processSection(kssSection, rootPath) {
   // parse those rather than running it through the marked library.
   data.header = converMarkdownCode(data.header);
 
-  // Render EJS and replace template tags
-  if (data.markup && data.markup !== '') {
+  // Replace template tags
+  ['description', 'markup'].forEach(key => {
     if (rootPath === '') {
-      data.markup = data.markup.replace(/{{root}}/g, '');
+      data[key] = data[key].replace(/{{root}}/g, '');
     } else {
-      data.markup = data.markup.replace(/{{root}}/g, `/${rootPath}`);
+      data[key] = data[key].replace(/{{root}}/g, `/${rootPath}`);
     }
+  });
 
+  // Render EJS
+  if (data.markup && data.markup !== '') {
     try {
       data.markup = ejs.render(data.markup);
     } catch (e) {

From 2c9e8ad95b37fc9d2f3e2752fe4ac7f784555a2f Mon Sep 17 00:00:00 2001
From: Sawyer Hollenshead <s.hollenshead@gmail.com>
Date: Thu, 29 Jun 2017 16:43:18 -0400
Subject: [PATCH 2/2] Prepare release v1.0.0-rc.1

---
 docs/base/index.html                          |  16 +-
 docs/base/typography/index.html               |  15 +-
 docs/components/alert/index.html              |  69 +-
 docs/components/badge/index.html              |  57 +-
 docs/components/button/index.html             |  98 ++-
 docs/components/choice/index.html             | 185 ++---
 docs/components/index.html                    |   8 +-
 docs/components/list/index.html               |  57 +-
 docs/components/select/index.html             | 143 ++--
 docs/components/table/index.html              | 110 ++-
 docs/components/tabs/index.html               |  72 +-
 docs/components/text-field/index.html         |  92 ++-
 docs/components/vertical-nav/index.html       |  92 +--
 docs/guidelines/code-conventions/index.html   |   6 +-
 docs/guidelines/forms/index.html              |  66 ++
 docs/guidelines/grid/index.html               |  11 +-
 docs/guidelines/i18n/index.html               |   6 +-
 docs/guidelines/responsive/index.html         |   6 +-
 docs/index.html                               |  10 +-
 docs/public/scripts/index.js                  |  19 +-
 docs/public/styles/docs.css                   |   2 +-
 docs/utilities/background-color/index.html    |   8 +-
 docs/utilities/border-radius/index.html       |  10 +-
 docs/utilities/border/index.html              |   8 +-
 docs/utilities/clearfix/index.html            |   6 +-
 docs/utilities/color/index.html               |  10 +-
 .../index.html                                |  23 +-
 docs/utilities/float/index.html               |  15 +-
 docs/utilities/font-family/index.html         |  12 +-
 docs/utilities/font-size/index.html           |  15 +-
 docs/utilities/font-style/index.html          |  12 +-
 docs/utilities/font-weight/index.html         |  12 +-
 docs/utilities/index.html                     |  12 +-
 docs/utilities/line-height/index.html         |  14 +-
 docs/utilities/margin/index.html              |  13 +-
 docs/utilities/measure/index.html             |  14 +-
 docs/utilities/overflow/index.html            |   8 +-
 docs/utilities/padding/index.html             |  13 +-
 docs/utilities/text-align/index.html          |  15 +-
 docs/utilities/text-decoration/index.html     |  12 +-
 docs/utilities/text-transform/index.html      |  12 +-
 docs/utilities/truncate/index.html            |  10 +-
 docs/utilities/vertical-align/index.html      |  12 +-
 examples/react-app/package.json               |  10 +-
 examples/react-app/yarn.lock                  | 654 ++++++++++++++----
 packages/core/dist/components/Badge/Badge.css |   2 +-
 .../core/dist/components/ChoiceList/Choice.js |   1 +
 .../dist/components/ChoiceList/ChoiceList.js  |   6 +-
 .../core/dist/components/ChoiceList/Select.js |   2 +
 packages/core/dist/components/List/List.css   |   2 +-
 packages/core/dist/components/Table/Table.css |   2 +-
 packages/core/dist/index.css                  |   2 +-
 packages/core/package.json                    |   3 +-
 packages/docs/package.json                    |   4 +-
 54 files changed, 1417 insertions(+), 677 deletions(-)
 create mode 100644 docs/guidelines/forms/index.html
 rename docs/utilities/{visibility => display-visibility}/index.html (56%)

diff --git a/docs/base/index.html b/docs/base/index.html
index feb4df46d6..048c73e347 100644
--- a/docs/base/index.html
+++ b/docs/base/index.html
@@ -2,33 +2,33 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Base - CMSgov Design System</title>
+  <title>Base - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="438870185"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="base" data-reactid="12">Base</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">base/body.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>A base layer of styling can be applied to an area of your site by adding the <code>ds-base</code> class. If you&#39;re implementing the design system on a new site, you would likely want to apply this class to the <code>&lt;body&gt;</code> element. On existing sites this might not be feasible and introduce unintended side effects. In which case, you could apply the <code>ds-base</code> class to an element which scopes the styling to its decendants.</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="468472905"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="base" data-reactid="10">Base</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">base/body.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>A base layer of styling can be applied to an area of your site by adding the <code>ds-base</code> class. If you&#39;re implementing the design system on a new site, you would likely want to apply this class to the <code>&lt;body&gt;</code> element. On existing sites this might not be feasible and introduce unintended side effects. In which case, you could apply the <code>ds-base</code> class to an element which scopes the styling to its decendants.</p>
 <p>Specifically, the base styling sets the following properties:</p>
 <ul>
 <li><code>color</code></li>
 <li><code>font-family</code></li>
 <li><code>font-size</code></li>
 <li><code>line-height</code></li>
-</ul></div><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20"><div class="ds-base ds-u-padding--2">
+</ul></div><section class="ds-u-margin-top--3" data-reactid="16"><div class="markup markup--html" data-reactid="17"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="18"><div class="ds-base ds-u-padding--2">
  We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="21"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="22">Code snippet</summary><pre class="language-markup" data-reactid="23"><code data-reactid="24"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-base ds-u-padding--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="19"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="20">Code snippet</summary><pre class="language-markup" data-reactid="21"><code data-reactid="22"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-base ds-u-padding--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
  We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="25"><div class="c-markup__header" data-reactid="26"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="27"><!-- react-text: 28 -->Modifier: <!-- /react-text --><code data-reactid="29">ds-base--inverse</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="30">Applies an inverse <code>color</code> and <code>background-color</code></p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="31"><div class="ds-base ds-base--inverse ds-u-padding--2">
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="23"><div class="c-markup__header" data-reactid="24"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="25"><!-- react-text: 26 -->Modifier: <!-- /react-text --><code data-reactid="27">ds-base--inverse</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="28">Applies an inverse <code>color</code> and <code>background-color</code></p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="29"><div class="ds-base ds-base--inverse ds-u-padding--2">
  We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="32"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="33">Code snippet</summary><pre class="language-markup" data-reactid="34"><code data-reactid="35"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-base ds-base--inverse ds-u-padding--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="30"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="31">Code snippet</summary><pre class="language-markup" data-reactid="32"><code data-reactid="33"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-base ds-base--inverse ds-u-padding--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
  We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Base","description":"<p>A base layer of styling can be applied to an area of your site by adding the <code>ds-base</code> class. If you&#39;re implementing the design system on a new site, you would likely want to apply this class to the <code>&lt;body&gt;</code> element. On existing sites this might not be feasible and introduce unintended side effects. In which case, you could apply the <code>ds-base</code> class to an element which scopes the styling to its decendants.</p>\n<p>Specifically, the base styling sets the following properties:</p>\n<ul>\n<li><code>color</code></li>\n<li><code>font-family</code></li>\n<li><code>font-size</code></li>\n<li><code>line-height</code></li>\n</ul>","reference":"base","referenceNumber":"1","referenceURI":"design-system/base","weight":10,"markup":"<div class=\"ds-base {{modifier}} ds-u-padding--2\">\n  {{lorem-l}}\n</div>","source":{"filename":"base/body.scss","path":"packages/core/src/base/body.scss"},"depth":1,"modifiers":[{"name":".ds-base--inverse","description":"Applies an inverse <code>color</code> and <code>background-color</code>","className":"ds-base--inverse"}],"sections":[{"header":"Typography","description":"<p>The design system does not style base HTML text elements (like <code>h1</code>, <code>h2</code>, <code>p</code>, etc) and you should instead use one of the base class names to apply type styling. The base typography classes are:</p>\n<ul>\n<li><code>ds-display</code></li>\n<li><code>ds-title</code></li>\n<li><code>ds-h[LEVEL]</code></li>\n<li><code>ds-text--[modifier]</code></li>\n</ul>\n<p>See the examples below to see how each of these can be used.</p>\n<p>Utility classes can also be used to change type features like <a href=\"/utilities/font-size\">font size</a>, <a href=\"/utilities/color\">color</a>, <a href=\"/utilities/font-weight\">weight</a>, and <a href=\"/utilities/font-style\">style</a>.</p>","reference":"base.typography","referenceNumber":"1.1","referenceURI":"design-system/base/typography","weight":0,"markup":"<p class=\"ds-text--lead\"><strong>Lead paragraph.</strong>  {{lorem-l}}</p>\n<p class=\"ds-text\"><strong>Body paragraph.</strong>  {{ lorem-l }}</p>\n<h1 class=\"ds-display\">Display</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-title\">Title</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h1\">Heading 1</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h2\">Heading 2</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h3\">Heading 3</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h4\">Heading 4</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h5\">Heading 5</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h6\">Heading 6</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>","source":{"filename":"base/typography.scss","path":"packages/core/src/base/typography.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Responsive typography can be accomplished by using the <a href=\"/utilites/font-size#responsive\">responsive prefixed font size utility class</a>. Since the base typography margins and line height is measured in <code>em</code> units, they&#39;ll automatically adjust as you change the font size.</p>\n<p>You likely don&#39;t need to do this for type that is already small, like <code>ds-text</code>, <code>ds-h6</code>, and <code>ds-h5</code></p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"base.typography.responsive","referenceNumber":"1.1.1","referenceURI":"design-system/base/typography/responsive","weight":0,"markup":"<h2 class=\"ds-h4 ds-u-sm-font-size--h3 ds-u-md-font-size--h2 ds-u-lg-font-size--h1\">\n  Responsive heading\n</h2>\n<p class=\"ds-text ds-u-font-size--small ds-u-md-font-size--base ds-u-lg-font-size--lead\">\n  {{ lorem-l }}\n</p>","source":{"filename":"base/typography.scss","path":"packages/core/src/base/typography.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"base.typography"}],"parentReference":"base"}],"parentReference":null};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Base","description":"<p>A base layer of styling can be applied to an area of your site by adding the <code>ds-base</code> class. If you&#39;re implementing the design system on a new site, you would likely want to apply this class to the <code>&lt;body&gt;</code> element. On existing sites this might not be feasible and introduce unintended side effects. In which case, you could apply the <code>ds-base</code> class to an element which scopes the styling to its decendants.</p>\n<p>Specifically, the base styling sets the following properties:</p>\n<ul>\n<li><code>color</code></li>\n<li><code>font-family</code></li>\n<li><code>font-size</code></li>\n<li><code>line-height</code></li>\n</ul>","reference":"base","referenceNumber":"1","referenceURI":"design-system/base","weight":10,"markup":"<div class=\"ds-base {{modifier}} ds-u-padding--2\">\n  {{lorem-l}}\n</div>","source":{"filename":"base/body.scss","path":"packages/core/src/base/body.scss"},"depth":1,"modifiers":[{"name":".ds-base--inverse","description":"Applies an inverse <code>color</code> and <code>background-color</code>","className":"ds-base--inverse"}],"sections":[{"header":"Typography","description":"<p>The design system does not style base HTML text elements (like <code>h1</code>, <code>h2</code>, <code>p</code>, etc) and you should instead use one of the base class names to apply type styling. The base typography classes are:</p>\n<ul>\n<li><code>ds-display</code></li>\n<li><code>ds-title</code></li>\n<li><code>ds-h[LEVEL]</code></li>\n<li><code>ds-text--[modifier]</code></li>\n</ul>\n<p>See the examples below to see how each of these can be used.</p>\n<p>Utility classes can also be used to change type features like <a href=\"/utilities/font-size\">font size</a>, <a href=\"/utilities/color\">color</a>, <a href=\"/utilities/font-weight\">weight</a>, and <a href=\"/utilities/font-style\">style</a>.</p>","reference":"base.typography","referenceNumber":"1.1","referenceURI":"design-system/base/typography","weight":0,"markup":"<p class=\"ds-text--lead\"><strong>Lead paragraph.</strong>  {{lorem-l}}</p>\n<p class=\"ds-text\"><strong>Body paragraph.</strong>  {{ lorem-l }}</p>\n<h1 class=\"ds-display\">Display</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-title\">Title</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h1\">Heading 1</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h2\">Heading 2</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h3\">Heading 3</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h4\">Heading 4</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h5\">Heading 5</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h6\">Heading 6</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>","source":{"filename":"base/typography.scss","path":"packages/core/src/base/typography.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Responsive","description":"<p>Responsive typography can be accomplished by using the <a href=\"/utilites/font-size#responsive\">responsive prefixed font size utility class</a>. Since the base typography margins and line height is measured in <code>em</code> units, they&#39;ll automatically adjust as you change the font size.</p>\n<p>You likely don&#39;t need to do this for type that is already small, like <code>ds-text</code>, <code>ds-h6</code>, and <code>ds-h5</code></p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"base.typography.responsive","referenceNumber":"1.1.1","referenceURI":"design-system/base/typography/responsive","weight":0,"markup":"<h2 class=\"ds-h4 ds-u-sm-font-size--h3 ds-u-md-font-size--h2 ds-u-lg-font-size--h1\">\n  Responsive heading\n</h2>\n<p class=\"ds-text ds-u-font-size--small ds-u-md-font-size--base ds-u-lg-font-size--lead\">\n  {{ lorem-l }}\n</p>","source":{"filename":"base/typography.scss","path":"packages/core/src/base/typography.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"base.typography"}],"parentReference":"base"}],"parentReference":null};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/base/typography/index.html b/docs/base/typography/index.html
index 28a9c70611..b543160bc9 100644
--- a/docs/base/typography/index.html
+++ b/docs/base/typography/index.html
@@ -2,14 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Typography - CMSgov Design System</title>
+  <title>Typography - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="134298384"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="base.typography" data-reactid="12">Typography</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">base/typography.scss</code></heading><div data-reactid="15"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="16"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="17">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="18"><article class="ds-u-margin-y--6 l-content" data-reactid="19"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="20"><p>The design system does not style base HTML text elements (like <code>h1</code>, <code>h2</code>, <code>p</code>, etc) and you should instead use one of the base class names to apply type styling. The base typography classes are:</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1833175113"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="base.typography" data-reactid="10">Typography</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">base/typography.scss</code></heading><div data-reactid="13"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="14"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="15">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="16"><article class="ds-u-margin-y--6 l-content" data-reactid="17"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="18"><p>The design system does not style base HTML text elements (like <code>h1</code>, <code>h2</code>, <code>p</code>, etc) and you should instead use one of the base class names to apply type styling. The base typography classes are:</p>
 <ul>
 <li><code>ds-display</code></li>
 <li><code>ds-title</code></li>
@@ -17,7 +17,7 @@
 <li><code>ds-text--[modifier]</code></li>
 </ul>
 <p>See the examples below to see how each of these can be used.</p>
-<p>Utility classes can also be used to change type features like <a href="/utilities/font-size">font size</a>, <a href="/utilities/color">color</a>, <a href="/utilities/font-weight">weight</a>, and <a href="/utilities/font-style">style</a>.</p></div><section class="ds-u-margin-top--3" data-reactid="21"><div class="markup markup--html" data-reactid="22"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="23"><p class="ds-text--lead"><strong>Lead paragraph.</strong> We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.</p>
+<p>Utility classes can also be used to change type features like <a href="/utilities/font-size">font size</a>, <a href="/utilities/color">color</a>, <a href="/utilities/font-weight">weight</a>, and <a href="/utilities/font-style">style</a>.</p></div><section class="ds-u-margin-top--3" data-reactid="19"><div class="markup markup--html" data-reactid="20"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="21"><p class="ds-text--lead"><strong>Lead paragraph.</strong> We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.</p>
 <p class="ds-text"><strong>Body paragraph.</strong> We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.</p>
 <h1 class="ds-display">Display</h1>
   <p class="ds-text ds-u-color--muted">We the People of the United States, in Order to form a more perfect Union</p>
@@ -34,7 +34,7 @@ <h1 class="ds-h4">Heading 4</h1>
 <h1 class="ds-h5">Heading 5</h1>
   <p class="ds-text ds-u-color--muted">We the People of the United States, in Order to form a more perfect Union</p>
 <h1 class="ds-h6">Heading 6</h1>
-  <p class="ds-text ds-u-color--muted">We the People of the United States, in Order to form a more perfect Union</p></div><details class="ds-u-margin-bottom--2" data-reactid="24"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="25">Code snippet</summary><pre class="language-markup" data-reactid="26"><code data-reactid="27"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-text--lead<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>strong</span><span class="token punctuation">></span></span>Lead paragraph.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>strong</span><span class="token punctuation">></span></span> We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
+  <p class="ds-text ds-u-color--muted">We the People of the United States, in Order to form a more perfect Union</p></div><details class="ds-u-margin-bottom--2" data-reactid="22"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="23">Code snippet</summary><pre class="language-markup" data-reactid="24"><code data-reactid="25"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-text--lead<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>strong</span><span class="token punctuation">></span></span>Lead paragraph.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>strong</span><span class="token punctuation">></span></span> We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-text<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>strong</span><span class="token punctuation">></span></span>Body paragraph.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>strong</span><span class="token punctuation">></span></span> We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h1</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-display<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Display<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h1</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-text ds-u-color--muted<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
@@ -51,8 +51,7 @@ <h1 class="ds-h6">Heading 6</h1>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h1</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-h5<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Heading 5<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h1</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-text ds-u-color--muted<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h1</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-h6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Heading 6<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h1</span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-text ds-u-color--muted<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="28"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="29"><h2 id="responsive">Responsive</h2>
-<p>Responsive typography can be accomplished by using the <a href="/utilites/font-size#responsive">responsive prefixed font size utility class</a>. Since the base typography margins and line height is measured in <code>em</code> units, they&#39;ll automatically adjust as you change the font size.</p>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-text ds-u-color--muted<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="26"><div data-reactid="27"><h2 class="ds-h2" id="base.typography.responsive" data-reactid="28">Responsive</h2></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="29"><p>Responsive typography can be accomplished by using the <a href="/utilites/font-size#responsive">responsive prefixed font size utility class</a>. Since the base typography margins and line height is measured in <code>em</code> units, they&#39;ll automatically adjust as you change the font size.</p>
 <p>You likely don&#39;t need to do this for type that is already small, like <code>ds-text</code>, <code>ds-h6</code>, and <code>ds-h5</code></p>
 <p><em>Resize your browser to see each breakpoint in action:</em></p></div><section class="ds-u-margin-top--3" data-reactid="30"><div class="markup markup--html" data-reactid="31"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="32"><h2 class="ds-h4 ds-u-sm-font-size--h3 ds-u-md-font-size--h2 ds-u-lg-font-size--h1">
   Responsive heading
@@ -67,8 +66,8 @@ <h1 class="ds-h6">Heading 6</h1>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Typography","description":"<p>The design system does not style base HTML text elements (like <code>h1</code>, <code>h2</code>, <code>p</code>, etc) and you should instead use one of the base class names to apply type styling. The base typography classes are:</p>\n<ul>\n<li><code>ds-display</code></li>\n<li><code>ds-title</code></li>\n<li><code>ds-h[LEVEL]</code></li>\n<li><code>ds-text--[modifier]</code></li>\n</ul>\n<p>See the examples below to see how each of these can be used.</p>\n<p>Utility classes can also be used to change type features like <a href=\"/utilities/font-size\">font size</a>, <a href=\"/utilities/color\">color</a>, <a href=\"/utilities/font-weight\">weight</a>, and <a href=\"/utilities/font-style\">style</a>.</p>","reference":"base.typography","referenceNumber":"1.1","referenceURI":"design-system/base/typography","weight":0,"markup":"<p class=\"ds-text--lead\"><strong>Lead paragraph.</strong>  {{lorem-l}}</p>\n<p class=\"ds-text\"><strong>Body paragraph.</strong>  {{ lorem-l }}</p>\n<h1 class=\"ds-display\">Display</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-title\">Title</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h1\">Heading 1</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h2\">Heading 2</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h3\">Heading 3</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h4\">Heading 4</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h5\">Heading 5</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h6\">Heading 6</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>","source":{"filename":"base/typography.scss","path":"packages/core/src/base/typography.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Responsive typography can be accomplished by using the <a href=\"/utilites/font-size#responsive\">responsive prefixed font size utility class</a>. Since the base typography margins and line height is measured in <code>em</code> units, they&#39;ll automatically adjust as you change the font size.</p>\n<p>You likely don&#39;t need to do this for type that is already small, like <code>ds-text</code>, <code>ds-h6</code>, and <code>ds-h5</code></p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"base.typography.responsive","referenceNumber":"1.1.1","referenceURI":"design-system/base/typography/responsive","weight":0,"markup":"<h2 class=\"ds-h4 ds-u-sm-font-size--h3 ds-u-md-font-size--h2 ds-u-lg-font-size--h1\">\n  Responsive heading\n</h2>\n<p class=\"ds-text ds-u-font-size--small ds-u-md-font-size--base ds-u-lg-font-size--lead\">\n  {{ lorem-l }}\n</p>","source":{"filename":"base/typography.scss","path":"packages/core/src/base/typography.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"base.typography"}],"parentReference":"base"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Typography","description":"<p>The design system does not style base HTML text elements (like <code>h1</code>, <code>h2</code>, <code>p</code>, etc) and you should instead use one of the base class names to apply type styling. The base typography classes are:</p>\n<ul>\n<li><code>ds-display</code></li>\n<li><code>ds-title</code></li>\n<li><code>ds-h[LEVEL]</code></li>\n<li><code>ds-text--[modifier]</code></li>\n</ul>\n<p>See the examples below to see how each of these can be used.</p>\n<p>Utility classes can also be used to change type features like <a href=\"/utilities/font-size\">font size</a>, <a href=\"/utilities/color\">color</a>, <a href=\"/utilities/font-weight\">weight</a>, and <a href=\"/utilities/font-style\">style</a>.</p>","reference":"base.typography","referenceNumber":"1.1","referenceURI":"design-system/base/typography","weight":0,"markup":"<p class=\"ds-text--lead\"><strong>Lead paragraph.</strong>  {{lorem-l}}</p>\n<p class=\"ds-text\"><strong>Body paragraph.</strong>  {{ lorem-l }}</p>\n<h1 class=\"ds-display\">Display</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-title\">Title</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h1\">Heading 1</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h2\">Heading 2</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h3\">Heading 3</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h4\">Heading 4</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h5\">Heading 5</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>\n<h1 class=\"ds-h6\">Heading 6</h1>\n  <p class=\"ds-text ds-u-color--muted\">{{ lorem-m }}</p>","source":{"filename":"base/typography.scss","path":"packages/core/src/base/typography.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Responsive","description":"<p>Responsive typography can be accomplished by using the <a href=\"/utilites/font-size#responsive\">responsive prefixed font size utility class</a>. Since the base typography margins and line height is measured in <code>em</code> units, they&#39;ll automatically adjust as you change the font size.</p>\n<p>You likely don&#39;t need to do this for type that is already small, like <code>ds-text</code>, <code>ds-h6</code>, and <code>ds-h5</code></p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"base.typography.responsive","referenceNumber":"1.1.1","referenceURI":"design-system/base/typography/responsive","weight":0,"markup":"<h2 class=\"ds-h4 ds-u-sm-font-size--h3 ds-u-md-font-size--h2 ds-u-lg-font-size--h1\">\n  Responsive heading\n</h2>\n<p class=\"ds-text ds-u-font-size--small ds-u-md-font-size--base ds-u-lg-font-size--lead\">\n  {{ lorem-l }}\n</p>","source":{"filename":"base/typography.scss","path":"packages/core/src/base/typography.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"base.typography"}],"parentReference":"base"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/components/alert/index.html b/docs/components/alert/index.html
index 54d55bd20f..712263e48b 100644
--- a/docs/components/alert/index.html
+++ b/docs/components/alert/index.html
@@ -2,54 +2,54 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Alert - CMSgov Design System</title>
+  <title>Alert - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-33313486"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-u-fill--warn ds-u-color--base" data-reactid="12">prototype</span><h1 class="ds-display" id="components.alert" data-reactid="13">Alert</h1><div class="ds-u-clearfix" data-reactid="14"></div><code class="ds-u-font-size--small" data-reactid="15">components/Alert/Alert.scss</code><p data-reactid="16"><a href="https://standards.usa.gov/components/alerts" data-reactid="17">US Web Design Standard</a></p></heading><div data-reactid="18"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="19"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="20">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="21">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="22"><article class="ds-u-margin-y--6 l-content" data-reactid="23"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="24"><p>Alerts keep users informed of important and sometimes time-sensitive changes.</p></div><section class="ds-u-margin-top--3" data-reactid="25"><div class="markup markup--html" data-reactid="26"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="27"><div class="ds-c-alert">
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1385395706"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-c-badge--success" data-reactid="10">recommended</span><h1 class="ds-display" id="components.alert" data-reactid="11">Alert</h1><div class="ds-u-clearfix" data-reactid="12"></div><code class="ds-u-font-size--small" data-reactid="13">components/Alert/Alert.scss</code><p data-reactid="14"><a href="https://standards.usa.gov/components/alerts" data-reactid="15">US Web Design Standard</a></p></heading><div data-reactid="16"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="17"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="18">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="19">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="20"><article class="ds-u-margin-y--6 l-content" data-reactid="21"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="22"><p>Alerts keep users informed of important and sometimes time-sensitive changes.</p></div><section class="ds-u-margin-top--3" data-reactid="23"><div class="markup markup--html" data-reactid="24"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="25"><div class="ds-c-alert">
   <div class="ds-c-alert__body">
     <h3 class="ds-c-alert__heading">Status heading</h3>
     <p class="ds-c-alert__text">Lorem ipsum dolor sit <a href="http://example.com">link text</a>, consectetur adipiscing elit, sed do eiusmod.</p>
   </div>
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="28"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="29">Code snippet</summary><pre class="language-markup" data-reactid="30"><code data-reactid="31"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="26"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="27">Code snippet</summary><pre class="language-markup" data-reactid="28"><code data-reactid="29"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__body<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h3</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__heading<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Status heading<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h3</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__text<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Lorem ipsum dolor sit <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>http://example.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>link text<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">></span></span>, consectetur adipiscing elit, sed do eiusmod.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="32"><div class="c-markup__header" data-reactid="33"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="34"><!-- react-text: 35 -->Modifier: <!-- /react-text --><code data-reactid="36">ds-c-alert--error</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="37">Error message</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="38"><div class="ds-c-alert ds-c-alert--error">
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="30"><div class="c-markup__header" data-reactid="31"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="32"><!-- react-text: 33 -->Modifier: <!-- /react-text --><code data-reactid="34">ds-c-alert--error</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="35">Error message</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="36"><div class="ds-c-alert ds-c-alert--error">
   <div class="ds-c-alert__body">
     <h3 class="ds-c-alert__heading">Status heading</h3>
     <p class="ds-c-alert__text">Lorem ipsum dolor sit <a href="http://example.com">link text</a>, consectetur adipiscing elit, sed do eiusmod.</p>
   </div>
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="39"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="40">Code snippet</summary><pre class="language-markup" data-reactid="41"><code data-reactid="42"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert ds-c-alert--error<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="37"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="38">Code snippet</summary><pre class="language-markup" data-reactid="39"><code data-reactid="40"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert ds-c-alert--error<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__body<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h3</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__heading<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Status heading<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h3</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__text<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Lorem ipsum dolor sit <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>http://example.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>link text<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">></span></span>, consectetur adipiscing elit, sed do eiusmod.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="43"><div class="c-markup__header" data-reactid="44"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="45"><!-- react-text: 46 -->Modifier: <!-- /react-text --><code data-reactid="47">ds-c-alert--warn</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="48">Warning message</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="49"><div class="ds-c-alert ds-c-alert--warn">
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="41"><div class="c-markup__header" data-reactid="42"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="43"><!-- react-text: 44 -->Modifier: <!-- /react-text --><code data-reactid="45">ds-c-alert--warn</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="46">Warning message</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="47"><div class="ds-c-alert ds-c-alert--warn">
   <div class="ds-c-alert__body">
     <h3 class="ds-c-alert__heading">Status heading</h3>
     <p class="ds-c-alert__text">Lorem ipsum dolor sit <a href="http://example.com">link text</a>, consectetur adipiscing elit, sed do eiusmod.</p>
   </div>
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="50"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="51">Code snippet</summary><pre class="language-markup" data-reactid="52"><code data-reactid="53"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert ds-c-alert--warn<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="48"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="49">Code snippet</summary><pre class="language-markup" data-reactid="50"><code data-reactid="51"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert ds-c-alert--warn<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__body<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h3</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__heading<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Status heading<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h3</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__text<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Lorem ipsum dolor sit <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>http://example.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>link text<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">></span></span>, consectetur adipiscing elit, sed do eiusmod.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="54"><div class="c-markup__header" data-reactid="55"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="56"><!-- react-text: 57 -->Modifier: <!-- /react-text --><code data-reactid="58">ds-c-alert--success</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="59">Success message</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="60"><div class="ds-c-alert ds-c-alert--success">
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="52"><div class="c-markup__header" data-reactid="53"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="54"><!-- react-text: 55 -->Modifier: <!-- /react-text --><code data-reactid="56">ds-c-alert--success</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="57">Success message</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="58"><div class="ds-c-alert ds-c-alert--success">
   <div class="ds-c-alert__body">
     <h3 class="ds-c-alert__heading">Status heading</h3>
     <p class="ds-c-alert__text">Lorem ipsum dolor sit <a href="http://example.com">link text</a>, consectetur adipiscing elit, sed do eiusmod.</p>
   </div>
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="61"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="62">Code snippet</summary><pre class="language-markup" data-reactid="63"><code data-reactid="64"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert ds-c-alert--success<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="59"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="60">Code snippet</summary><pre class="language-markup" data-reactid="61"><code data-reactid="62"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert ds-c-alert--success<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__body<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h3</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__heading<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Status heading<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h3</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__text<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Lorem ipsum dolor sit <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>http://example.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>link text<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">></span></span>, consectetur adipiscing elit, sed do eiusmod.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="65"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="66"><h3 id="other-patterns">Other patterns</h3></div><section class="ds-u-margin-top--3" data-reactid="67"><div class="markup markup--html" data-reactid="68"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="69"><div class="ds-c-alert">
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="63"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="64"><h3 id="other-patterns">Other patterns</h3></div><section class="ds-u-margin-top--3" data-reactid="65"><div class="markup markup--html" data-reactid="66"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="67"><div class="ds-c-alert">
   <div class="ds-c-alert__body">
     <p class="ds-c-alert__text">We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.</p>
   </div>
@@ -69,7 +69,7 @@ <h3 class="ds-c-alert__heading">Status heading</h3>
     </ul>
     <a href="http://example.com">Link text</a>
   </div>
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="70"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="71">Code snippet</summary><pre class="language-markup" data-reactid="72"><code data-reactid="73"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="68"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="69">Code snippet</summary><pre class="language-markup" data-reactid="70"><code data-reactid="71"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__body<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__text<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
@@ -89,52 +89,59 @@ <h3 class="ds-c-alert__heading">Status heading</h3>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>ul</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>http://example.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Link text<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="74"><section class="ds-u-margin-top--3" data-reactid="75"><div class="markup markup--html" data-reactid="76"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="77"><div class="ds-base--inverse ds-u-padding--2">
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="72"><section class="ds-u-margin-top--3" data-reactid="73"><div class="markup markup--html" data-reactid="74"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="75"><div class="ds-base--inverse ds-u-padding--2">
   <div class="ds-c-alert">
     <div class="ds-c-alert__body">
       <h3 class="ds-c-alert__heading">Status heading</h3>
       <p class="ds-c-alert__text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod.</p>
     </div>
   </div>
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="78"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="79">Code snippet</summary><pre class="language-markup" data-reactid="80"><code data-reactid="81"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-base--inverse ds-u-padding--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="76"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="77">Code snippet</summary><pre class="language-markup" data-reactid="78"><code data-reactid="79"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-base--inverse ds-u-padding--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__body<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h3</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__heading<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Status heading<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h3</span><span class="token punctuation">></span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-alert__text<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="82"><div data-reactid="83"><h1 class="ds-h1" id="components.alert.react" data-reactid="84">React</h1><code class="ds-u-font-size--small" data-reactid="85">components/Alert/Alert</code></div><section data-reactid="86"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="87"></div><div class="markup markup--react" data-reactid="88"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="89"><div class="ds-c-alert" data-reactid="90"><div class="ds-c-alert__body" data-reactid="91"><h3 class="ds-c-alert__heading" data-reactid="92">A react component</h3><!-- react-text: 93 -->This is an example of a React Alert component.<!-- /react-text --></div></div></div><details class="ds-u-margin-bottom--2" data-reactid="94"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="95">Code snippet</summary><pre class="language-jsx" data-reactid="96"><code data-reactid="97"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Alert</span> <span class="token attr-name">heading</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>A</span> <span class="token attr-name">react</span> <span class="token attr-name">component"</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="80"><div data-reactid="81"><h2 class="ds-h2" id="components.alert.react" data-reactid="82">React</h2><code class="ds-u-font-size--small" data-reactid="83">components/Alert/Alert.jsx</code></div><section data-reactid="84"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="85"></div><div class="markup markup--react" data-reactid="86"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="87"><div class="ds-c-alert" data-reactid="88"><div class="ds-c-alert__body" data-reactid="89"><h3 class="ds-c-alert__heading" data-reactid="90">A react component</h3><!-- react-text: 91 -->This is an example of a React Alert component.<!-- /react-text --></div></div></div><details class="ds-u-margin-bottom--2" data-reactid="92"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="93">Code snippet</summary><pre class="language-jsx" data-reactid="94"><code data-reactid="95"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Alert</span> <span class="token attr-name">heading</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>A</span> <span class="token attr-name">react</span> <span class="token attr-name">component"</span><span class="token punctuation">></span></span>
   This is an example <span class="token keyword">of</span> a React Alert component<span class="token punctuation">.</span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>Alert</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="98">Props</h3><table class="ds-c-table" data-reactid="99"><thead data-reactid="100"><tr data-reactid="101"><td data-reactid="102">Name</td><td data-reactid="103">Type</td><td data-reactid="104">Default</td><td data-reactid="105">Description</td></tr></thead><tbody data-reactid="106"><tr data-reactid="107"><td data-reactid="108"><code class="ds-u-font-weight--bold" data-reactid="109">heading</code></td><td data-reactid="110"><code data-reactid="111">string</code></td><td data-reactid="112"></td><td data-reactid="113"></td></tr><tr data-reactid="114"><td data-reactid="115"><code class="ds-u-font-weight--bold" data-reactid="116">role</code></td><td data-reactid="117"><code data-reactid="118">&#x27;alert&#x27;, &#x27;alertdialog&#x27;</code></td><td data-reactid="119"></td><td data-reactid="120"><div data-reactid="121"><p>ARIA <code>role</code></p>
-</div></td></tr><tr data-reactid="122"><td data-reactid="123"><code class="ds-u-font-weight--bold" data-reactid="124">variation</code></td><td data-reactid="125"><code data-reactid="126">&#x27;error&#x27;, &#x27;warn&#x27;, &#x27;success&#x27;</code></td><td data-reactid="127"></td><td data-reactid="128"></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="129"><article class="ds-u-margin-y--6 l-content" data-reactid="130"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="131"><h2 id="accessibility">Accessibility</h2>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>Alert</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="96">Props</h3><table class="ds-c-table" data-reactid="97"><thead data-reactid="98"><tr data-reactid="99"><td data-reactid="100">Name</td><td data-reactid="101">Type</td><td data-reactid="102">Default</td><td data-reactid="103">Description</td></tr></thead><tbody data-reactid="104"><tr data-reactid="105"><td data-reactid="106"><code class="ds-u-font-weight--bold" data-reactid="107">heading</code></td><td data-reactid="108"><code data-reactid="109">string</code></td><td data-reactid="110"></td><td data-reactid="111"></td></tr><tr data-reactid="112"><td data-reactid="113"><code class="ds-u-font-weight--bold" data-reactid="114">role</code></td><td data-reactid="115"><code data-reactid="116">&#x27;alert&#x27;, &#x27;alertdialog&#x27;</code></td><td data-reactid="117"></td><td data-reactid="118"><div data-reactid="119"><p>ARIA <code>role</code></p>
+</div></td></tr><tr data-reactid="120"><td data-reactid="121"><code class="ds-u-font-weight--bold" data-reactid="122">variation</code></td><td data-reactid="123"><code data-reactid="124">&#x27;error&#x27;, &#x27;warn&#x27;, &#x27;success&#x27;</code></td><td data-reactid="125"></td><td data-reactid="126"></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="127"><article class="ds-u-margin-y--6 l-content" data-reactid="128"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="129"><h2 id="when-to-use">When to use</h2>
 <ul>
-<li>Use the ARIA <code>role=&quot;alert&quot;</code> to inform assistive technologies of a time-sensitive and important message that is not interactive. If the message is interactive, use the <code>alertdialog</code> role instead.</li>
-<li>Do not visually hide alert messages on the page and then make them visible when they are needed. Users of older assistive technologies may still be able to perceive the alert messages even if they are not currently applicable.</li>
-</ul>
-<h2 id="usability">Usability</h2>
-<h3 id="when-to-use">When to use</h3>
-<ul>
-<li>As a notification that keeps people informed of the status of the system and which may or may not require the user to respond. This includes errors, warnings, and general updates.</li>
 <li>As a validation message that alerts someone that they just did something that needs to be corrected or as confirmation that a task was completed successfully.</li>
+<li>As a callout or notification for important or timely information. This includes errors, warnings, and general information.</li>
 </ul>
-<h3 id="when-to-consider-something-else">When to consider something else</h3>
+<h2 id="when-to-consider-alternatives">When to consider alternatives</h2>
 <ul>
-<li>On long forms, always include in-line validation in addition to any error messages that appear at the top of the form.</li>
+<li>On long forms, always include in-line validation in addition to any error messages that appear at the top of the form. When possible, simplify forms by rewriting and where possible, splitting long forms across multiple pages</li>
 <li>If an action will result in destroying a user’s work (for example, deleting an application) use a more intrusive pattern, such as a confirmation modal dialogue, to allow the user to confirm that this is what they want.</li>
 </ul>
 <h2 id="guidance">Guidance</h2>
 <ul>
-<li>When the user is required to do something in response to an alert, let them know what they need to do and make that task as easy as possible. Think about how much context to provide with your message. For example, a notification of a system change may require more contextual information than a validation message. Write the message in concise, human readable language; avoid jargon and computer code.</li>
+<li>Don’t overdo it — too many notifications will either overwhelm or annoy the user and are likely to be ignored.</li>
+<li>Write the message in concise, human readable language; avoid jargon and computer code.</li>
+<li>Don’t include notifications that aren’t related to the user’s current goal.</li>
+<li>When the user is required to do something in response to an alert, let them know what they need to do and make that task as easy as possible.</li>
+</ul>
+<p><strong>When the alert is for an error:</strong></p>
+<ul>
 <li>Be polite in error messages — don’t place blame on the user.</li>
 <li>Users generally won’t read documentation but will read a message that helps them resolve an error; include some educational material in your error message.</li>
-<li>But don’t overdo it — too many notifications will either overwhelm or annoy the user and are likely to be ignored.</li>
-<li>Allow a user to dismiss a notification wherever appropriate.</li>
-<li>Don’t include notifications that aren’t related to the user’s current goal.</li>
+<li>If the error relates to specific text fields, give these fields an error state as well.</li>
+</ul>
+<h2 id="accessibility">Accessibility</h2>
+<ul>
+<li>Use the ARIA <code>role=&quot;alert&quot;</code> to inform assistive technologies of a time-sensitive and important message that is not interactive. If the message is interactive, use the <code>alertdialog</code> role instead.</li>
+<li>Do not visually hide alert messages on the page and then make them visible when they are needed. Users of older assistive technologies may still be able to perceive the alert messages even if they are not currently applicable.</li>
+</ul>
+<h2 id="learn-more">Learn more</h2>
+<ul>
+<li><a href="https://content-guide.18f.gov/active-voice/">18F Content Guide - Active voice</a></li>
 </ul></div></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Alert","description":"<p>Alerts keep users informed of important and sometimes time-sensitive changes.</p>","reference":"components.alert","referenceNumber":"3.1","referenceURI":"design-system/components/alert","weight":0,"markup":"<div class=\"ds-c-alert {{modifier}}\">\n  <div class=\"ds-c-alert__body\">\n    <h3 class=\"ds-c-alert__heading\">Status heading</h3>\n    <p class=\"ds-c-alert__text\">Lorem ipsum dolor sit <a href=\"http://example.com\">link text</a>, consectetur adipiscing elit, sed do eiusmod.</p>\n  </div>\n</div>","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":2,"modifiers":[{"name":".ds-c-alert--error","description":"Error message","className":"ds-c-alert--error"},{"name":".ds-c-alert--warn","description":"Warning message","className":"ds-c-alert--warn"},{"name":".ds-c-alert--success","description":"Success message","className":"ds-c-alert--success"}],"sections":[{"header":"---","description":"<h3 id=\"other-patterns\">Other patterns</h3>","reference":"components.alert.variations","referenceNumber":"3.1.4","referenceURI":"design-system/components/alert/variations","weight":0,"markup":"<div class=\"ds-c-alert\">\n  <div class=\"ds-c-alert__body\">\n    <p class=\"ds-c-alert__text\">{{lorem-l}}</p>\n  </div>\n</div>\n<div class=\"ds-c-alert ds-u-margin-top--2\">\n  <div class=\"ds-c-alert__body\">\n    <p class=\"ds-c-alert__text\">{{lorem-s}}</p>\n  </div>\n</div>\n<div class=\"ds-c-alert ds-u-margin-top--2\">\n  <div class=\"ds-c-alert__body\">\n    <h3 class=\"ds-c-alert__heading\">Status heading</h3>\n    <p class=\"ds-c-alert__text\">{{lorem-m}}</p>\n    <ul class=\"ds-c-list\">\n      <li>Alert list item</li>\n      <li>Alert list item</li>\n    </ul>\n    <a href=\"http://example.com\">Link text</a>\n  </div>\n</div>","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.alert"},{"header":"---","description":"","reference":"components.alert.inverse","referenceNumber":"3.1.2","referenceURI":"design-system/components/alert/inverse","weight":0,"markup":"<div class=\"ds-base--inverse ds-u-padding--2\">\n  <div class=\"ds-c-alert {{modifier}}\">\n    <div class=\"ds-c-alert__body\">\n      <h3 class=\"ds-c-alert__heading\">Status heading</h3>\n      <p class=\"ds-c-alert__text\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod.</p>\n    </div>\n  </div>\n</div>","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.alert"},{"header":"React","description":"","reference":"components.alert.react","referenceNumber":"3.1.3","referenceURI":"design-system/components/alert/react","weight":0,"markup":"","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Alert","parentReference":"components.alert"},{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Use the ARIA <code>role=&quot;alert&quot;</code> to inform assistive technologies of a time-sensitive and important message that is not interactive. If the message is interactive, use the <code>alertdialog</code> role instead.</li>\n<li>Do not visually hide alert messages on the page and then make them visible when they are needed. Users of older assistive technologies may still be able to perceive the alert messages even if they are not currently applicable.</li>\n</ul>\n<h2 id=\"usability\">Usability</h2>\n<h3 id=\"when-to-use\">When to use</h3>\n<ul>\n<li>As a notification that keeps people informed of the status of the system and which may or may not require the user to respond. This includes errors, warnings, and general updates.</li>\n<li>As a validation message that alerts someone that they just did something that needs to be corrected or as confirmation that a task was completed successfully.</li>\n</ul>\n<h3 id=\"when-to-consider-something-else\">When to consider something else</h3>\n<ul>\n<li>On long forms, always include in-line validation in addition to any error messages that appear at the top of the form.</li>\n<li>If an action will result in destroying a user’s work (for example, deleting an application) use a more intrusive pattern, such as a confirmation modal dialogue, to allow the user to confirm that this is what they want.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>When the user is required to do something in response to an alert, let them know what they need to do and make that task as easy as possible. Think about how much context to provide with your message. For example, a notification of a system change may require more contextual information than a validation message. Write the message in concise, human readable language; avoid jargon and computer code.</li>\n<li>Be polite in error messages — don’t place blame on the user.</li>\n<li>Users generally won’t read documentation but will read a message that helps them resolve an error; include some educational material in your error message.</li>\n<li>But don’t overdo it — too many notifications will either overwhelm or annoy the user and are likely to be ignored.</li>\n<li>Allow a user to dismiss a notification wherever appropriate.</li>\n<li>Don’t include notifications that aren’t related to the user’s current goal.</li>\n</ul>","reference":"components.alert.guidance","referenceNumber":"3.1.1","referenceURI":"design-system/components/alert/guidance","weight":0,"markup":"","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.alert"}],"status":"prototype","uswdsUrl":"https://standards.usa.gov/components/alerts","parentReference":"components"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Alert","description":"<p>Alerts keep users informed of important and sometimes time-sensitive changes.</p>","reference":"components.alert","referenceNumber":"3.1","referenceURI":"design-system/components/alert","weight":0,"markup":"<div class=\"ds-c-alert {{modifier}}\">\n  <div class=\"ds-c-alert__body\">\n    <h3 class=\"ds-c-alert__heading\">Status heading</h3>\n    <p class=\"ds-c-alert__text\">Lorem ipsum dolor sit <a href=\"http://example.com\">link text</a>, consectetur adipiscing elit, sed do eiusmod.</p>\n  </div>\n</div>","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":2,"modifiers":[{"name":".ds-c-alert--error","description":"Error message","className":"ds-c-alert--error"},{"name":".ds-c-alert--warn","description":"Warning message","className":"ds-c-alert--warn"},{"name":".ds-c-alert--success","description":"Success message","className":"ds-c-alert--success"}],"sections":[{"header":"---","description":"<h3 id=\"other-patterns\">Other patterns</h3>","reference":"components.alert.variations","referenceNumber":"3.1.4","referenceURI":"design-system/components/alert/variations","weight":0,"markup":"<div class=\"ds-c-alert\">\n  <div class=\"ds-c-alert__body\">\n    <p class=\"ds-c-alert__text\">{{lorem-l}}</p>\n  </div>\n</div>\n<div class=\"ds-c-alert ds-u-margin-top--2\">\n  <div class=\"ds-c-alert__body\">\n    <p class=\"ds-c-alert__text\">{{lorem-s}}</p>\n  </div>\n</div>\n<div class=\"ds-c-alert ds-u-margin-top--2\">\n  <div class=\"ds-c-alert__body\">\n    <h3 class=\"ds-c-alert__heading\">Status heading</h3>\n    <p class=\"ds-c-alert__text\">{{lorem-m}}</p>\n    <ul class=\"ds-c-list\">\n      <li>Alert list item</li>\n      <li>Alert list item</li>\n    </ul>\n    <a href=\"http://example.com\">Link text</a>\n  </div>\n</div>","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.alert"},{"header":"---","description":"","reference":"components.alert.inverse","referenceNumber":"3.1.2","referenceURI":"design-system/components/alert/inverse","weight":0,"markup":"<div class=\"ds-base--inverse ds-u-padding--2\">\n  <div class=\"ds-c-alert {{modifier}}\">\n    <div class=\"ds-c-alert__body\">\n      <h3 class=\"ds-c-alert__heading\">Status heading</h3>\n      <p class=\"ds-c-alert__text\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod.</p>\n    </div>\n  </div>\n</div>","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.alert"},{"header":"React","description":"","reference":"components.alert.react","referenceNumber":"3.1.3","referenceURI":"design-system/components/alert/react","weight":0,"markup":"","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Alert","parentReference":"components.alert"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>As a validation message that alerts someone that they just did something that needs to be corrected or as confirmation that a task was completed successfully.</li>\n<li>As a callout or notification for important or timely information. This includes errors, warnings, and general information.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>On long forms, always include in-line validation in addition to any error messages that appear at the top of the form. When possible, simplify forms by rewriting and where possible, splitting long forms across multiple pages</li>\n<li>If an action will result in destroying a user’s work (for example, deleting an application) use a more intrusive pattern, such as a confirmation modal dialogue, to allow the user to confirm that this is what they want.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Don’t overdo it — too many notifications will either overwhelm or annoy the user and are likely to be ignored.</li>\n<li>Write the message in concise, human readable language; avoid jargon and computer code.</li>\n<li>Don’t include notifications that aren’t related to the user’s current goal.</li>\n<li>When the user is required to do something in response to an alert, let them know what they need to do and make that task as easy as possible.</li>\n</ul>\n<p><strong>When the alert is for an error:</strong></p>\n<ul>\n<li>Be polite in error messages — don’t place blame on the user.</li>\n<li>Users generally won’t read documentation but will read a message that helps them resolve an error; include some educational material in your error message.</li>\n<li>If the error relates to specific text fields, give these fields an error state as well.</li>\n</ul>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Use the ARIA <code>role=&quot;alert&quot;</code> to inform assistive technologies of a time-sensitive and important message that is not interactive. If the message is interactive, use the <code>alertdialog</code> role instead.</li>\n<li>Do not visually hide alert messages on the page and then make them visible when they are needed. Users of older assistive technologies may still be able to perceive the alert messages even if they are not currently applicable.</li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"https://content-guide.18f.gov/active-voice/\">18F Content Guide - Active voice</a></li>\n</ul>","reference":"components.alert.guidance","referenceNumber":"3.1.1","referenceURI":"design-system/components/alert/guidance","weight":0,"markup":"","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.alert"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/alerts","parentReference":"components"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/components/badge/index.html b/docs/components/badge/index.html
index 66b05f4862..53770d6db9 100644
--- a/docs/components/badge/index.html
+++ b/docs/components/badge/index.html
@@ -2,22 +2,63 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Badge - CMSgov Design System</title>
+  <title>Badge - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-937706848"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-u-fill--warn ds-u-color--base" data-reactid="12">prototype</span><h1 class="ds-display" id="components.badge" data-reactid="13">Badge</h1><div class="ds-u-clearfix" data-reactid="14"></div><code class="ds-u-font-size--small" data-reactid="15">components/Badge/Badge</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="16"><article class="ds-u-margin-y--6 l-content" data-reactid="17"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="18"><p>Badges draw attention to new or important content.</p></div><section class="ds-u-margin-top--3" data-reactid="19"><div class="markup markup--html" data-reactid="20"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="21"><span class="ds-c-badge">New</span>
-<span class="ds-c-badge ds-u-fill--error">Due: December 31, 2018</span></div><details class="ds-u-margin-bottom--2" data-reactid="22"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="23">Code snippet</summary><pre class="language-markup" data-reactid="24"><code data-reactid="25"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>New<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-u-fill--error<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Due: December 31, 2018<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span></code></pre></details></div></section><section data-reactid="26"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="27"></div><div class="markup markup--react" data-reactid="28"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="29"><span class="ds-c-badge" data-reactid="30">Today</span></div><details class="ds-u-margin-bottom--2" data-reactid="31"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="32">Code snippet</summary><pre class="language-jsx" data-reactid="33"><code data-reactid="34"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Badge</span><span class="token punctuation">></span></span>
-  Today
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>Badge</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="35">Props</h3><table class="ds-c-table" data-reactid="36"><thead data-reactid="37"><tr data-reactid="38"><td data-reactid="39">Name</td><td data-reactid="40">Type</td><td data-reactid="41">Default</td><td data-reactid="42">Description</td></tr></thead><tbody data-reactid="43"></tbody></table></section></article></div></div></main></div></div></div>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1426512677"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-c-badge--warn" data-reactid="10">beta</span><h1 class="ds-display" id="components.badge" data-reactid="11">Badge</h1><div class="ds-u-clearfix" data-reactid="12"></div><code class="ds-u-font-size--small" data-reactid="13">components/Badge/Badge.scss</code><p data-reactid="14"><a href="https://standards.usa.gov/components/labels/" data-reactid="15">US Web Design Standard</a></p></heading><div data-reactid="16"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="17"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="18">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="19">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="20"><article class="ds-u-margin-y--6 l-content" data-reactid="21"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="22"><p>Badges hold small amounts of information and draw attention to new or important content.</p></div><section class="ds-u-margin-top--3" data-reactid="23"><div class="markup markup--html" data-reactid="24"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="25"><span class="ds-c-badge">5</span>
+<span class="ds-c-badge">Badge label</span>
+<span class="ds-c-badge ds-u-font-size--base">Badge label</span></div><details class="ds-u-margin-bottom--2" data-reactid="26"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="27">Code snippet</summary><pre class="language-markup" data-reactid="28"><code data-reactid="29"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>5<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Badge label<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-u-font-size--base<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Badge label<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="30"><div class="c-markup__header" data-reactid="31"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="32"><!-- react-text: 33 -->Modifier: <!-- /react-text --><code data-reactid="34">ds-c-badge--info</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="35">Info badge</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="36"><span class="ds-c-badge ds-c-badge--info">5</span>
+<span class="ds-c-badge ds-c-badge--info">Badge label</span>
+<span class="ds-c-badge ds-c-badge--info ds-u-font-size--base">Badge label</span></div><details class="ds-u-margin-bottom--2" data-reactid="37"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="38">Code snippet</summary><pre class="language-markup" data-reactid="39"><code data-reactid="40"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-c-badge--info<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>5<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-c-badge--info<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Badge label<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-c-badge--info ds-u-font-size--base<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Badge label<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="41"><div class="c-markup__header" data-reactid="42"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="43"><!-- react-text: 44 -->Modifier: <!-- /react-text --><code data-reactid="45">ds-c-badge--success</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="46">Success badge</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="47"><span class="ds-c-badge ds-c-badge--success">5</span>
+<span class="ds-c-badge ds-c-badge--success">Badge label</span>
+<span class="ds-c-badge ds-c-badge--success ds-u-font-size--base">Badge label</span></div><details class="ds-u-margin-bottom--2" data-reactid="48"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="49">Code snippet</summary><pre class="language-markup" data-reactid="50"><code data-reactid="51"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-c-badge--success<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>5<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-c-badge--success<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Badge label<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-c-badge--success ds-u-font-size--base<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Badge label<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="52"><div class="c-markup__header" data-reactid="53"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="54"><!-- react-text: 55 -->Modifier: <!-- /react-text --><code data-reactid="56">ds-c-badge--warn</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="57">Warning badge</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="58"><span class="ds-c-badge ds-c-badge--warn">5</span>
+<span class="ds-c-badge ds-c-badge--warn">Badge label</span>
+<span class="ds-c-badge ds-c-badge--warn ds-u-font-size--base">Badge label</span></div><details class="ds-u-margin-bottom--2" data-reactid="59"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="60">Code snippet</summary><pre class="language-markup" data-reactid="61"><code data-reactid="62"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-c-badge--warn<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>5<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-c-badge--warn<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Badge label<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-c-badge--warn ds-u-font-size--base<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Badge label<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="63"><div class="c-markup__header" data-reactid="64"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="65"><!-- react-text: 66 -->Modifier: <!-- /react-text --><code data-reactid="67">ds-c-badge--alert</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="68">Alert or error badge</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="69"><span class="ds-c-badge ds-c-badge--alert">5</span>
+<span class="ds-c-badge ds-c-badge--alert">Badge label</span>
+<span class="ds-c-badge ds-c-badge--alert ds-u-font-size--base">Badge label</span></div><details class="ds-u-margin-bottom--2" data-reactid="70"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="71">Code snippet</summary><pre class="language-markup" data-reactid="72"><code data-reactid="73"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-c-badge--alert<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>5<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-c-badge--alert<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Badge label<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-badge ds-c-badge--alert ds-u-font-size--base<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Badge label<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="74"><article class="ds-u-margin-y--6 l-content" data-reactid="75"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="76"><h2 id="when-to-use">When to use</h2>
+<ul>
+<li>To draw attention to new, important content on a page that might otherwise be missed.</li>
+<li>To filter results with one or more tags.</li>
+<li>To indicate the number of new or unread items within a container. For example, to indicate the number of unread messages within a person’s inbox.</li>
+</ul>
+<h2 id="when-to-consider-alternatives">When to consider alternatives</h2>
+<ul>
+<li>When users are likely to confuse a badge with a button. For example, when the badge appears in the same area of the page as buttons.</li>
+<li>To call attention to new or updated content, consider changing the background color of the object itself or experiment with changing the font weight.</li>
+<li>When users already expect content to be updated frequently. For example, on a site dedicated to breaking news. In this case placing the new content at the top may be enough.</li>
+</ul>
+<h2 id="guidance">Guidance</h2>
+<ul>
+<li>Don’t overdo it — if everything on a page is called out as important, nothing is important.</li>
+<li>Users may confuse badges as buttons. Always conduct usability testing to make sure your particular implementation is not causing frustration.</li>
+<li>Don’t mix interactive and static badges on your site. Once you establish a pattern for how badges behave, users will expect that behavior every time.</li>
+</ul>
+<h2 id="accessibility">Accessibility</h2>
+<ul>
+<li>When badges are used to call out new content that is dynamically loaded onto a page, be sure to use <a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions">ARIA live regions</a> to alert screen readers of the change.</li>
+</ul>
+<h2 id="future-research">Future research</h2>
+<ul>
+<li>Further usability testing should be done to ensure badges aren&#39;t being confused with buttons. Further iteration can be done with sizing and colors if there is confusion.</li>
+</ul></div></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Badge","description":"<p>Badges draw attention to new or important content.</p>","reference":"components.badge","referenceNumber":"3.2","referenceURI":"design-system/components/badge","weight":0,"markup":"<span class=\"ds-c-badge\">New</span>\n<span class=\"ds-c-badge ds-u-fill--error\">Due: December 31, 2018</span>","source":{"filename":"components/Badge/Badge.scss","path":"packages/core/src/components/Badge/Badge.scss"},"depth":2,"modifiers":[],"sections":[],"reactComponent":"Badge","status":"prototype","parentReference":"components"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Badge","description":"<p>Badges hold small amounts of information and draw attention to new or important content.</p>","reference":"components.badge","referenceNumber":"3.2","referenceURI":"design-system/components/badge","weight":0,"markup":"<span class=\"ds-c-badge {{modifier}}\">5</span>\n<span class=\"ds-c-badge {{modifier}}\">Badge label</span>\n<span class=\"ds-c-badge {{modifier}} ds-u-font-size--base\">Badge label</span>","source":{"filename":"components/Badge/Badge.scss","path":"packages/core/src/components/Badge/Badge.scss"},"depth":2,"modifiers":[{"name":".ds-c-badge--info","description":"Info badge","className":"ds-c-badge--info"},{"name":".ds-c-badge--success","description":"Success badge","className":"ds-c-badge--success"},{"name":".ds-c-badge--warn","description":"Warning badge","className":"ds-c-badge--warn"},{"name":".ds-c-badge--alert","description":"Alert or error badge","className":"ds-c-badge--alert"}],"sections":[{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>To draw attention to new, important content on a page that might otherwise be missed.</li>\n<li>To filter results with one or more tags.</li>\n<li>To indicate the number of new or unread items within a container. For example, to indicate the number of unread messages within a person’s inbox.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>When users are likely to confuse a badge with a button. For example, when the badge appears in the same area of the page as buttons.</li>\n<li>To call attention to new or updated content, consider changing the background color of the object itself or experiment with changing the font weight.</li>\n<li>When users already expect content to be updated frequently. For example, on a site dedicated to breaking news. In this case placing the new content at the top may be enough.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Don’t overdo it — if everything on a page is called out as important, nothing is important.</li>\n<li>Users may confuse badges as buttons. Always conduct usability testing to make sure your particular implementation is not causing frustration.</li>\n<li>Don’t mix interactive and static badges on your site. Once you establish a pattern for how badges behave, users will expect that behavior every time.</li>\n</ul>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>When badges are used to call out new content that is dynamically loaded onto a page, be sure to use <a href=\"https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions\">ARIA live regions</a> to alert screen readers of the change.</li>\n</ul>\n<h2 id=\"future-research\">Future research</h2>\n<ul>\n<li>Further usability testing should be done to ensure badges aren&#39;t being confused with buttons. Further iteration can be done with sizing and colors if there is confusion.</li>\n</ul>","reference":"components.badge.guidance","referenceNumber":"3.2.1","referenceURI":"design-system/components/badge/guidance","weight":0,"markup":"","source":{"filename":"components/Badge/Badge.scss","path":"packages/core/src/components/Badge/Badge.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.badge"}],"status":"beta","uswdsUrl":"https://standards.usa.gov/components/labels/","parentReference":"components"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/components/button/index.html b/docs/components/button/index.html
index f85a2dab46..04c125a0ea 100644
--- a/docs/components/button/index.html
+++ b/docs/components/button/index.html
@@ -2,14 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Button - CMSgov Design System</title>
+  <title>Button - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-873536040"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-u-fill--warn ds-u-color--base" data-reactid="12">prototype</span><h1 class="ds-display" id="components.button" data-reactid="13">Button</h1><div class="ds-u-clearfix" data-reactid="14"></div><code class="ds-u-font-size--small" data-reactid="15">components/Button/Button.scss</code></heading><div data-reactid="16"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="17"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="18">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="19">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="20"><article class="ds-u-margin-y--6 l-content" data-reactid="21"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="22"><p>Use buttons to signal actions.</p></div><section class="ds-u-margin-top--3" data-reactid="23"><div class="markup markup--html" data-reactid="24"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="25"><a href="http://example.com" class="ds-c-button">Link</a>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1312745460"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-c-badge--success" data-reactid="10">recommended</span><h1 class="ds-display" id="components.button" data-reactid="11">Button</h1><div class="ds-u-clearfix" data-reactid="12"></div><code class="ds-u-font-size--small" data-reactid="13">components/Button/Button.scss</code><p data-reactid="14"><a href="https://standards.usa.gov/components/buttons" data-reactid="15">US Web Design Standard</a></p></heading><div data-reactid="16"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="17"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="18">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="19">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="20"><article class="ds-u-margin-y--6 l-content" data-reactid="21"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="22"><p>Use buttons to signal actions.</p></div><section class="ds-u-margin-top--3" data-reactid="23"><div class="markup markup--html" data-reactid="24"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="25"><a href="http://example.com" class="ds-c-button">Link</a>
 <button type="button" class="ds-c-button ds-c-button--small">Button</button>
 <button type="button" class="ds-c-button">Button</button>
 <button type="button" class="ds-c-button ds-c-button--big">Button</button></div><details class="ds-u-margin-bottom--2" data-reactid="26"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="27">Code snippet</summary><pre class="language-markup" data-reactid="28"><code data-reactid="29"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>http://example.com<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-button<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Link<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">></span></span>
@@ -55,10 +55,10 @@
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-button ds-c-button--danger<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Button<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-button ds-c-button--success<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Button<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-button ds-c-button--disabled-inverse<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Button<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="92"><div data-reactid="93"><h1 class="ds-h1" id="components.button.icons" data-reactid="94">Button icons</h1><code class="ds-u-font-size--small" data-reactid="95">components/Button/Button.scss</code></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="96"><ul>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="92"><div data-reactid="93"><h2 class="ds-h2" id="components.button.icons" data-reactid="94">Button icons</h2></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="95"><ul>
 <li>Add an inline SVG icon and it will become the same color as the button text. For the crispest icon rendering, ensure the icon has a square <code>viewBox</code> with values that are multiples of <code>8</code> (ie. <code>24x24</code>).</li>
 <li>Use the margin utility class to add spacing between the icon and button text.</li>
-</ul></div><section class="ds-u-margin-top--3" data-reactid="97"><div class="markup markup--html" data-reactid="98"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="99"><button class="ds-c-button">
+</ul></div><section class="ds-u-margin-top--3" data-reactid="96"><div class="markup markup--html" data-reactid="97"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="98"><button class="ds-c-button">
   <svg class="ds-u-margin-right--1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" viewBox="0 0 24 24">
     <use xlink:href="/design-system/public/images/symbols.svg#download"></use>
   </svg>Left icon
@@ -70,7 +70,7 @@
 </button>
 <button class="ds-c-button ds-c-button--outline">
   No icon
-</button></div><details class="ds-u-margin-bottom--2" data-reactid="100"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="101">Code snippet</summary><pre class="language-markup" data-reactid="102"><code data-reactid="103"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-button<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</button></div><details class="ds-u-margin-bottom--2" data-reactid="99"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="100">Code snippet</summary><pre class="language-markup" data-reactid="101"><code data-reactid="102"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-button<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>svg</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-margin-right--1<span class="token punctuation">"</span></span> <span class="token attr-name">xmlns</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>http://www.w3.org/2000/svg<span class="token punctuation">"</span></span> <span class="token attr-name">aria-hidden</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>true<span class="token punctuation">"</span></span> <span class="token attr-name">viewBox</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>0 0 24 24<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>use</span> <span class="token attr-name"><span class="token namespace">xlink:</span>href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>/design-system/public/images/symbols.svg#download<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>use</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>svg</span><span class="token punctuation">></span></span>Left icon
@@ -82,16 +82,16 @@
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-button ds-c-button--outline<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   No icon
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="104"><div data-reactid="105"><h1 class="ds-h1" id="components.button.inline-field" data-reactid="106">Button inline with field</h1><code class="ds-u-font-size--small" data-reactid="107">components/Button/Button.scss</code></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="108"><p>The button is the same height as a single-line text field.</p></div><section class="ds-u-margin-top--3" data-reactid="109"><div class="markup markup--html" data-reactid="110"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="111"><input type="text" class="ds-c-field ds-u-display--inline-block" />
-<button class="ds-c-button">Submit</button></div><details class="ds-u-margin-bottom--2" data-reactid="112"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="113">Code snippet</summary><pre class="language-markup" data-reactid="114"><code data-reactid="115"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field ds-u-display--inline-block<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-button<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Submit<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="116"><div data-reactid="117"><h1 class="ds-h1" id="components.button.react" data-reactid="118">React</h1><code class="ds-u-font-size--small" data-reactid="119">components/Button/Button</code></div><section data-reactid="120"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="121"><p>The <code>Button</code> component accepts its text as children (AKA inner HTML), which
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="103"><div data-reactid="104"><h2 class="ds-h2" id="components.button.inline-field" data-reactid="105">Button inline with field</h2></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="106"><p>The button is the same height as a single-line text field.</p></div><section class="ds-u-margin-top--3" data-reactid="107"><div class="markup markup--html" data-reactid="108"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="109"><input type="text" class="ds-c-field ds-u-display--inline-block" />
+<button class="ds-c-button">Submit</button></div><details class="ds-u-margin-bottom--2" data-reactid="110"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="111">Code snippet</summary><pre class="language-markup" data-reactid="112"><code data-reactid="113"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field ds-u-display--inline-block<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-button<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Submit<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="114"><div data-reactid="115"><h2 class="ds-h2" id="components.button.react" data-reactid="116">React</h2><code class="ds-u-font-size--small" data-reactid="117">components/Button/Button.jsx</code></div><section data-reactid="118"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="119"><p>The <code>Button</code> component accepts its text as children (AKA inner HTML), which
 means you can also pass in HTML or custom components. This gives you a lot of
 flexibility and supports a variety of advanced use cases. The most common use
 case would be passing in an SVG icon along with the text.</p>
 <p>In addition to the supported props listed, you can also pass in additional
 props, which will be passed to the rendered root component. For example,
 you could pass in a <code>target</code> prop to pass to the rendered anchor element.</p>
-</div><div class="markup markup--react" data-reactid="122"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="123"><div data-reactid="124"><button class="ds-c-button" type="button" data-reactid="125">React button</button><a class="ds-c-button ds-c-button--primary ds-u-margin-left--1" href="http://example.com" target="_blank" data-reactid="126">React anchor button</a></div></div><details class="ds-u-margin-bottom--2" data-reactid="127"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="128">Code snippet</summary><pre class="language-jsx" data-reactid="129"><code data-reactid="130"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">></span></span>
+</div><div class="markup markup--react" data-reactid="120"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="121"><div data-reactid="122"><button class="ds-c-button" type="button" data-reactid="123">React button</button><a class="ds-c-button ds-c-button--primary ds-u-margin-left--1" href="http://example.com" target="_blank" data-reactid="124">React anchor button</a></div></div><details class="ds-u-margin-bottom--2" data-reactid="125"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="126">Code snippet</summary><pre class="language-jsx" data-reactid="127"><code data-reactid="128"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Button</span><span class="token punctuation">></span></span>
     React button
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>Button</span><span class="token punctuation">></span></span>
@@ -103,47 +103,77 @@
   <span class="token punctuation">></span></span>
     React anchor button
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>Button</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="131">Props</h3><table class="ds-c-table" data-reactid="132"><thead data-reactid="133"><tr data-reactid="134"><td data-reactid="135">Name</td><td data-reactid="136">Type</td><td data-reactid="137">Default</td><td data-reactid="138">Description</td></tr></thead><tbody data-reactid="139"><tr data-reactid="140"><td data-reactid="141"><code class="ds-u-font-weight--bold" data-reactid="142">className</code></td><td data-reactid="143"><code data-reactid="144">string</code></td><td data-reactid="145"></td><td data-reactid="146"><div data-reactid="147"><p>Additional classes to be added to the root button element.
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="129">Props</h3><table class="ds-c-table" data-reactid="130"><thead data-reactid="131"><tr data-reactid="132"><td data-reactid="133">Name</td><td data-reactid="134">Type</td><td data-reactid="135">Default</td><td data-reactid="136">Description</td></tr></thead><tbody data-reactid="137"><tr data-reactid="138"><td data-reactid="139"><code class="ds-u-font-weight--bold" data-reactid="140">className</code></td><td data-reactid="141"><code data-reactid="142">string</code></td><td data-reactid="143"></td><td data-reactid="144"><div data-reactid="145"><p>Additional classes to be added to the root button element.
 Useful for adding utility classes.</p>
-</div></td></tr><tr data-reactid="148"><td data-reactid="149"><code class="ds-u-font-weight--bold" data-reactid="150">component</code></td><td data-reactid="151"><code data-reactid="152">element, func</code></td><td data-reactid="153"></td><td data-reactid="154"><div data-reactid="155"><p>When provided, this will render the passed in component. This is useful when
+</div></td></tr><tr data-reactid="146"><td data-reactid="147"><code class="ds-u-font-weight--bold" data-reactid="148">component</code></td><td data-reactid="149"><code data-reactid="150">element, func</code></td><td data-reactid="151"></td><td data-reactid="152"><div data-reactid="153"><p>When provided, this will render the passed in component. This is useful when
 integrating with React Router&#39;s <code>&lt;Link&gt;</code> or using your own custom component.</p>
-</div></td></tr><tr data-reactid="156"><td data-reactid="157"><code class="ds-u-font-weight--bold" data-reactid="158">disabled</code></td><td data-reactid="159"><code data-reactid="160">bool</code></td><td data-reactid="161"></td><td data-reactid="162"></td></tr><tr data-reactid="163"><td data-reactid="164"><code class="ds-u-font-weight--bold" data-reactid="165">href</code></td><td data-reactid="166"><code data-reactid="167">string</code></td><td data-reactid="168"></td><td data-reactid="169"><div data-reactid="170"><p>When provided the root component will render as an <code>&lt;a&gt;</code> element
+</div></td></tr><tr data-reactid="154"><td data-reactid="155"><code class="ds-u-font-weight--bold" data-reactid="156">disabled</code></td><td data-reactid="157"><code data-reactid="158">bool</code></td><td data-reactid="159"></td><td data-reactid="160"></td></tr><tr data-reactid="161"><td data-reactid="162"><code class="ds-u-font-weight--bold" data-reactid="163">href</code></td><td data-reactid="164"><code data-reactid="165">string</code></td><td data-reactid="166"></td><td data-reactid="167"><div data-reactid="168"><p>When provided the root component will render as an <code>&lt;a&gt;</code> element
 rather than <code>button</code>.</p>
-</div></td></tr><tr data-reactid="171"><td data-reactid="172"><code class="ds-u-font-weight--bold" data-reactid="173">inverse</code></td><td data-reactid="174"><code data-reactid="175">bool</code></td><td data-reactid="176"></td><td data-reactid="177"><div data-reactid="178"><p>Applies the inverse theme styling</p>
-</div></td></tr><tr data-reactid="179"><td data-reactid="180"><code class="ds-u-font-weight--bold" data-reactid="181">onClick</code></td><td data-reactid="182"><code data-reactid="183">func</code></td><td data-reactid="184"></td><td data-reactid="185"><div data-reactid="186"><p>Returns the <a href="https://facebook.github.io/react/docs/events.html"><code>SyntheticEvent</code></a>.
+</div></td></tr><tr data-reactid="169"><td data-reactid="170"><code class="ds-u-font-weight--bold" data-reactid="171">inverse</code></td><td data-reactid="172"><code data-reactid="173">bool</code></td><td data-reactid="174"></td><td data-reactid="175"><div data-reactid="176"><p>Applies the inverse theme styling</p>
+</div></td></tr><tr data-reactid="177"><td data-reactid="178"><code class="ds-u-font-weight--bold" data-reactid="179">onClick</code></td><td data-reactid="180"><code data-reactid="181">func</code></td><td data-reactid="182"></td><td data-reactid="183"><div data-reactid="184"><p>Returns the <a href="https://facebook.github.io/react/docs/events.html"><code>SyntheticEvent</code></a>.
 Not called when the button is disabled.</p>
-</div></td></tr><tr data-reactid="187"><td data-reactid="188"><code class="ds-u-font-weight--bold" data-reactid="189">size</code></td><td data-reactid="190"><code data-reactid="191">&#x27;small&#x27;, &#x27;big&#x27;</code></td><td data-reactid="192"></td><td data-reactid="193"></td></tr><tr data-reactid="194"><td data-reactid="195"><code class="ds-u-font-weight--bold" data-reactid="196">type</code></td><td data-reactid="197"><code data-reactid="198">&#x27;button&#x27;, &#x27;submit&#x27;</code></td><td data-reactid="199"><code data-reactid="200">&#x27;button&#x27;</code></td><td data-reactid="201"><div data-reactid="202"><p>Button <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type"><code>type</code></a> attribute</p>
-</div></td></tr><tr data-reactid="203"><td data-reactid="204"><code class="ds-u-font-weight--bold" data-reactid="205">variation</code></td><td data-reactid="206"><code data-reactid="207">&#x27;primary&#x27;, &#x27;danger&#x27;, &#x27;success&#x27;, &#x27;transparent&#x27;</code></td><td data-reactid="208"></td><td data-reactid="209"></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="210"><article class="ds-u-margin-y--6 l-content" data-reactid="211"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="212"><h2 id="accessibility">Accessibility</h2>
+</div></td></tr><tr data-reactid="185"><td data-reactid="186"><code class="ds-u-font-weight--bold" data-reactid="187">size</code></td><td data-reactid="188"><code data-reactid="189">&#x27;small&#x27;, &#x27;big&#x27;</code></td><td data-reactid="190"></td><td data-reactid="191"></td></tr><tr data-reactid="192"><td data-reactid="193"><code class="ds-u-font-weight--bold" data-reactid="194">type</code></td><td data-reactid="195"><code data-reactid="196">&#x27;button&#x27;, &#x27;submit&#x27;</code></td><td data-reactid="197"><code data-reactid="198">&#x27;button&#x27;</code></td><td data-reactid="199"><div data-reactid="200"><p>Button <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type"><code>type</code></a> attribute</p>
+</div></td></tr><tr data-reactid="201"><td data-reactid="202"><code class="ds-u-font-weight--bold" data-reactid="203">variation</code></td><td data-reactid="204"><code data-reactid="205">&#x27;primary&#x27;, &#x27;danger&#x27;, &#x27;success&#x27;, &#x27;transparent&#x27;</code></td><td data-reactid="206"></td><td data-reactid="207"></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="208"><article class="ds-u-margin-y--6 l-content" data-reactid="209"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="210"><h2 id="when-to-use">When to use</h2>
 <ul>
-<li>Buttons should display a visible focus state when users tab to them.</li>
-<li>Avoid using <code>&lt;div&gt;</code> or <code>&lt;img&gt;</code> tags to create buttons. Screen readers don&#39;t automatically know either is a usable button.</li>
-<li>When styling links to look like buttons, remember that screen readers handle links slightly differently than they do buttons. Pressing the Space key triggers a button, but pressing the Enter key triggers a link.</li>
-</ul>
-<h2 id="usability">Usability</h2>
-<h3 id="when-to-use">When to use</h3>
-<ul>
-<li>Use buttons for the most important actions you want users to take on your site, such as &quot;download,&quot; &quot;sign up,&quot; or &quot;log out.&quot;</li>
+<li>Use buttons for the most important actions you want users to take on your site, such as &quot;Download,&quot; &quot;Sign up,&quot; or &quot;Apply.&quot;</li>
 </ul>
-<h3 id="when-to-consider-something-else">When to consider something else</h3>
+<h2 id="when-to-consider-alternatives">When to consider alternatives</h2>
 <ul>
-<li>If you want to lead users between pages of a website. Use links instead.</li>
 <li>Less popular or less important actions may be visually styled as links.</li>
+<li>Buttons are for performing actions, not making choices. If you need your users to make a choice, use something else like radio buttons. Alternatively, if one choice is much less important then try styling it as a link instead.</li>
 </ul>
 <h2 id="guidance">Guidance</h2>
 <ul>
-<li>Generally, use primary buttons for actions that go to the next step and use secondary buttons for actions that happen on the current page.</li>
-<li>Style the button most users should click in a way that distinguishes from other buttons on the page. Try using the “large button” or the most visually distinct fill color.</li>
-<li>Make sure buttons look clickable—use color variations to distinguish static, hover and active states.</li>
-<li>Avoid using too many buttons on a page.</li>
+<li>Use the &quot;primary&quot; button variation for the button most users should click. This is your primary call-to-action.</li>
+<li>Avoid using too many buttons on a page. Aim to use only one button per page.</li>
+<li>Avoid similar styles elsewhere on the page that could be confused for buttons.</li>
+<li>Use buttons for the primary action and links for secondary actions.</li>
+</ul>
+<p><strong>Label text</strong></p>
+<ul>
 <li>Use sentence case for button labels.</li>
-<li>Button labels should be as short as possible with “trigger words” that your users will recognize to clearly explain what will happen when the button is clicked (for example, “download,” “view” or “sign up”).</li>
+<li>Button labels should be as short as possible with “trigger words” that your users will recognize to clearly explain what will happen when the button is clicked (for example, “Save and continue,” “Download” or “Sign up”).</li>
 <li>Make the first word of the button’s label a verb. For example, instead of “Complaint Filing”, label the button “File a complaint.”</li>
-<li>At times, consider adding an icon to signal specific actions (“download”, “open in a new window”, etc).</li>
+<li>If a button has an icon, it should still have accompanying text describing the action.</li>
+</ul>
+<p><strong>Destructive buttons</strong></p>
+<ul>
+<li>Use the &quot;danger&quot; button variation for destructive buttons. For example, buttons that delete or reset a user&#39;s information.</li>
+<li>Confirm the user meant to trigger a destructive action before following through with the action.</li>
+<li>Provide a method for a user to undo a destructive action.</li>
+</ul>
+<p><strong>Disabled buttons</strong></p>
+<ul>
+<li>Don’t disable buttons, unless there’s a good reason to.</li>
+<li>If you do disable a button, make sure it receives the disabled styling. A <code>button</code> element will automatically be styled as a disabled button when it has the <code>disabled</code> HTML attribute, but an <code>a</code> element will need to have the disabled modifier class applied to it.</li>
+</ul>
+<h2 id="accessibility">Accessibility</h2>
+<ul>
+<li>Buttons should display a visible focus state when users tab to them.</li>
+<li>Create a button with a <code>button</code> or <code>a</code> element to retain the native click functionality. Avoid using <code>&lt;div&gt;</code> or <code>&lt;img&gt;</code> tags to create buttons. Screen readers don&#39;t automatically know either is a usable button.</li>
+<li>When styling links to look like buttons, remember that screen readers handle links slightly differently than they do buttons. Pressing the <code>Space</code> key triggers a button, but pressing the <code>Enter</code> key triggers a link.</li>
+</ul>
+<h2 id="learn-more">Learn more</h2>
+<ul>
+<li><a href="https://www.nngroup.com/articles/clickable-elements/">Beyond Blue Links: Making Clickable Elements Recognizable</a></li>
+<li><a href="http://www.uxmatters.com/mt/archives/2012/05/7-basic-best-practices-for-buttons.php">7 Basic Best Practices for Buttons</a></li>
+<li><a href="http://www.uxbooth.com/articles/the-grammar-of-interactivity/">The Grammar of Interactivity</a></li>
+<li><a href="https://paper.dropbox.com/doc/Navigation-buttons-continue-next-previous-ghLqL5a9Ostxxb3rvBhyO">GOV.UK navigation buttons discussion</a></li>
+</ul>
+<p><strong>Button alignment</strong></p>
+<ul>
+<li><a href="http://www.slideshare.net/cjforms/buttons-on-forms-and-surveys-a-look-at-some-research-2012">Buttons on forms and surveys: a look at some research</a></li>
+<li><a href="https://www.lukew.com/ff/entry.asp?730=">Previous and Next Actions in Web Forms</a></li>
+</ul>
+<p><strong>ARIA</strong></p>
+<ul>
+<li><a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_button_role">Using the button role</a></li>
+<li><a href="https://www.deque.com/blog/accessible-aria-buttons">Building Accessible Buttons with ARIA</a></li>
 </ul></div></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Button","description":"<p>Use buttons to signal actions.</p>","reference":"components.button","referenceNumber":"3.3","referenceURI":"design-system/components/button","weight":0,"markup":"<a href=\"http://example.com\" class=\"ds-c-button {{modifier}}\">Link</a>\n<button type=\"button\" class=\"ds-c-button {{modifier}} ds-c-button--small\">Button</button>\n<button type=\"button\" class=\"ds-c-button {{modifier}}\">Button</button>\n<button type=\"button\" class=\"ds-c-button {{modifier}} ds-c-button--big\">Button</button>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":2,"modifiers":[{"name":".ds-c-button--primary","description":"The primary call-to-action","className":"ds-c-button--primary"},{"name":".ds-c-button--transparent","description":"A button closer to resembling an anchor element","className":"ds-c-button--transparent"},{"name":".ds-c-button--danger","description":"Indicates an action is destructive or dangerous","className":"ds-c-button--danger"},{"name":".ds-c-button--success","description":"Indicates a positive or successful action","className":"ds-c-button--success"}],"sections":[{"header":"---","description":"<h3 id=\"disabled-button\">Disabled button</h3>","reference":"components.button.disabled","referenceNumber":"3.3.1","referenceURI":"design-system/components/button/disabled","weight":0,"markup":"<button class=\"ds-c-button ds-c-button--disabled\">Button</button>\n<input disabled type=\"submit\" class=\"ds-c-button\" />","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"---","description":"<h3 id=\"inverse-theme\">Inverse theme</h3>","reference":"components.button.inverse","referenceNumber":"3.3.5","referenceURI":"design-system/components/button/inverse","weight":0,"markup":"<div class=\"ds-base--inverse ds-u-padding--2\">\n  <button class=\"ds-c-button ds-c-button--inverse\">Button</button>\n  <button class=\"ds-c-button ds-c-button--transparent-inverse\">Button</button>\n  <button class=\"ds-c-button ds-c-button--primary\">Button</button>\n  <button class=\"ds-c-button ds-c-button--danger\">Button</button>\n  <button class=\"ds-c-button ds-c-button--success\">Button</button>\n  <button class=\"ds-c-button ds-c-button--disabled-inverse\">Button</button>\n</div>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"Button icons","description":"<ul>\n<li>Add an inline SVG icon and it will become the same color as the button text. For the crispest icon rendering, ensure the icon has a square <code>viewBox</code> with values that are multiples of <code>8</code> (ie. <code>24x24</code>).</li>\n<li>Use the margin utility class to add spacing between the icon and button text.</li>\n</ul>","reference":"components.button.icons","referenceNumber":"3.3.3","referenceURI":"design-system/components/button/icons","weight":0,"markup":"<button class=\"ds-c-button\">\n  <svg class=\"ds-u-margin-right--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n    <use xlink:href=\"/design-system/public/images/symbols.svg#download\"></use>\n  </svg>Left icon\n</button>\n<button class=\"ds-c-button ds-c-button--primary\">\n  Right icon<svg class=\"ds-u-margin-left--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n    <use xlink:href=\"/design-system/public/images/symbols.svg#arrow-right\"></use>\n  </svg>\n</button>\n<button class=\"ds-c-button ds-c-button--outline\">\n  No icon\n</button>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"Button inline with field","description":"<p>The button is the same height as a single-line text field.</p>","reference":"components.button.inline-field","referenceNumber":"3.3.4","referenceURI":"design-system/components/button/inline-field","weight":0,"markup":"<input type=\"text\" class=\"ds-c-field ds-u-display--inline-block\" />\n<button class=\"ds-c-button\">Submit</button>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"React","description":"","reference":"components.button.react","referenceNumber":"3.3.6","referenceURI":"design-system/components/button/react","weight":0,"markup":"","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Button","parentReference":"components.button"},{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Buttons should display a visible focus state when users tab to them.</li>\n<li>Avoid using <code>&lt;div&gt;</code> or <code>&lt;img&gt;</code> tags to create buttons. Screen readers don&#39;t automatically know either is a usable button.</li>\n<li>When styling links to look like buttons, remember that screen readers handle links slightly differently than they do buttons. Pressing the Space key triggers a button, but pressing the Enter key triggers a link.</li>\n</ul>\n<h2 id=\"usability\">Usability</h2>\n<h3 id=\"when-to-use\">When to use</h3>\n<ul>\n<li>Use buttons for the most important actions you want users to take on your site, such as &quot;download,&quot; &quot;sign up,&quot; or &quot;log out.&quot;</li>\n</ul>\n<h3 id=\"when-to-consider-something-else\">When to consider something else</h3>\n<ul>\n<li>If you want to lead users between pages of a website. Use links instead.</li>\n<li>Less popular or less important actions may be visually styled as links.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Generally, use primary buttons for actions that go to the next step and use secondary buttons for actions that happen on the current page.</li>\n<li>Style the button most users should click in a way that distinguishes from other buttons on the page. Try using the “large button” or the most visually distinct fill color.</li>\n<li>Make sure buttons look clickable—use color variations to distinguish static, hover and active states.</li>\n<li>Avoid using too many buttons on a page.</li>\n<li>Use sentence case for button labels.</li>\n<li>Button labels should be as short as possible with “trigger words” that your users will recognize to clearly explain what will happen when the button is clicked (for example, “download,” “view” or “sign up”).</li>\n<li>Make the first word of the button’s label a verb. For example, instead of “Complaint Filing”, label the button “File a complaint.”</li>\n<li>At times, consider adding an icon to signal specific actions (“download”, “open in a new window”, etc).</li>\n</ul>","reference":"components.button.guidance","referenceNumber":"3.3.2","referenceURI":"design-system/components/button/guidance","weight":0,"markup":"","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"}],"status":"prototype","parentReference":"components"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Button","description":"<p>Use buttons to signal actions.</p>","reference":"components.button","referenceNumber":"3.3","referenceURI":"design-system/components/button","weight":0,"markup":"<a href=\"http://example.com\" class=\"ds-c-button {{modifier}}\">Link</a>\n<button type=\"button\" class=\"ds-c-button {{modifier}} ds-c-button--small\">Button</button>\n<button type=\"button\" class=\"ds-c-button {{modifier}}\">Button</button>\n<button type=\"button\" class=\"ds-c-button {{modifier}} ds-c-button--big\">Button</button>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":2,"modifiers":[{"name":".ds-c-button--primary","description":"The primary call-to-action","className":"ds-c-button--primary"},{"name":".ds-c-button--transparent","description":"A button closer to resembling an anchor element","className":"ds-c-button--transparent"},{"name":".ds-c-button--danger","description":"Indicates an action is destructive or dangerous","className":"ds-c-button--danger"},{"name":".ds-c-button--success","description":"Indicates a positive or successful action","className":"ds-c-button--success"}],"sections":[{"header":"---","description":"<h3 id=\"disabled-button\">Disabled button</h3>","reference":"components.button.disabled","referenceNumber":"3.3.1","referenceURI":"design-system/components/button/disabled","weight":0,"markup":"<button class=\"ds-c-button ds-c-button--disabled\">Button</button>\n<input disabled type=\"submit\" class=\"ds-c-button\" />","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"---","description":"<h3 id=\"inverse-theme\">Inverse theme</h3>","reference":"components.button.inverse","referenceNumber":"3.3.5","referenceURI":"design-system/components/button/inverse","weight":0,"markup":"<div class=\"ds-base--inverse ds-u-padding--2\">\n  <button class=\"ds-c-button ds-c-button--inverse\">Button</button>\n  <button class=\"ds-c-button ds-c-button--transparent-inverse\">Button</button>\n  <button class=\"ds-c-button ds-c-button--primary\">Button</button>\n  <button class=\"ds-c-button ds-c-button--danger\">Button</button>\n  <button class=\"ds-c-button ds-c-button--success\">Button</button>\n  <button class=\"ds-c-button ds-c-button--disabled-inverse\">Button</button>\n</div>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"Button icons","description":"<ul>\n<li>Add an inline SVG icon and it will become the same color as the button text. For the crispest icon rendering, ensure the icon has a square <code>viewBox</code> with values that are multiples of <code>8</code> (ie. <code>24x24</code>).</li>\n<li>Use the margin utility class to add spacing between the icon and button text.</li>\n</ul>","reference":"components.button.icons","referenceNumber":"3.3.3","referenceURI":"design-system/components/button/icons","weight":0,"markup":"<button class=\"ds-c-button\">\n  <svg class=\"ds-u-margin-right--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n    <use xlink:href=\"/design-system/public/images/symbols.svg#download\"></use>\n  </svg>Left icon\n</button>\n<button class=\"ds-c-button ds-c-button--primary\">\n  Right icon<svg class=\"ds-u-margin-left--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n    <use xlink:href=\"/design-system/public/images/symbols.svg#arrow-right\"></use>\n  </svg>\n</button>\n<button class=\"ds-c-button ds-c-button--outline\">\n  No icon\n</button>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"Button inline with field","description":"<p>The button is the same height as a single-line text field.</p>","reference":"components.button.inline-field","referenceNumber":"3.3.4","referenceURI":"design-system/components/button/inline-field","weight":0,"markup":"<input type=\"text\" class=\"ds-c-field ds-u-display--inline-block\" />\n<button class=\"ds-c-button\">Submit</button>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"React","description":"","reference":"components.button.react","referenceNumber":"3.3.6","referenceURI":"design-system/components/button/react","weight":0,"markup":"","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Button","parentReference":"components.button"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>Use buttons for the most important actions you want users to take on your site, such as &quot;Download,&quot; &quot;Sign up,&quot; or &quot;Apply.&quot;</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>Less popular or less important actions may be visually styled as links.</li>\n<li>Buttons are for performing actions, not making choices. If you need your users to make a choice, use something else like radio buttons. Alternatively, if one choice is much less important then try styling it as a link instead.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Use the &quot;primary&quot; button variation for the button most users should click. This is your primary call-to-action.</li>\n<li>Avoid using too many buttons on a page. Aim to use only one button per page.</li>\n<li>Avoid similar styles elsewhere on the page that could be confused for buttons.</li>\n<li>Use buttons for the primary action and links for secondary actions.</li>\n</ul>\n<p><strong>Label text</strong></p>\n<ul>\n<li>Use sentence case for button labels.</li>\n<li>Button labels should be as short as possible with “trigger words” that your users will recognize to clearly explain what will happen when the button is clicked (for example, “Save and continue,” “Download” or “Sign up”).</li>\n<li>Make the first word of the button’s label a verb. For example, instead of “Complaint Filing”, label the button “File a complaint.”</li>\n<li>If a button has an icon, it should still have accompanying text describing the action.</li>\n</ul>\n<p><strong>Destructive buttons</strong></p>\n<ul>\n<li>Use the &quot;danger&quot; button variation for destructive buttons. For example, buttons that delete or reset a user&#39;s information.</li>\n<li>Confirm the user meant to trigger a destructive action before following through with the action.</li>\n<li>Provide a method for a user to undo a destructive action.</li>\n</ul>\n<p><strong>Disabled buttons</strong></p>\n<ul>\n<li>Don’t disable buttons, unless there’s a good reason to.</li>\n<li>If you do disable a button, make sure it receives the disabled styling. A <code>button</code> element will automatically be styled as a disabled button when it has the <code>disabled</code> HTML attribute, but an <code>a</code> element will need to have the disabled modifier class applied to it.</li>\n</ul>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Buttons should display a visible focus state when users tab to them.</li>\n<li>Create a button with a <code>button</code> or <code>a</code> element to retain the native click functionality. Avoid using <code>&lt;div&gt;</code> or <code>&lt;img&gt;</code> tags to create buttons. Screen readers don&#39;t automatically know either is a usable button.</li>\n<li>When styling links to look like buttons, remember that screen readers handle links slightly differently than they do buttons. Pressing the <code>Space</code> key triggers a button, but pressing the <code>Enter</code> key triggers a link.</li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"https://www.nngroup.com/articles/clickable-elements/\">Beyond Blue Links: Making Clickable Elements Recognizable</a></li>\n<li><a href=\"http://www.uxmatters.com/mt/archives/2012/05/7-basic-best-practices-for-buttons.php\">7 Basic Best Practices for Buttons</a></li>\n<li><a href=\"http://www.uxbooth.com/articles/the-grammar-of-interactivity/\">The Grammar of Interactivity</a></li>\n<li><a href=\"https://paper.dropbox.com/doc/Navigation-buttons-continue-next-previous-ghLqL5a9Ostxxb3rvBhyO\">GOV.UK navigation buttons discussion</a></li>\n</ul>\n<p><strong>Button alignment</strong></p>\n<ul>\n<li><a href=\"http://www.slideshare.net/cjforms/buttons-on-forms-and-surveys-a-look-at-some-research-2012\">Buttons on forms and surveys: a look at some research</a></li>\n<li><a href=\"https://www.lukew.com/ff/entry.asp?730=\">Previous and Next Actions in Web Forms</a></li>\n</ul>\n<p><strong>ARIA</strong></p>\n<ul>\n<li><a href=\"https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_button_role\">Using the button role</a></li>\n<li><a href=\"https://www.deque.com/blog/accessible-aria-buttons\">Building Accessible Buttons with ARIA</a></li>\n</ul>","reference":"components.button.guidance","referenceNumber":"3.3.2","referenceURI":"design-system/components/button/guidance","weight":0,"markup":"","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/buttons","parentReference":"components"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/components/choice/index.html b/docs/components/choice/index.html
index 2e5d8ebb06..4837fa24db 100644
--- a/docs/components/choice/index.html
+++ b/docs/components/choice/index.html
@@ -2,14 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Checkbox & Radio - CMSgov Design System</title>
+  <title>Checkbox & Radio - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-28656077"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-u-fill--warn ds-u-color--base" data-reactid="12">prototype</span><h1 class="ds-display" id="components.choice" data-reactid="13">Checkbox & Radio</h1><div class="ds-u-clearfix" data-reactid="14"></div><code class="ds-u-font-size--small" data-reactid="15">components/ChoiceList/Choice.scss</code><p data-reactid="16"><a href="https://standards.usa.gov/components/form-controls" data-reactid="17">US Web Design Standard</a></p></heading><div data-reactid="18"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="19"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="20">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="21">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="22"><article class="ds-u-margin-y--6 l-content" data-reactid="23"></article><article class="ds-u-margin-y--6 l-content" data-reactid="24"><div data-reactid="25"><h1 class="ds-h1" id="components.choice.checkbox" data-reactid="26">Checkbox</h1><code class="ds-u-font-size--small" data-reactid="27">components/ChoiceList/Choice.scss</code></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="28"><p>Checkboxes allow users to select one or more options from a visible list.</p></div><section class="ds-u-margin-top--3" data-reactid="29"><div class="markup markup--html" data-reactid="30"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="31"><fieldset class="ds-c-fieldset ds-u-margin-top--0">
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1903651089"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-c-badge--success" data-reactid="10">recommended</span><h1 class="ds-display" id="components.choice" data-reactid="11">Checkbox & Radio</h1><div class="ds-u-clearfix" data-reactid="12"></div><code class="ds-u-font-size--small" data-reactid="13">components/ChoiceList/Choice.scss</code><p data-reactid="14"><a href="https://standards.usa.gov/components/form-controls" data-reactid="15">US Web Design Standard</a></p></heading><div data-reactid="16"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="17"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="18">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="19">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="20"><article class="ds-u-margin-y--6 l-content" data-reactid="21"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="22"><p>Checkboxes allow users to select one or more options from a visible list, whereas radio buttons allow a user to select only one option.</p></div><section class="ds-u-margin-top--3" data-reactid="23"><div class="markup markup--html" data-reactid="24"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="25"><fieldset class="ds-c-fieldset ds-u-margin-top--0">
   <legend class="ds-c-label">Historical figures</legend>
   <span class="ds-c-field__hint">Select all that apply</span>
   <input class="ds-c-choice" id="truth-1" type="checkbox" name="historical-figures-1" value="truth" checked>
@@ -21,9 +21,19 @@
   <input class="ds-c-choice" id="carver-1" type="checkbox" name="historical-figures-1" disabled>
   <label for="carver-1">George Washington Carver</label>
 </fieldset>
+<fieldset class="ds-c-fieldset">
+  <legend class="ds-c-label">Select a historical figure</legend>
+  <input class="ds-c-choice" id="truth-3" type="radio" name="historical-figures-3" value="truth" checked>
+  <label for="truth-3">Sojourner Truth</label>
+  <input class="ds-c-choice" id="douglass-3" type="radio" name="historical-figures-3" value="douglass">
+  <label for="douglass-3">Frederick Douglass</label>
+  <input class="ds-c-choice" id="washington-3" type="radio" name="historical-figures-3" value="washington">
+  <label for="washington-3">Booker T. Washington</label>
+</fieldset>
 <div class="ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2">
   <fieldset class="ds-c-fieldset ds-u-margin-top--0">
-    <legend class="ds-c-label">Select a historical figure</legend>
+    <legend class="ds-c-label">Historical figures</legend>
+    <span class="ds-c-field__hint ds-c-field__hint--inverse">Select all that apply</span>
     <input class="ds-c-choice ds-c-choice--inverse" id="truth-2" type="checkbox" name="historical-figures-2" value="truth" checked>
     <label for="truth-2">Sojourner Truth</label>
     <input class="ds-c-choice ds-c-choice--inverse" id="douglass-2" type="checkbox" name="historical-figures-2" value="douglass">
@@ -33,7 +43,16 @@
     <input class="ds-c-choice ds-c-choice--inverse" id="carver-2" type="checkbox" name="historical-figures-2" disabled>
     <label for="carver-2">George Washington Carver</label>
   </fieldset>
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="32"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="33">Code snippet</summary><pre class="language-markup" data-reactid="34"><code data-reactid="35"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>fieldset</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-fieldset ds-u-margin-top--0<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+  <fieldset class="ds-c-fieldset">
+    <legend class="ds-c-label">Select a historical figure</legend>
+    <input class="ds-c-choice ds-c-choice--inverse" id="truth-4" type="radio" name="historical-figures-4" value="truth" checked>
+    <label for="truth-4">Sojourner Truth</label>
+    <input class="ds-c-choice ds-c-choice--inverse" id="douglass-4" type="radio" name="historical-figures-4" value="douglass">
+    <label for="douglass-4">Frederick Douglass</label>
+    <input class="ds-c-choice ds-c-choice--inverse" id="washington-4" type="radio" name="historical-figures-4" value="washington">
+    <label for="washington-4">Booker T. Washington</label>
+  </fieldset>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="26"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="27">Code snippet</summary><pre class="language-markup" data-reactid="28"><code data-reactid="29"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>fieldset</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-fieldset ds-u-margin-top--0<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>legend</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Historical figures<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>legend</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field__hint<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Select all that apply<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-choice<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth-1<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>checkbox<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>historical-figures-1<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth<span class="token punctuation">"</span></span> <span class="token attr-name">checked</span><span class="token punctuation">></span></span>
@@ -45,9 +64,19 @@
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-choice<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>carver-1<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>checkbox<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>historical-figures-1<span class="token punctuation">"</span></span> <span class="token attr-name">disabled</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>carver-1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>George Washington Carver<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>fieldset</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>fieldset</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-fieldset<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>legend</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Select a historical figure<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>legend</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-choice<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth-3<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>radio<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>historical-figures-3<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth<span class="token punctuation">"</span></span> <span class="token attr-name">checked</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth-3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Sojourner Truth<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-choice<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>douglass-3<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>radio<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>historical-figures-3<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>douglass<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>douglass-3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Frederick Douglass<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-choice<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>washington-3<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>radio<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>historical-figures-3<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>washington<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>washington-3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Booker T. Washington<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>fieldset</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>fieldset</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-fieldset ds-u-margin-top--0<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
-    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>legend</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Select a historical figure<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>legend</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>legend</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Historical figures<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>legend</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field__hint ds-c-field__hint--inverse<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Select all that apply<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-choice ds-c-choice--inverse<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth-2<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>checkbox<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>historical-figures-2<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth<span class="token punctuation">"</span></span> <span class="token attr-name">checked</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth-2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Sojourner Truth<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-choice ds-c-choice--inverse<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>douglass-2<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>checkbox<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>historical-figures-2<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>douglass<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
@@ -57,36 +86,7 @@
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-choice ds-c-choice--inverse<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>carver-2<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>checkbox<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>historical-figures-2<span class="token punctuation">"</span></span> <span class="token attr-name">disabled</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>carver-2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>George Washington Carver<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>fieldset</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="36"><div data-reactid="37"><h1 class="ds-h1" id="components.choice.radio" data-reactid="38">Radio option</h1><code class="ds-u-font-size--small" data-reactid="39">components/ChoiceList/Choice.scss</code></div><section class="ds-u-margin-top--3" data-reactid="40"><div class="markup markup--html" data-reactid="41"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="42"><fieldset class="ds-c-fieldset ds-u-margin-top--0">
-  <legend class="ds-c-label">Select a historical figure</legend>
-  <input class="ds-c-choice" id="truth-3" type="radio" name="historical-figures-3" value="truth" checked>
-  <label for="truth-3">Sojourner Truth</label>
-  <input class="ds-c-choice" id="douglass-3" type="radio" name="historical-figures-3" value="douglass">
-  <label for="douglass-3">Frederick Douglass</label>
-  <input class="ds-c-choice" id="washington-3" type="radio" name="historical-figures-3" value="washington">
-  <label for="washington-3">Booker T. Washington</label>
-</fieldset>
-<div class="ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2">
-  <fieldset class="ds-c-fieldset ds-u-margin-top--0">
-    <legend class="ds-c-label">Select a historical figure</legend>
-    <input class="ds-c-choice ds-c-choice--inverse" id="truth-4" type="radio" name="historical-figures-4" value="truth" checked>
-    <label for="truth-4">Sojourner Truth</label>
-    <input class="ds-c-choice ds-c-choice--inverse" id="douglass-4" type="radio" name="historical-figures-4" value="douglass">
-    <label for="douglass-4">Frederick Douglass</label>
-    <input class="ds-c-choice ds-c-choice--inverse" id="washington-4" type="radio" name="historical-figures-4" value="washington">
-    <label for="washington-4">Booker T. Washington</label>
-  </fieldset>
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="43"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="44">Code snippet</summary><pre class="language-markup" data-reactid="45"><code data-reactid="46"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>fieldset</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-fieldset ds-u-margin-top--0<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>legend</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Select a historical figure<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>legend</span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-choice<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth-3<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>radio<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>historical-figures-3<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth<span class="token punctuation">"</span></span> <span class="token attr-name">checked</span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth-3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Sojourner Truth<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-choice<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>douglass-3<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>radio<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>historical-figures-3<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>douglass<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>douglass-3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Frederick Douglass<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-choice<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>washington-3<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>radio<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>historical-figures-3<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>washington<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>washington-3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Booker T. Washington<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>fieldset</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>fieldset</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-fieldset ds-u-margin-top--0<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>fieldset</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-fieldset<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>legend</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Select a historical figure<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>legend</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-choice ds-c-choice--inverse<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth-4<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>radio<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>historical-figures-4<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth<span class="token punctuation">"</span></span> <span class="token attr-name">checked</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>truth-4<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Sojourner Truth<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
@@ -95,11 +95,11 @@
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-choice ds-c-choice--inverse<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>washington-4<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>radio<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>historical-figures-4<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>washington<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>washington-4<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Booker T. Washington<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>fieldset</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="47"><div data-reactid="48"><h1 class="ds-h1" id="components.choice.react" data-reactid="49">React - <code>&#x3C;Choice&#x3E;</code></h1><code class="ds-u-font-size--small" data-reactid="50">components/ChoiceList/Choice</code></div><section data-reactid="51"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="52"><p>A <code>Choice</code> component can be used to render a checkbox or radio button.
-Any <em>undocumented</em> props that you pass to this component will be passed
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="30"><div data-reactid="31"><h2 class="ds-h2" id="components.choice.react" data-reactid="32"><code>&#x3C;Choice&#x3E;</code></h2><code class="ds-u-font-size--small" data-reactid="33">components/ChoiceList/Choice.jsx</code></div><section data-reactid="34"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="35"><p>A <code>Choice</code> component can be used to render a checkbox or radio button.</p>
+<p>Any <em>undocumented</em> props that you pass to this component will be passed
 to the <code>input</code> element, so you can use this to set additional attributes if
 necessary.</p>
-</div><div class="markup markup--react" data-reactid="53"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="54"><div data-reactid="55"><div data-reactid="56"><input type="checkbox" class="ds-c-choice" id="checkbox_checkbox_choice_1" name="checkbox_choice" value="a" checked="" data-reactid="57"/><label for="checkbox_checkbox_choice_1" data-reactid="58">Checkbox A</label></div><div data-reactid="59"><input type="checkbox" class="ds-c-choice" id="checkbox_checkbox_choice_2" name="checkbox_choice" value="b" data-reactid="60"/><label for="checkbox_checkbox_choice_2" data-reactid="61">Checkbox B</label></div><div data-reactid="62"><input type="checkbox" class="ds-c-choice" id="checkbox_checkbox_choice_3" disabled="" name="checkbox_choice" value="c" data-reactid="63"/><label for="checkbox_checkbox_choice_3" data-reactid="64">Checkbox B</label></div><div data-reactid="65"><input type="radio" class="ds-c-choice" id="radio_radio_choice_4" name="radio_choice" value="a" checked="" data-reactid="66"/><label for="radio_radio_choice_4" data-reactid="67">Radio A</label></div><div data-reactid="68"><input type="radio" class="ds-c-choice" id="radio_radio_choice_5" name="radio_choice" value="b" data-reactid="69"/><label for="radio_radio_choice_5" data-reactid="70">Radio B</label></div></div></div><details class="ds-u-margin-bottom--2" data-reactid="71"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="72">Code snippet</summary><pre class="language-jsx" data-reactid="73"><code data-reactid="74"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">></span></span>
+</div><div class="markup markup--react" data-reactid="36"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="37"><div data-reactid="38"><div data-reactid="39"><input type="checkbox" class="ds-c-choice" id="checkbox_checkbox_choice_1" name="checkbox_choice" value="a" checked="" data-reactid="40"/><label for="checkbox_checkbox_choice_1" data-reactid="41">Checkbox A</label></div><div data-reactid="42"><input type="checkbox" class="ds-c-choice" id="checkbox_checkbox_choice_2" name="checkbox_choice" value="b" data-reactid="43"/><label for="checkbox_checkbox_choice_2" data-reactid="44">Checkbox B</label></div><div data-reactid="45"><input type="checkbox" class="ds-c-choice" id="checkbox_checkbox_choice_3" disabled="" name="checkbox_choice" value="c" data-reactid="46"/><label for="checkbox_checkbox_choice_3" data-reactid="47">Checkbox B</label></div><div data-reactid="48"><input type="radio" class="ds-c-choice" id="radio_radio_choice_4" name="radio_choice" value="a" checked="" data-reactid="49"/><label for="radio_radio_choice_4" data-reactid="50">Radio A</label></div><div data-reactid="51"><input type="radio" class="ds-c-choice" id="radio_radio_choice_5" name="radio_choice" value="b" data-reactid="52"/><label for="radio_radio_choice_5" data-reactid="53">Radio B</label></div></div></div><details class="ds-u-margin-bottom--2" data-reactid="54"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="55">Code snippet</summary><pre class="language-jsx" data-reactid="56"><code data-reactid="57"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Choice</span>
     <span class="token attr-name">defaultChecked</span>
     <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>checkbox_choice<span class="token punctuation">"</span></span>
@@ -135,25 +135,25 @@
   <span class="token punctuation">></span></span>
     Radio B
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>Choice</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="75">Props</h3><table class="ds-c-table" data-reactid="76"><thead data-reactid="77"><tr data-reactid="78"><td data-reactid="79">Name</td><td data-reactid="80">Type</td><td data-reactid="81">Default</td><td data-reactid="82">Description</td></tr></thead><tbody data-reactid="83"><tr data-reactid="84"><td data-reactid="85"><code class="ds-u-font-weight--bold" data-reactid="86">checked</code></td><td data-reactid="87"><code data-reactid="88">bool</code></td><td data-reactid="89"></td><td data-reactid="90"><div data-reactid="91"><p>Setting this prop will render a read-only field and require an <code>onChange</code>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="58">Props</h3><table class="ds-c-table" data-reactid="59"><thead data-reactid="60"><tr data-reactid="61"><td data-reactid="62">Name</td><td data-reactid="63">Type</td><td data-reactid="64">Default</td><td data-reactid="65">Description</td></tr></thead><tbody data-reactid="66"><tr data-reactid="67"><td data-reactid="68"><code class="ds-u-font-weight--bold" data-reactid="69">checked</code></td><td data-reactid="70"><code data-reactid="71">bool</code></td><td data-reactid="72"></td><td data-reactid="73"><div data-reactid="74"><p>Setting this prop will render a read-only field and require an <code>onChange</code>
 event handler if you&#39;d want to check its checked stated. Use <code>defaultChecked</code>
 if you want the field to be mutable.</p>
-</div></td></tr><tr data-reactid="92"><td data-reactid="93"><code class="ds-u-font-weight--bold" data-reactid="94">className</code></td><td data-reactid="95"><code data-reactid="96">string</code></td><td data-reactid="97"></td><td data-reactid="98"><div data-reactid="99"><p>Additional classes to be added to the root <code>div</code> element.</p>
-</div></td></tr><tr data-reactid="100"><td data-reactid="101"><code class="ds-u-font-weight--bold" data-reactid="102">defaultChecked</code></td><td data-reactid="103"><code data-reactid="104">bool</code></td><td data-reactid="105"></td><td data-reactid="106"><div data-reactid="107"><p>Sets the initial checked state and allows the user to check/uncheck the
+</div></td></tr><tr data-reactid="75"><td data-reactid="76"><code class="ds-u-font-weight--bold" data-reactid="77">className</code></td><td data-reactid="78"><code data-reactid="79">string</code></td><td data-reactid="80"></td><td data-reactid="81"><div data-reactid="82"><p>Additional classes to be added to the root <code>div</code> element.</p>
+</div></td></tr><tr data-reactid="83"><td data-reactid="84"><code class="ds-u-font-weight--bold" data-reactid="85">defaultChecked</code></td><td data-reactid="86"><code data-reactid="87">bool</code></td><td data-reactid="88"></td><td data-reactid="89"><div data-reactid="90"><p>Sets the initial checked state and allows the user to check/uncheck the
 field without also requiring an <code>onChange</code> event handler.</p>
-</div></td></tr><tr data-reactid="108"><td data-reactid="109"><code class="ds-u-font-weight--bold" data-reactid="110">id</code></td><td data-reactid="111"><code data-reactid="112">string</code></td><td data-reactid="113"></td><td data-reactid="114"><div data-reactid="115"><p>A unique ID to be used for the input field, as well as the label&#39;s
+</div></td></tr><tr data-reactid="91"><td data-reactid="92"><code class="ds-u-font-weight--bold" data-reactid="93">id</code></td><td data-reactid="94"><code data-reactid="95">string</code></td><td data-reactid="96"></td><td data-reactid="97"><div data-reactid="98"><p>A unique ID to be used for the input field, as well as the label&#39;s
 <code>for</code> attribute. A unique ID will be generated if one isn&#39;t provided.</p>
-</div></td></tr><tr data-reactid="116"><td data-reactid="117"><code class="ds-u-font-weight--bold" data-reactid="118">inversed</code></td><td data-reactid="119"><code data-reactid="120">bool</code></td><td data-reactid="121"></td><td data-reactid="122"><div data-reactid="123"><p>Applies the &quot;inverse&quot; UI theme</p>
-</div></td></tr><tr data-reactid="124"><td data-reactid="125"><code class="ds-u-font-weight--bold" data-reactid="126">name</code><p data-reactid="127"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="128">Required</span></p></td><td data-reactid="129"><code data-reactid="130">string</code></td><td data-reactid="131"></td><td data-reactid="132"><div data-reactid="133"><p>The <code>input</code> <code>name</code> attribute</p>
-</div></td></tr><tr data-reactid="134"><td data-reactid="135"><code class="ds-u-font-weight--bold" data-reactid="136">onBlur</code></td><td data-reactid="137"><code data-reactid="138">func</code></td><td data-reactid="139"></td><td data-reactid="140"></td></tr><tr data-reactid="141"><td data-reactid="142"><code class="ds-u-font-weight--bold" data-reactid="143">onChange</code></td><td data-reactid="144"><code data-reactid="145">func</code></td><td data-reactid="146"></td><td data-reactid="147"></td></tr><tr data-reactid="148"><td data-reactid="149"><code class="ds-u-font-weight--bold" data-reactid="150">type</code></td><td data-reactid="151"><code data-reactid="152">&#x27;checkbox&#x27;, &#x27;radio&#x27;</code></td><td data-reactid="153"><code data-reactid="154">&#x27;checkbox&#x27;</code></td><td data-reactid="155"></td></tr><tr data-reactid="156"><td data-reactid="157"><code class="ds-u-font-weight--bold" data-reactid="158">value</code><p data-reactid="159"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="160">Required</span></p></td><td data-reactid="161"><code data-reactid="162">number, string</code></td><td data-reactid="163"></td><td data-reactid="164"><div data-reactid="165"><p>The <code>input</code> <code>value</code> attribute</p>
-</div></td></tr></tbody></table></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="166"><div data-reactid="167"><h1 class="ds-h1" id="components.choice.choicelist-react" data-reactid="168">React - <code>&#x3C;ChoiceList&#x3E;</code></h1><code class="ds-u-font-size--small" data-reactid="169">components/ChoiceList/ChoiceList</code></div><section data-reactid="170"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="171"><p>A <code>ChoiceList</code> component can be used to render a <code>select</code> menu, radio
-button group, or checkbox group, and their corresponding <code>label</code> or <code>legend</code>.</p>
+</div></td></tr><tr data-reactid="99"><td data-reactid="100"><code class="ds-u-font-weight--bold" data-reactid="101">inversed</code></td><td data-reactid="102"><code data-reactid="103">bool</code></td><td data-reactid="104"></td><td data-reactid="105"><div data-reactid="106"><p>Applies the &quot;inverse&quot; UI theme</p>
+</div></td></tr><tr data-reactid="107"><td data-reactid="108"><code class="ds-u-font-weight--bold" data-reactid="109">name</code><p data-reactid="110"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="111">Required</span></p></td><td data-reactid="112"><code data-reactid="113">string</code></td><td data-reactid="114"></td><td data-reactid="115"><div data-reactid="116"><p>The <code>input</code> <code>name</code> attribute</p>
+</div></td></tr><tr data-reactid="117"><td data-reactid="118"><code class="ds-u-font-weight--bold" data-reactid="119">onBlur</code></td><td data-reactid="120"><code data-reactid="121">func</code></td><td data-reactid="122"></td><td data-reactid="123"></td></tr><tr data-reactid="124"><td data-reactid="125"><code class="ds-u-font-weight--bold" data-reactid="126">onChange</code></td><td data-reactid="127"><code data-reactid="128">func</code></td><td data-reactid="129"></td><td data-reactid="130"></td></tr><tr data-reactid="131"><td data-reactid="132"><code class="ds-u-font-weight--bold" data-reactid="133">type</code></td><td data-reactid="134"><code data-reactid="135">&#x27;checkbox&#x27;, &#x27;radio&#x27;</code></td><td data-reactid="136"><code data-reactid="137">&#x27;checkbox&#x27;</code></td><td data-reactid="138"></td></tr><tr data-reactid="139"><td data-reactid="140"><code class="ds-u-font-weight--bold" data-reactid="141">value</code><p data-reactid="142"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="143">Required</span></p></td><td data-reactid="144"><code data-reactid="145">number, string</code></td><td data-reactid="146"></td><td data-reactid="147"><div data-reactid="148"><p>The <code>input</code> <code>value</code> attribute</p>
+</div></td></tr></tbody></table></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="149"><div data-reactid="150"><h2 class="ds-h2" id="components.choice.choicelist-react" data-reactid="151"><code>&#x3C;ChoiceList&#x3E;</code></h2><code class="ds-u-font-size--small" data-reactid="152">components/ChoiceList/ChoiceList.jsx</code></div><section data-reactid="153"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="154"><p>A <code>ChoiceList</code> component can be used to render a <code>select</code> menu, radio
+button group, or checkbox group.</p>
 <p>You can manually pass in the <code>type</code> prop, but the real power of this component
 is unleashed when you let it determine the type of fields for you. It takes
 into account accessibility and usability best practices, so you can pass in
-an array of choices and let it determine whether the choices should be
-presented as radio buttons, checkboxes, or a <code>select</code> menu.</p>
-</div><div class="markup markup--react" data-reactid="172"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="173"><div data-reactid="174"><fieldset class="ds-c-fieldset ds-u-margin-top--0" data-reactid="175"><legend class="ds-c-label" data-reactid="176"><span data-reactid="177">Radio example</span></legend><div data-reactid="178"><input type="radio" class="ds-c-choice" id="radio_choices_field_6" value="1" name="choices_field" data-reactid="179"/><label for="radio_choices_field_6" data-reactid="180">Choice 1</label></div><div data-reactid="181"><input type="radio" class="ds-c-choice" id="radio_choices_field_7" value="2" checked="" name="choices_field" data-reactid="182"/><label for="radio_choices_field_7" data-reactid="183">Choice 2</label></div><div data-reactid="184"><input type="radio" class="ds-c-choice" id="radio_choices_field_8" value="3" disabled="" name="choices_field" data-reactid="185"/><label for="radio_choices_field_8" data-reactid="186">Choice 3</label></div><div data-reactid="187"><input type="radio" class="ds-c-choice" id="radio_choices_field_9" value="4" name="choices_field" data-reactid="188"/><label for="radio_choices_field_9" data-reactid="189">Choice 4</label></div></fieldset><fieldset class="ds-c-fieldset" data-reactid="190"><legend class="ds-c-label" data-reactid="191"><span class="ds-u-font-weight--bold" data-reactid="192">Checkbox example</span><span class="ds-c-field__hint ds-u-color--error" id="undefined-message" role="alert" data-reactid="193">Example error message</span></legend><div data-reactid="194"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_10" value="1" name="multiple_choices_field" data-reactid="195"/><label for="checkbox_multiple_choices_field_10" data-reactid="196">Choice 1</label></div><div data-reactid="197"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_11" value="2" checked="" name="multiple_choices_field" data-reactid="198"/><label for="checkbox_multiple_choices_field_11" data-reactid="199">Choice 2</label></div><div data-reactid="200"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_12" value="3" disabled="" name="multiple_choices_field" data-reactid="201"/><label for="checkbox_multiple_choices_field_12" data-reactid="202">Choice 3</label></div><div data-reactid="203"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_13" value="4" name="multiple_choices_field" data-reactid="204"/><label for="checkbox_multiple_choices_field_13" data-reactid="205">Choice 4</label></div></fieldset><div data-reactid="206"><label class="ds-c-label" for="select_select_choices_field_14" data-reactid="207"><span data-reactid="208">Select example</span><span class="ds-c-field__hint" data-reactid="209">Example hint text</span></label><select class="ds-c-field ds-c-field--select" id="select_select_choices_field_14" name="select_choices_field" data-reactid="210"><option value="1" data-reactid="211">Choice 1</option><option selected="" value="2" data-reactid="212">Choice 2</option><option value="3" data-reactid="213">Choice 3</option><option value="4" data-reactid="214">Choice 4</option><option value="5" data-reactid="215">Choice 5</option><option value="6" data-reactid="216">Choice 6</option><option value="7" data-reactid="217">Choice 7</option><option value="8" data-reactid="218">Choice 8</option></select></div><div class="ds-base--inverse ds-u-margin-top--4 ds-u-padding--1" data-reactid="219"><div data-reactid="220"><label class="ds-c-label ds-u-margin-top--0" for="select_select_choices_field_inverse_15" data-reactid="221"><span data-reactid="222">Select example</span><span class="ds-c-field__hint ds-c-field__hint--inverse" data-reactid="223">Example hint text</span></label><select class="ds-c-field ds-c-field--select ds-c-field--inverse" id="select_select_choices_field_inverse_15" name="select_choices_field_inverse" data-reactid="224"><option value="1" data-reactid="225">Choice 1</option><option selected="" value="2" data-reactid="226">Choice 2</option><option value="3" data-reactid="227">Choice 3</option><option value="4" data-reactid="228">Choice 4</option><option value="5" data-reactid="229">Choice 5</option><option value="6" data-reactid="230">Choice 6</option><option value="7" data-reactid="231">Choice 7</option><option value="8" data-reactid="232">Choice 8</option></select></div></div></div></div><details class="ds-u-margin-bottom--2" data-reactid="233"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="234">Code snippet</summary><pre class="language-jsx" data-reactid="235"><code data-reactid="236"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">></span></span>
+an array of choices and let it determine what type of field would be best for
+the user.</p>
+</div><div class="markup markup--react" data-reactid="155"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="156"><div data-reactid="157"><fieldset class="ds-c-fieldset ds-u-margin-top--0" data-reactid="158"><legend class="ds-c-label" data-reactid="159"><span data-reactid="160">Radio example</span></legend><div data-reactid="161"><input type="radio" class="ds-c-choice" id="radio_choices_field_6" value="1" name="choices_field" data-reactid="162"/><label for="radio_choices_field_6" data-reactid="163">Choice 1</label></div><div data-reactid="164"><input type="radio" class="ds-c-choice" id="radio_choices_field_7" value="2" checked="" name="choices_field" data-reactid="165"/><label for="radio_choices_field_7" data-reactid="166">Choice 2</label></div><div data-reactid="167"><input type="radio" class="ds-c-choice" id="radio_choices_field_8" value="3" disabled="" name="choices_field" data-reactid="168"/><label for="radio_choices_field_8" data-reactid="169">Choice 3</label></div><div data-reactid="170"><input type="radio" class="ds-c-choice" id="radio_choices_field_9" value="4" name="choices_field" data-reactid="171"/><label for="radio_choices_field_9" data-reactid="172">Choice 4</label></div></fieldset><fieldset class="ds-c-fieldset" data-reactid="173"><legend class="ds-c-label" data-reactid="174"><span class="ds-u-font-weight--bold" data-reactid="175">Checkbox example</span><span class="ds-c-field__hint ds-u-color--error" id="undefined-message" role="alert" data-reactid="176">Example error message</span></legend><div data-reactid="177"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_10" value="1" name="multiple_choices_field" data-reactid="178"/><label for="checkbox_multiple_choices_field_10" data-reactid="179">Choice 1</label></div><div data-reactid="180"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_11" value="2" checked="" name="multiple_choices_field" data-reactid="181"/><label for="checkbox_multiple_choices_field_11" data-reactid="182">Choice 2</label></div><div data-reactid="183"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_12" value="3" disabled="" name="multiple_choices_field" data-reactid="184"/><label for="checkbox_multiple_choices_field_12" data-reactid="185">Choice 3</label></div><div data-reactid="186"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_13" value="4" name="multiple_choices_field" data-reactid="187"/><label for="checkbox_multiple_choices_field_13" data-reactid="188">Choice 4</label></div></fieldset><div data-reactid="189"><label class="ds-c-label" for="select_select_choices_field_14" data-reactid="190"><span data-reactid="191">Select example</span><span class="ds-c-field__hint" data-reactid="192">Example hint text</span></label><select class="ds-c-field ds-c-field--select" id="select_select_choices_field_14" name="select_choices_field" data-reactid="193"><option value="1" data-reactid="194">Choice 1</option><option selected="" value="2" data-reactid="195">Choice 2</option><option value="3" data-reactid="196">Choice 3</option><option value="4" data-reactid="197">Choice 4</option><option value="5" data-reactid="198">Choice 5</option><option value="6" data-reactid="199">Choice 6</option><option value="7" data-reactid="200">Choice 7</option><option value="8" data-reactid="201">Choice 8</option></select></div><div class="ds-base--inverse ds-u-margin-top--4 ds-u-padding--1" data-reactid="202"><div data-reactid="203"><label class="ds-c-label ds-u-margin-top--0" for="select_select_choices_field_inverse_15" data-reactid="204"><span data-reactid="205">Select example</span><span class="ds-c-field__hint ds-c-field__hint--inverse" data-reactid="206">Example hint text</span></label><select class="ds-c-field ds-c-field--select ds-c-field--inverse" id="select_select_choices_field_inverse_15" name="select_choices_field_inverse" data-reactid="207"><option value="1" data-reactid="208">Choice 1</option><option selected="" value="2" data-reactid="209">Choice 2</option><option value="3" data-reactid="210">Choice 3</option><option value="4" data-reactid="211">Choice 4</option><option value="5" data-reactid="212">Choice 5</option><option value="6" data-reactid="213">Choice 6</option><option value="7" data-reactid="214">Choice 7</option><option value="8" data-reactid="215">Choice 8</option></select></div></div></div></div><details class="ds-u-margin-bottom--2" data-reactid="216"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="217">Code snippet</summary><pre class="language-jsx" data-reactid="218"><code data-reactid="219"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ChoiceList</span>
     <span class="token attr-name">choices</span><span class="token script language-javascript"><span class="token punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">[</span>
       <span class="token punctuation">{</span>
@@ -289,70 +289,77 @@
       <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>select_choices_field_inverse<span class="token punctuation">"</span></span>
     <span class="token punctuation">/></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="237">Props</h3><table class="ds-c-table" data-reactid="238"><thead data-reactid="239"><tr data-reactid="240"><td data-reactid="241">Name</td><td data-reactid="242">Type</td><td data-reactid="243">Default</td><td data-reactid="244">Description</td></tr></thead><tbody data-reactid="245"><tr data-reactid="246"><td data-reactid="247"><code class="ds-u-font-weight--bold" data-reactid="248">choices</code><p data-reactid="249"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="250">Required</span></p></td><td data-reactid="251"><code data-reactid="252">arrayOf[{checked, defaultChecked, disabled, label, value}]</code></td><td data-reactid="253"></td><td data-reactid="254"><div data-reactid="255"><p>The list of choices to be rendered. The number of choices you pass in may
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="220">Props</h3><table class="ds-c-table" data-reactid="221"><thead data-reactid="222"><tr data-reactid="223"><td data-reactid="224">Name</td><td data-reactid="225">Type</td><td data-reactid="226">Default</td><td data-reactid="227">Description</td></tr></thead><tbody data-reactid="228"><tr data-reactid="229"><td data-reactid="230"><code class="ds-u-font-weight--bold" data-reactid="231">choices</code><p data-reactid="232"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="233">Required</span></p></td><td data-reactid="234"><code data-reactid="235">arrayOf[{checked, defaultChecked, disabled, label, value}]</code></td><td data-reactid="236"></td><td data-reactid="237"><div data-reactid="238"><p>The list of choices to be rendered. The number of choices you pass in may
 affect the type of field(s) rendered. See <code>type</code> for more info.</p>
-</div></td></tr><tr data-reactid="256"><td data-reactid="257"><code class="ds-u-font-weight--bold" data-reactid="258">className</code></td><td data-reactid="259"><code data-reactid="260">string</code></td><td data-reactid="261"></td><td data-reactid="262"><div data-reactid="263"><p>Additional classes to be added to the root element.</p>
-</div></td></tr><tr data-reactid="264"><td data-reactid="265"><code class="ds-u-font-weight--bold" data-reactid="266">disabled</code></td><td data-reactid="267"><code data-reactid="268">bool</code></td><td data-reactid="269"></td><td data-reactid="270"><div data-reactid="271"><p>Disables the entire field.</p>
-</div></td></tr><tr data-reactid="272"><td data-reactid="273"><code class="ds-u-font-weight--bold" data-reactid="274">errorMessage</code></td><td data-reactid="275"><code data-reactid="276">string</code></td><td data-reactid="277"></td><td data-reactid="278"></td></tr><tr data-reactid="279"><td data-reactid="280"><code class="ds-u-font-weight--bold" data-reactid="281">hint</code></td><td data-reactid="282"><code data-reactid="283">node</code></td><td data-reactid="284"></td><td data-reactid="285"><div data-reactid="286"><p>Hint text</p>
-</div></td></tr><tr data-reactid="287"><td data-reactid="288"><code class="ds-u-font-weight--bold" data-reactid="289">inversed</code></td><td data-reactid="290"><code data-reactid="291">bool</code></td><td data-reactid="292"></td><td data-reactid="293"><div data-reactid="294"><p>Applies the &quot;inverse&quot; UI theme</p>
-</div></td></tr><tr data-reactid="295"><td data-reactid="296"><code class="ds-u-font-weight--bold" data-reactid="297">label</code><p data-reactid="298"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="299">Required</span></p></td><td data-reactid="300"><code data-reactid="301">node</code></td><td data-reactid="302"></td><td data-reactid="303"><div data-reactid="304"><p>The label for the entire list of choices</p>
-</div></td></tr><tr data-reactid="305"><td data-reactid="306"><code class="ds-u-font-weight--bold" data-reactid="307">labelClassName</code></td><td data-reactid="308"><code data-reactid="309">string</code></td><td data-reactid="310"></td><td data-reactid="311"><div data-reactid="312"><p>Additional classes to be added to the <code>FormLabel</code>.</p>
-</div></td></tr><tr data-reactid="313"><td data-reactid="314"><code class="ds-u-font-weight--bold" data-reactid="315">multiple</code></td><td data-reactid="316"><code data-reactid="317">bool</code></td><td data-reactid="318"></td><td data-reactid="319"><div data-reactid="320"><p>Allows the user to select multiple choices. Setting this to <code>true</code> results
+</div></td></tr><tr data-reactid="239"><td data-reactid="240"><code class="ds-u-font-weight--bold" data-reactid="241">className</code></td><td data-reactid="242"><code data-reactid="243">string</code></td><td data-reactid="244"></td><td data-reactid="245"><div data-reactid="246"><p>Additional classes to be added to the root element.</p>
+</div></td></tr><tr data-reactid="247"><td data-reactid="248"><code class="ds-u-font-weight--bold" data-reactid="249">disabled</code></td><td data-reactid="250"><code data-reactid="251">bool</code></td><td data-reactid="252"></td><td data-reactid="253"><div data-reactid="254"><p>Disables the entire field.</p>
+</div></td></tr><tr data-reactid="255"><td data-reactid="256"><code class="ds-u-font-weight--bold" data-reactid="257">errorMessage</code></td><td data-reactid="258"><code data-reactid="259">string</code></td><td data-reactid="260"></td><td data-reactid="261"></td></tr><tr data-reactid="262"><td data-reactid="263"><code class="ds-u-font-weight--bold" data-reactid="264">hint</code></td><td data-reactid="265"><code data-reactid="266">node</code></td><td data-reactid="267"></td><td data-reactid="268"><div data-reactid="269"><p>Hint text</p>
+</div></td></tr><tr data-reactid="270"><td data-reactid="271"><code class="ds-u-font-weight--bold" data-reactid="272">inversed</code></td><td data-reactid="273"><code data-reactid="274">bool</code></td><td data-reactid="275"></td><td data-reactid="276"><div data-reactid="277"><p>Applies the &quot;inverse&quot; UI theme</p>
+</div></td></tr><tr data-reactid="278"><td data-reactid="279"><code class="ds-u-font-weight--bold" data-reactid="280">label</code><p data-reactid="281"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="282">Required</span></p></td><td data-reactid="283"><code data-reactid="284">node</code></td><td data-reactid="285"></td><td data-reactid="286"><div data-reactid="287"><p>The label for the entire list of choices</p>
+</div></td></tr><tr data-reactid="288"><td data-reactid="289"><code class="ds-u-font-weight--bold" data-reactid="290">labelClassName</code></td><td data-reactid="291"><code data-reactid="292">string</code></td><td data-reactid="293"></td><td data-reactid="294"><div data-reactid="295"><p>Additional classes to be added to the <code>FormLabel</code>.</p>
+</div></td></tr><tr data-reactid="296"><td data-reactid="297"><code class="ds-u-font-weight--bold" data-reactid="298">multiple</code></td><td data-reactid="299"><code data-reactid="300">bool</code></td><td data-reactid="301"></td><td data-reactid="302"><div data-reactid="303"><p>Allows the user to select multiple choices. Setting this to <code>true</code> results
 in a list of checkbox fields to be rendered.</p>
-</div></td></tr><tr data-reactid="321"><td data-reactid="322"><code class="ds-u-font-weight--bold" data-reactid="323">name</code><p data-reactid="324"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="325">Required</span></p></td><td data-reactid="326"><code data-reactid="327">string</code></td><td data-reactid="328"></td><td data-reactid="329"></td></tr><tr data-reactid="330"><td data-reactid="331"><code class="ds-u-font-weight--bold" data-reactid="332">onBlur</code></td><td data-reactid="333"><code data-reactid="334">func</code></td><td data-reactid="335"></td><td data-reactid="336"></td></tr><tr data-reactid="337"><td data-reactid="338"><code class="ds-u-font-weight--bold" data-reactid="339">onChange</code></td><td data-reactid="340"><code data-reactid="341">func</code></td><td data-reactid="342"></td><td data-reactid="343"></td></tr><tr data-reactid="344"><td data-reactid="345"><code class="ds-u-font-weight--bold" data-reactid="346">type</code></td><td data-reactid="347"><code data-reactid="348">&#x27;checkbox&#x27;, &#x27;radio&#x27;, &#x27;select&#x27;</code></td><td data-reactid="349"></td><td data-reactid="350"><div data-reactid="351"><p>You can manually set the <code>type</code> if you prefer things to be less magical.
+</div></td></tr><tr data-reactid="304"><td data-reactid="305"><code class="ds-u-font-weight--bold" data-reactid="306">name</code><p data-reactid="307"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="308">Required</span></p></td><td data-reactid="309"><code data-reactid="310">string</code></td><td data-reactid="311"></td><td data-reactid="312"></td></tr><tr data-reactid="313"><td data-reactid="314"><code class="ds-u-font-weight--bold" data-reactid="315">onBlur</code></td><td data-reactid="316"><code data-reactid="317">func</code></td><td data-reactid="318"></td><td data-reactid="319"></td></tr><tr data-reactid="320"><td data-reactid="321"><code class="ds-u-font-weight--bold" data-reactid="322">onChange</code></td><td data-reactid="323"><code data-reactid="324">func</code></td><td data-reactid="325"></td><td data-reactid="326"></td></tr><tr data-reactid="327"><td data-reactid="328"><code class="ds-u-font-weight--bold" data-reactid="329">type</code></td><td data-reactid="330"><code data-reactid="331">&#x27;checkbox&#x27;, &#x27;radio&#x27;, &#x27;select&#x27;</code></td><td data-reactid="332"></td><td data-reactid="333"><div data-reactid="334"><p>You can manually set the <code>type</code> if you prefer things to be less magical.
 Otherwise, the type will be inferred by the other <code>props</code>, based
 on what&#39;s best for accessibility and usability. If <code>multiple</code> is <code>true</code>, then
 <code>checkbox</code> fields will be rendered. If less than 10 choices are passed in,
 then <code>radio</code> buttons will be rendered.</p>
-</div></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="352"><article class="ds-u-margin-y--6 l-content" data-reactid="353"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="354"><h2 id="accessibility">Accessibility</h2>
+</div></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="335"><article class="ds-u-margin-y--6 l-content" data-reactid="336"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="337"><h2 id="when-to-use">When to use</h2>
+<p><strong>Checkboxes</strong></p>
 <ul>
-<li>Surround a related set of choices with a <code>&lt;fieldset&gt;</code>. The <code>&lt;legend&gt;</code> provides context for the grouping. Do not use <code>fieldset</code> and <code>legend</code> for a single check.</li>
-<li>The custom checkboxes and radio buttons here are accessible to screen readers because the default fields are moved off-screen.</li>
-<li>Each input should have a semantic <code>id</code> attribute, and its corresponding <code>label</code> should have the same value in its <code>for</code> attribute.</li>
+<li>When a user can select any number of choices from a set list.</li>
+<li>When a user needs to choose “yes” or “no” on only one option (use a stand-alone checkbox). For example, to toggle a setting on or off.</li>
+<li>When users need to see all the available options at a glance.</li>
+<li>When users should be able to select zero of the options.</li>
+</ul>
+<p><strong>Radio buttons</strong></p>
+<ul>
+<li>When users need to select only one option out of a set of mutually exclusive choices.</li>
 </ul>
-<h2 id="guidelines">Guidelines</h2>
+<h2 id="when-to-consider-alternatives">When to consider alternatives</h2>
 <ul>
+<li>If there are too many options to display on a mobile screen. Consider a <code>select</code> menu if you don’t have enough space to list out all available options, and if the user can only select one of the options.</li>
+<li>Never use radio buttons for optional questions, since once a radio button is selected from a list, it or another choice will remain selected.</li>
+</ul>
+<h2 id="guidance">Guidance</h2>
+<ul>
+<li>Don&#39;t rely on the visual difference between radio buttons and checkboxes. Make it clear with words when users can select one or multiple options.</li>
 <li>Users should be able to tap on or click on either the text label or the checkbox to select or deselect an option.</li>
-<li>List options vertically if possible; horizontal listings can make it difficult to tell which label pertains to which checkbox.</li>
+<li>In general, list choices vertically; horizontal listings can make it difficult to tell which label pertains to which choice. An exception is where you have binary choices with short labels, like &#39;Yes / No&#39;. The convention here is for horizontal alignment.</li>
 <li>Avoid using negative language in labels as they can be counterintuitive. For example, “I want to receive a promotional email” instead of “I don’t want to receive promotional email.”</li>
-<li>If you customize, make sure selections are adequately spaced for touch screens.</li>
-<li>Use caution if you decide to set a default value. Setting a default value can discourage users from making conscious decisions, seem pushy, or alienate users who don’t fit into your assumptions. If you are unsure, leave nothing selected by default.</li>
+<li>Use caution if you decide to set a default value. Setting a default value can discourage users from making conscious decisions, seem pushy, or alienate users who don’t fit into your assumptions. In addition, you&#39;ll never know if the user explicitly chose that option or just didn&#39;t notice the question. If you&#39;re unsure, leave nothing selected by default.</li>
+</ul>
+<p><strong><a href="/design-system/guidelines/forms/">View the &quot;Forms&quot; guidelines for additional guidance and best practices.</a></strong></p>
+<h2 id="accessibility">Accessibility</h2>
+<ul>
+<li>Surround a related set of choices with a <code>&lt;fieldset&gt;</code>. The <code>&lt;legend&gt;</code> provides context for the grouping. Do not use <code>fieldset</code> and <code>legend</code> for a single checkbox.</li>
+<li>Some screen readers read the <code>legend</code> text for each <code>fieldset</code>, so it should be brief and descriptive.</li>
+<li>Each input should have a semantic <code>id</code> attribute, and its corresponding <code>label</code> should have the same value in its <code>for</code> attribute.</li>
+<li>The custom checkboxes and radio buttons here are accessible to screen readers because the default fields are moved off-screen.</li>
 </ul>
 <h2 id="theming">Theming</h2>
-<p>The following Sass variables can be overridden to theme checkbox/radio options:</p>
+<p>The following Sass variables can be overridden to theme choice fields:</p>
 <ul>
 <li><code>$choice-border-width</code></li>
 <li><code>$choice-border-color</code></li>
 <li><code>$choice-border-color-inverse</code></li>
 <li><code>$choice-checked-background-color</code></li>
 </ul>
-<h2 id="checkboxes">Checkboxes</h2>
-<h3 id="when-to-use">When to use</h3>
+<h2 id="related-patterns">Related patterns</h2>
 <ul>
-<li>When a user can select any number of choices from a set list.</li>
-<li>When a user needs to choose “yes” or “no” on only one option (use a stand-alone checkbox). For example, to toggle a setting on or off.</li>
-<li>When users need to see all the available options at a glance.</li>
-</ul>
-<h3 id="when-to-consider-something-different">When to consider something different</h3>
-<ul>
-<li>If there are too many options to display on a mobile screen.</li>
-<li>If a user can only select one option from a list (use <code>radio</code> buttons instead).</li>
-</ul>
-<h2 id="radio-buttons">Radio buttons</h2>
-<ul>
-<li>When users need to select only one option out of a set of mutually exclusive choices.</li>
-<li>When the number of available options can fit onto a mobile screen.</li>
+<li><a href="/design-system/components/select">Select menu</a></li>
 </ul>
-<h3 id="when-to-consider-something-else">When to consider something else</h3>
+<h2 id="learn-more">Learn more</h2>
 <ul>
-<li>Consider checkboxes if users need to select more than one option or if there is only one item to select.</li>
-<li>Consider a dropdown if you don’t have enough space to list out all available options.</li>
-<li>If users should be able to select zero of the options.</li>
+<li><a href="/design-system/guidelines/forms/">Form Guidelines</a></li>
+<li><a href="https://paper.dropbox.com/doc/Radio-buttons-oIwWoxwBKClt5IXvDbnpF">GOV.UK Checkbox/Radio buttons discussion</a></li>
+<li><a href="https://designnotes.blog.gov.uk/2016/11/30/weve-updated-the-radios-and-checkboxes-on-gov-uk/">&quot;We&#39;ve updated the radios and checkboxes on GOV.UK&quot;</a></li>
+<li><a href="http://www.formsthatwork.com/files/Articles/dropdown.pdf">Four steps for choosing form elements on the Web (PDF)</a></li>
 </ul></div></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Checkbox & Radio","description":"","reference":"components.choice","referenceNumber":"3.4","referenceURI":"design-system/components/choice","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Checkbox","description":"<p>Checkboxes allow users to select one or more options from a visible list.</p>","reference":"components.choice.checkbox","referenceNumber":"3.4.1","referenceURI":"design-system/components/choice/checkbox","weight":0,"markup":"<fieldset class=\"ds-c-fieldset ds-u-margin-top--0\">\n  <legend class=\"ds-c-label\">Historical figures</legend>\n  <span class=\"ds-c-field__hint\">Select all that apply</span>\n  <input class=\"ds-c-choice\" id=\"truth-1\" type=\"checkbox\" name=\"historical-figures-1\" value=\"truth\" checked>\n  <label for=\"truth-1\">Sojourner Truth</label>\n  <input class=\"ds-c-choice\" id=\"douglass-1\" type=\"checkbox\" name=\"historical-figures-1\" value=\"douglass\">\n  <label for=\"douglass-1\">Frederick Douglass</label>\n  <input class=\"ds-c-choice\" id=\"washington-1\" type=\"checkbox\" name=\"historical-figures-1\" value=\"washington\">\n  <label for=\"washington-1\">Booker T. Washington</label>\n  <input class=\"ds-c-choice\" id=\"carver-1\" type=\"checkbox\" name=\"historical-figures-1\" disabled>\n  <label for=\"carver-1\">George Washington Carver</label>\n</fieldset>\n<div class=\"ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2\">\n  <fieldset class=\"ds-c-fieldset ds-u-margin-top--0\">\n    <legend class=\"ds-c-label\">Select a historical figure</legend>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"truth-2\" type=\"checkbox\" name=\"historical-figures-2\" value=\"truth\" checked>\n    <label for=\"truth-2\">Sojourner Truth</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"douglass-2\" type=\"checkbox\" name=\"historical-figures-2\" value=\"douglass\">\n    <label for=\"douglass-2\">Frederick Douglass</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"washington-2\" type=\"checkbox\" name=\"historical-figures-2\" value=\"washington\">\n    <label for=\"washington-2\">Booker T. Washington</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"carver-2\" type=\"checkbox\" name=\"historical-figures-2\" disabled>\n    <label for=\"carver-2\">George Washington Carver</label>\n  </fieldset>\n</div>","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.choice"},{"header":"Radio option","description":"","reference":"components.choice.radio","referenceNumber":"3.4.4","referenceURI":"design-system/components/choice/radio","weight":0,"markup":"<fieldset class=\"ds-c-fieldset ds-u-margin-top--0\">\n  <legend class=\"ds-c-label\">Select a historical figure</legend>\n  <input class=\"ds-c-choice\" id=\"truth-3\" type=\"radio\" name=\"historical-figures-3\" value=\"truth\" checked>\n  <label for=\"truth-3\">Sojourner Truth</label>\n  <input class=\"ds-c-choice\" id=\"douglass-3\" type=\"radio\" name=\"historical-figures-3\" value=\"douglass\">\n  <label for=\"douglass-3\">Frederick Douglass</label>\n  <input class=\"ds-c-choice\" id=\"washington-3\" type=\"radio\" name=\"historical-figures-3\" value=\"washington\">\n  <label for=\"washington-3\">Booker T. Washington</label>\n</fieldset>\n<div class=\"ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2\">\n  <fieldset class=\"ds-c-fieldset ds-u-margin-top--0\">\n    <legend class=\"ds-c-label\">Select a historical figure</legend>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"truth-4\" type=\"radio\" name=\"historical-figures-4\" value=\"truth\" checked>\n    <label for=\"truth-4\">Sojourner Truth</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"douglass-4\" type=\"radio\" name=\"historical-figures-4\" value=\"douglass\">\n    <label for=\"douglass-4\">Frederick Douglass</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"washington-4\" type=\"radio\" name=\"historical-figures-4\" value=\"washington\">\n    <label for=\"washington-4\">Booker T. Washington</label>\n  </fieldset>\n</div>","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.choice"},{"header":"React - <code>&#x3C;Choice&#x3E;</code>","description":"","reference":"components.choice.react","referenceNumber":"3.4.5","referenceURI":"design-system/components/choice/react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Choice","parentReference":"components.choice"},{"header":"React - <code>&#x3C;ChoiceList&#x3E;</code>","description":"","reference":"components.choice.choicelist-react","referenceNumber":"3.4.2","referenceURI":"design-system/components/choice/choicelist-react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"ChoiceList","parentReference":"components.choice"},{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Surround a related set of choices with a <code>&lt;fieldset&gt;</code>. The <code>&lt;legend&gt;</code> provides context for the grouping. Do not use <code>fieldset</code> and <code>legend</code> for a single check.</li>\n<li>The custom checkboxes and radio buttons here are accessible to screen readers because the default fields are moved off-screen.</li>\n<li>Each input should have a semantic <code>id</code> attribute, and its corresponding <code>label</code> should have the same value in its <code>for</code> attribute.</li>\n</ul>\n<h2 id=\"guidelines\">Guidelines</h2>\n<ul>\n<li>Users should be able to tap on or click on either the text label or the checkbox to select or deselect an option.</li>\n<li>List options vertically if possible; horizontal listings can make it difficult to tell which label pertains to which checkbox.</li>\n<li>Avoid using negative language in labels as they can be counterintuitive. For example, “I want to receive a promotional email” instead of “I don’t want to receive promotional email.”</li>\n<li>If you customize, make sure selections are adequately spaced for touch screens.</li>\n<li>Use caution if you decide to set a default value. Setting a default value can discourage users from making conscious decisions, seem pushy, or alienate users who don’t fit into your assumptions. If you are unsure, leave nothing selected by default.</li>\n</ul>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme checkbox/radio options:</p>\n<ul>\n<li><code>$choice-border-width</code></li>\n<li><code>$choice-border-color</code></li>\n<li><code>$choice-border-color-inverse</code></li>\n<li><code>$choice-checked-background-color</code></li>\n</ul>\n<h2 id=\"checkboxes\">Checkboxes</h2>\n<h3 id=\"when-to-use\">When to use</h3>\n<ul>\n<li>When a user can select any number of choices from a set list.</li>\n<li>When a user needs to choose “yes” or “no” on only one option (use a stand-alone checkbox). For example, to toggle a setting on or off.</li>\n<li>When users need to see all the available options at a glance.</li>\n</ul>\n<h3 id=\"when-to-consider-something-different\">When to consider something different</h3>\n<ul>\n<li>If there are too many options to display on a mobile screen.</li>\n<li>If a user can only select one option from a list (use <code>radio</code> buttons instead).</li>\n</ul>\n<h2 id=\"radio-buttons\">Radio buttons</h2>\n<ul>\n<li>When users need to select only one option out of a set of mutually exclusive choices.</li>\n<li>When the number of available options can fit onto a mobile screen.</li>\n</ul>\n<h3 id=\"when-to-consider-something-else\">When to consider something else</h3>\n<ul>\n<li>Consider checkboxes if users need to select more than one option or if there is only one item to select.</li>\n<li>Consider a dropdown if you don’t have enough space to list out all available options.</li>\n<li>If users should be able to select zero of the options.</li>\n</ul>","reference":"components.choice.guidance","referenceNumber":"3.4.3","referenceURI":"design-system/components/choice/guidance","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.choice"}],"status":"prototype","uswdsUrl":"https://standards.usa.gov/components/form-controls","parentReference":"components"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Checkbox & Radio","description":"<p>Checkboxes allow users to select one or more options from a visible list, whereas radio buttons allow a user to select only one option.</p>","reference":"components.choice","referenceNumber":"3.4","referenceURI":"design-system/components/choice","weight":0,"markup":"<fieldset class=\"ds-c-fieldset ds-u-margin-top--0\">\n  <legend class=\"ds-c-label\">Historical figures</legend>\n  <span class=\"ds-c-field__hint\">Select all that apply</span>\n  <input class=\"ds-c-choice\" id=\"truth-1\" type=\"checkbox\" name=\"historical-figures-1\" value=\"truth\" checked>\n  <label for=\"truth-1\">Sojourner Truth</label>\n  <input class=\"ds-c-choice\" id=\"douglass-1\" type=\"checkbox\" name=\"historical-figures-1\" value=\"douglass\">\n  <label for=\"douglass-1\">Frederick Douglass</label>\n  <input class=\"ds-c-choice\" id=\"washington-1\" type=\"checkbox\" name=\"historical-figures-1\" value=\"washington\">\n  <label for=\"washington-1\">Booker T. Washington</label>\n  <input class=\"ds-c-choice\" id=\"carver-1\" type=\"checkbox\" name=\"historical-figures-1\" disabled>\n  <label for=\"carver-1\">George Washington Carver</label>\n</fieldset>\n<fieldset class=\"ds-c-fieldset\">\n  <legend class=\"ds-c-label\">Select a historical figure</legend>\n  <input class=\"ds-c-choice\" id=\"truth-3\" type=\"radio\" name=\"historical-figures-3\" value=\"truth\" checked>\n  <label for=\"truth-3\">Sojourner Truth</label>\n  <input class=\"ds-c-choice\" id=\"douglass-3\" type=\"radio\" name=\"historical-figures-3\" value=\"douglass\">\n  <label for=\"douglass-3\">Frederick Douglass</label>\n  <input class=\"ds-c-choice\" id=\"washington-3\" type=\"radio\" name=\"historical-figures-3\" value=\"washington\">\n  <label for=\"washington-3\">Booker T. Washington</label>\n</fieldset>\n<div class=\"ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2\">\n  <fieldset class=\"ds-c-fieldset ds-u-margin-top--0\">\n    <legend class=\"ds-c-label\">Historical figures</legend>\n    <span class=\"ds-c-field__hint ds-c-field__hint--inverse\">Select all that apply</span>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"truth-2\" type=\"checkbox\" name=\"historical-figures-2\" value=\"truth\" checked>\n    <label for=\"truth-2\">Sojourner Truth</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"douglass-2\" type=\"checkbox\" name=\"historical-figures-2\" value=\"douglass\">\n    <label for=\"douglass-2\">Frederick Douglass</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"washington-2\" type=\"checkbox\" name=\"historical-figures-2\" value=\"washington\">\n    <label for=\"washington-2\">Booker T. Washington</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"carver-2\" type=\"checkbox\" name=\"historical-figures-2\" disabled>\n    <label for=\"carver-2\">George Washington Carver</label>\n  </fieldset>\n  <fieldset class=\"ds-c-fieldset\">\n    <legend class=\"ds-c-label\">Select a historical figure</legend>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"truth-4\" type=\"radio\" name=\"historical-figures-4\" value=\"truth\" checked>\n    <label for=\"truth-4\">Sojourner Truth</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"douglass-4\" type=\"radio\" name=\"historical-figures-4\" value=\"douglass\">\n    <label for=\"douglass-4\">Frederick Douglass</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"washington-4\" type=\"radio\" name=\"historical-figures-4\" value=\"washington\">\n    <label for=\"washington-4\">Booker T. Washington</label>\n  </fieldset>\n</div>","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":2,"modifiers":[],"sections":[{"header":"<code>&#x3C;Choice&#x3E;</code>","description":"","reference":"components.choice.react","referenceNumber":"3.4.3","referenceURI":"design-system/components/choice/react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Choice","parentReference":"components.choice"},{"header":"<code>&#x3C;ChoiceList&#x3E;</code>","description":"","reference":"components.choice.choicelist-react","referenceNumber":"3.4.1","referenceURI":"design-system/components/choice/choicelist-react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"ChoiceList","parentReference":"components.choice"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<p><strong>Checkboxes</strong></p>\n<ul>\n<li>When a user can select any number of choices from a set list.</li>\n<li>When a user needs to choose “yes” or “no” on only one option (use a stand-alone checkbox). For example, to toggle a setting on or off.</li>\n<li>When users need to see all the available options at a glance.</li>\n<li>When users should be able to select zero of the options.</li>\n</ul>\n<p><strong>Radio buttons</strong></p>\n<ul>\n<li>When users need to select only one option out of a set of mutually exclusive choices.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>If there are too many options to display on a mobile screen. Consider a <code>select</code> menu if you don’t have enough space to list out all available options, and if the user can only select one of the options.</li>\n<li>Never use radio buttons for optional questions, since once a radio button is selected from a list, it or another choice will remain selected.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Don&#39;t rely on the visual difference between radio buttons and checkboxes. Make it clear with words when users can select one or multiple options.</li>\n<li>Users should be able to tap on or click on either the text label or the checkbox to select or deselect an option.</li>\n<li>In general, list choices vertically; horizontal listings can make it difficult to tell which label pertains to which choice. An exception is where you have binary choices with short labels, like &#39;Yes / No&#39;. The convention here is for horizontal alignment.</li>\n<li>Avoid using negative language in labels as they can be counterintuitive. For example, “I want to receive a promotional email” instead of “I don’t want to receive promotional email.”</li>\n<li>Use caution if you decide to set a default value. Setting a default value can discourage users from making conscious decisions, seem pushy, or alienate users who don’t fit into your assumptions. In addition, you&#39;ll never know if the user explicitly chose that option or just didn&#39;t notice the question. If you&#39;re unsure, leave nothing selected by default.</li>\n</ul>\n<p><strong><a href=\"/design-system/guidelines/forms/\">View the &quot;Forms&quot; guidelines for additional guidance and best practices.</a></strong></p>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Surround a related set of choices with a <code>&lt;fieldset&gt;</code>. The <code>&lt;legend&gt;</code> provides context for the grouping. Do not use <code>fieldset</code> and <code>legend</code> for a single checkbox.</li>\n<li>Some screen readers read the <code>legend</code> text for each <code>fieldset</code>, so it should be brief and descriptive.</li>\n<li>Each input should have a semantic <code>id</code> attribute, and its corresponding <code>label</code> should have the same value in its <code>for</code> attribute.</li>\n<li>The custom checkboxes and radio buttons here are accessible to screen readers because the default fields are moved off-screen.</li>\n</ul>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme choice fields:</p>\n<ul>\n<li><code>$choice-border-width</code></li>\n<li><code>$choice-border-color</code></li>\n<li><code>$choice-border-color-inverse</code></li>\n<li><code>$choice-checked-background-color</code></li>\n</ul>\n<h2 id=\"related-patterns\">Related patterns</h2>\n<ul>\n<li><a href=\"/design-system/components/select\">Select menu</a></li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"/design-system/guidelines/forms/\">Form Guidelines</a></li>\n<li><a href=\"https://paper.dropbox.com/doc/Radio-buttons-oIwWoxwBKClt5IXvDbnpF\">GOV.UK Checkbox/Radio buttons discussion</a></li>\n<li><a href=\"https://designnotes.blog.gov.uk/2016/11/30/weve-updated-the-radios-and-checkboxes-on-gov-uk/\">&quot;We&#39;ve updated the radios and checkboxes on GOV.UK&quot;</a></li>\n<li><a href=\"http://www.formsthatwork.com/files/Articles/dropdown.pdf\">Four steps for choosing form elements on the Web (PDF)</a></li>\n</ul>","reference":"components.choice.guidance","referenceNumber":"3.4.2","referenceURI":"design-system/components/choice/guidance","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.choice"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/form-controls","parentReference":"components"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/components/index.html b/docs/components/index.html
index f2934212d0..97190327d8 100644
--- a/docs/components/index.html
+++ b/docs/components/index.html
@@ -2,19 +2,19 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Components - CMSgov Design System</title>
+  <title>Components - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-352915776"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="components" data-reactid="12">Components</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">components/_index.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>Component class names follow the format: <code>ds-c-[BLOCK]__[ELEMENT]--[MODIFIER]</code></p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1093819808"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="components" data-reactid="10">Components</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">components/_index.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>Component class names follow the format: <code>ds-c-[BLOCK]__[ELEMENT]--[MODIFIER]</code></p>
 <p>Components are designed, self-contained UI elements. In most cases a component will also have a corresponding React component.</p></div></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Components","description":"<p>Component class names follow the format: <code>ds-c-[BLOCK]__[ELEMENT]--[MODIFIER]</code></p>\n<p>Components are designed, self-contained UI elements. In most cases a component will also have a corresponding React component.</p>","reference":"components","referenceNumber":"3","referenceURI":"design-system/components","weight":30,"markup":"","source":{"filename":"components/_index.scss","path":"packages/core/src/components/_index.scss"},"depth":1,"modifiers":[],"sections":[{"header":"Alert","description":"<p>Alerts keep users informed of important and sometimes time-sensitive changes.</p>","reference":"components.alert","referenceNumber":"3.1","referenceURI":"design-system/components/alert","weight":0,"markup":"<div class=\"ds-c-alert {{modifier}}\">\n  <div class=\"ds-c-alert__body\">\n    <h3 class=\"ds-c-alert__heading\">Status heading</h3>\n    <p class=\"ds-c-alert__text\">Lorem ipsum dolor sit <a href=\"http://example.com\">link text</a>, consectetur adipiscing elit, sed do eiusmod.</p>\n  </div>\n</div>","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":2,"modifiers":[{"name":".ds-c-alert--error","description":"Error message","className":"ds-c-alert--error"},{"name":".ds-c-alert--warn","description":"Warning message","className":"ds-c-alert--warn"},{"name":".ds-c-alert--success","description":"Success message","className":"ds-c-alert--success"}],"sections":[{"header":"---","description":"<h3 id=\"other-patterns\">Other patterns</h3>","reference":"components.alert.variations","referenceNumber":"3.1.4","referenceURI":"design-system/components/alert/variations","weight":0,"markup":"<div class=\"ds-c-alert\">\n  <div class=\"ds-c-alert__body\">\n    <p class=\"ds-c-alert__text\">{{lorem-l}}</p>\n  </div>\n</div>\n<div class=\"ds-c-alert ds-u-margin-top--2\">\n  <div class=\"ds-c-alert__body\">\n    <p class=\"ds-c-alert__text\">{{lorem-s}}</p>\n  </div>\n</div>\n<div class=\"ds-c-alert ds-u-margin-top--2\">\n  <div class=\"ds-c-alert__body\">\n    <h3 class=\"ds-c-alert__heading\">Status heading</h3>\n    <p class=\"ds-c-alert__text\">{{lorem-m}}</p>\n    <ul class=\"ds-c-list\">\n      <li>Alert list item</li>\n      <li>Alert list item</li>\n    </ul>\n    <a href=\"http://example.com\">Link text</a>\n  </div>\n</div>","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.alert"},{"header":"---","description":"","reference":"components.alert.inverse","referenceNumber":"3.1.2","referenceURI":"design-system/components/alert/inverse","weight":0,"markup":"<div class=\"ds-base--inverse ds-u-padding--2\">\n  <div class=\"ds-c-alert {{modifier}}\">\n    <div class=\"ds-c-alert__body\">\n      <h3 class=\"ds-c-alert__heading\">Status heading</h3>\n      <p class=\"ds-c-alert__text\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod.</p>\n    </div>\n  </div>\n</div>","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.alert"},{"header":"React","description":"","reference":"components.alert.react","referenceNumber":"3.1.3","referenceURI":"design-system/components/alert/react","weight":0,"markup":"","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Alert","parentReference":"components.alert"},{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Use the ARIA <code>role=&quot;alert&quot;</code> to inform assistive technologies of a time-sensitive and important message that is not interactive. If the message is interactive, use the <code>alertdialog</code> role instead.</li>\n<li>Do not visually hide alert messages on the page and then make them visible when they are needed. Users of older assistive technologies may still be able to perceive the alert messages even if they are not currently applicable.</li>\n</ul>\n<h2 id=\"usability\">Usability</h2>\n<h3 id=\"when-to-use\">When to use</h3>\n<ul>\n<li>As a notification that keeps people informed of the status of the system and which may or may not require the user to respond. This includes errors, warnings, and general updates.</li>\n<li>As a validation message that alerts someone that they just did something that needs to be corrected or as confirmation that a task was completed successfully.</li>\n</ul>\n<h3 id=\"when-to-consider-something-else\">When to consider something else</h3>\n<ul>\n<li>On long forms, always include in-line validation in addition to any error messages that appear at the top of the form.</li>\n<li>If an action will result in destroying a user’s work (for example, deleting an application) use a more intrusive pattern, such as a confirmation modal dialogue, to allow the user to confirm that this is what they want.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>When the user is required to do something in response to an alert, let them know what they need to do and make that task as easy as possible. Think about how much context to provide with your message. For example, a notification of a system change may require more contextual information than a validation message. Write the message in concise, human readable language; avoid jargon and computer code.</li>\n<li>Be polite in error messages — don’t place blame on the user.</li>\n<li>Users generally won’t read documentation but will read a message that helps them resolve an error; include some educational material in your error message.</li>\n<li>But don’t overdo it — too many notifications will either overwhelm or annoy the user and are likely to be ignored.</li>\n<li>Allow a user to dismiss a notification wherever appropriate.</li>\n<li>Don’t include notifications that aren’t related to the user’s current goal.</li>\n</ul>","reference":"components.alert.guidance","referenceNumber":"3.1.1","referenceURI":"design-system/components/alert/guidance","weight":0,"markup":"","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.alert"}],"status":"prototype","uswdsUrl":"https://standards.usa.gov/components/alerts","parentReference":"components"},{"header":"Badge","description":"<p>Badges draw attention to new or important content.</p>","reference":"components.badge","referenceNumber":"3.2","referenceURI":"design-system/components/badge","weight":0,"markup":"<span class=\"ds-c-badge\">New</span>\n<span class=\"ds-c-badge ds-u-fill--error\">Due: December 31, 2018</span>","source":{"filename":"components/Badge/Badge.scss","path":"packages/core/src/components/Badge/Badge.scss"},"depth":2,"modifiers":[],"sections":[],"reactComponent":"Badge","status":"prototype","parentReference":"components"},{"header":"Button","description":"<p>Use buttons to signal actions.</p>","reference":"components.button","referenceNumber":"3.3","referenceURI":"design-system/components/button","weight":0,"markup":"<a href=\"http://example.com\" class=\"ds-c-button {{modifier}}\">Link</a>\n<button type=\"button\" class=\"ds-c-button {{modifier}} ds-c-button--small\">Button</button>\n<button type=\"button\" class=\"ds-c-button {{modifier}}\">Button</button>\n<button type=\"button\" class=\"ds-c-button {{modifier}} ds-c-button--big\">Button</button>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":2,"modifiers":[{"name":".ds-c-button--primary","description":"The primary call-to-action","className":"ds-c-button--primary"},{"name":".ds-c-button--transparent","description":"A button closer to resembling an anchor element","className":"ds-c-button--transparent"},{"name":".ds-c-button--danger","description":"Indicates an action is destructive or dangerous","className":"ds-c-button--danger"},{"name":".ds-c-button--success","description":"Indicates a positive or successful action","className":"ds-c-button--success"}],"sections":[{"header":"---","description":"<h3 id=\"disabled-button\">Disabled button</h3>","reference":"components.button.disabled","referenceNumber":"3.3.1","referenceURI":"design-system/components/button/disabled","weight":0,"markup":"<button class=\"ds-c-button ds-c-button--disabled\">Button</button>\n<input disabled type=\"submit\" class=\"ds-c-button\" />","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"---","description":"<h3 id=\"inverse-theme\">Inverse theme</h3>","reference":"components.button.inverse","referenceNumber":"3.3.5","referenceURI":"design-system/components/button/inverse","weight":0,"markup":"<div class=\"ds-base--inverse ds-u-padding--2\">\n  <button class=\"ds-c-button ds-c-button--inverse\">Button</button>\n  <button class=\"ds-c-button ds-c-button--transparent-inverse\">Button</button>\n  <button class=\"ds-c-button ds-c-button--primary\">Button</button>\n  <button class=\"ds-c-button ds-c-button--danger\">Button</button>\n  <button class=\"ds-c-button ds-c-button--success\">Button</button>\n  <button class=\"ds-c-button ds-c-button--disabled-inverse\">Button</button>\n</div>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"Button icons","description":"<ul>\n<li>Add an inline SVG icon and it will become the same color as the button text. For the crispest icon rendering, ensure the icon has a square <code>viewBox</code> with values that are multiples of <code>8</code> (ie. <code>24x24</code>).</li>\n<li>Use the margin utility class to add spacing between the icon and button text.</li>\n</ul>","reference":"components.button.icons","referenceNumber":"3.3.3","referenceURI":"design-system/components/button/icons","weight":0,"markup":"<button class=\"ds-c-button\">\n  <svg class=\"ds-u-margin-right--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n    <use xlink:href=\"/design-system/public/images/symbols.svg#download\"></use>\n  </svg>Left icon\n</button>\n<button class=\"ds-c-button ds-c-button--primary\">\n  Right icon<svg class=\"ds-u-margin-left--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n    <use xlink:href=\"/design-system/public/images/symbols.svg#arrow-right\"></use>\n  </svg>\n</button>\n<button class=\"ds-c-button ds-c-button--outline\">\n  No icon\n</button>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"Button inline with field","description":"<p>The button is the same height as a single-line text field.</p>","reference":"components.button.inline-field","referenceNumber":"3.3.4","referenceURI":"design-system/components/button/inline-field","weight":0,"markup":"<input type=\"text\" class=\"ds-c-field ds-u-display--inline-block\" />\n<button class=\"ds-c-button\">Submit</button>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"React","description":"","reference":"components.button.react","referenceNumber":"3.3.6","referenceURI":"design-system/components/button/react","weight":0,"markup":"","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Button","parentReference":"components.button"},{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Buttons should display a visible focus state when users tab to them.</li>\n<li>Avoid using <code>&lt;div&gt;</code> or <code>&lt;img&gt;</code> tags to create buttons. Screen readers don&#39;t automatically know either is a usable button.</li>\n<li>When styling links to look like buttons, remember that screen readers handle links slightly differently than they do buttons. Pressing the Space key triggers a button, but pressing the Enter key triggers a link.</li>\n</ul>\n<h2 id=\"usability\">Usability</h2>\n<h3 id=\"when-to-use\">When to use</h3>\n<ul>\n<li>Use buttons for the most important actions you want users to take on your site, such as &quot;download,&quot; &quot;sign up,&quot; or &quot;log out.&quot;</li>\n</ul>\n<h3 id=\"when-to-consider-something-else\">When to consider something else</h3>\n<ul>\n<li>If you want to lead users between pages of a website. Use links instead.</li>\n<li>Less popular or less important actions may be visually styled as links.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Generally, use primary buttons for actions that go to the next step and use secondary buttons for actions that happen on the current page.</li>\n<li>Style the button most users should click in a way that distinguishes from other buttons on the page. Try using the “large button” or the most visually distinct fill color.</li>\n<li>Make sure buttons look clickable—use color variations to distinguish static, hover and active states.</li>\n<li>Avoid using too many buttons on a page.</li>\n<li>Use sentence case for button labels.</li>\n<li>Button labels should be as short as possible with “trigger words” that your users will recognize to clearly explain what will happen when the button is clicked (for example, “download,” “view” or “sign up”).</li>\n<li>Make the first word of the button’s label a verb. For example, instead of “Complaint Filing”, label the button “File a complaint.”</li>\n<li>At times, consider adding an icon to signal specific actions (“download”, “open in a new window”, etc).</li>\n</ul>","reference":"components.button.guidance","referenceNumber":"3.3.2","referenceURI":"design-system/components/button/guidance","weight":0,"markup":"","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"}],"status":"prototype","parentReference":"components"},{"header":"Checkbox & Radio","description":"","reference":"components.choice","referenceNumber":"3.4","referenceURI":"design-system/components/choice","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Checkbox","description":"<p>Checkboxes allow users to select one or more options from a visible list.</p>","reference":"components.choice.checkbox","referenceNumber":"3.4.1","referenceURI":"design-system/components/choice/checkbox","weight":0,"markup":"<fieldset class=\"ds-c-fieldset ds-u-margin-top--0\">\n  <legend class=\"ds-c-label\">Historical figures</legend>\n  <span class=\"ds-c-field__hint\">Select all that apply</span>\n  <input class=\"ds-c-choice\" id=\"truth-1\" type=\"checkbox\" name=\"historical-figures-1\" value=\"truth\" checked>\n  <label for=\"truth-1\">Sojourner Truth</label>\n  <input class=\"ds-c-choice\" id=\"douglass-1\" type=\"checkbox\" name=\"historical-figures-1\" value=\"douglass\">\n  <label for=\"douglass-1\">Frederick Douglass</label>\n  <input class=\"ds-c-choice\" id=\"washington-1\" type=\"checkbox\" name=\"historical-figures-1\" value=\"washington\">\n  <label for=\"washington-1\">Booker T. Washington</label>\n  <input class=\"ds-c-choice\" id=\"carver-1\" type=\"checkbox\" name=\"historical-figures-1\" disabled>\n  <label for=\"carver-1\">George Washington Carver</label>\n</fieldset>\n<div class=\"ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2\">\n  <fieldset class=\"ds-c-fieldset ds-u-margin-top--0\">\n    <legend class=\"ds-c-label\">Select a historical figure</legend>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"truth-2\" type=\"checkbox\" name=\"historical-figures-2\" value=\"truth\" checked>\n    <label for=\"truth-2\">Sojourner Truth</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"douglass-2\" type=\"checkbox\" name=\"historical-figures-2\" value=\"douglass\">\n    <label for=\"douglass-2\">Frederick Douglass</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"washington-2\" type=\"checkbox\" name=\"historical-figures-2\" value=\"washington\">\n    <label for=\"washington-2\">Booker T. Washington</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"carver-2\" type=\"checkbox\" name=\"historical-figures-2\" disabled>\n    <label for=\"carver-2\">George Washington Carver</label>\n  </fieldset>\n</div>","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.choice"},{"header":"Radio option","description":"","reference":"components.choice.radio","referenceNumber":"3.4.4","referenceURI":"design-system/components/choice/radio","weight":0,"markup":"<fieldset class=\"ds-c-fieldset ds-u-margin-top--0\">\n  <legend class=\"ds-c-label\">Select a historical figure</legend>\n  <input class=\"ds-c-choice\" id=\"truth-3\" type=\"radio\" name=\"historical-figures-3\" value=\"truth\" checked>\n  <label for=\"truth-3\">Sojourner Truth</label>\n  <input class=\"ds-c-choice\" id=\"douglass-3\" type=\"radio\" name=\"historical-figures-3\" value=\"douglass\">\n  <label for=\"douglass-3\">Frederick Douglass</label>\n  <input class=\"ds-c-choice\" id=\"washington-3\" type=\"radio\" name=\"historical-figures-3\" value=\"washington\">\n  <label for=\"washington-3\">Booker T. Washington</label>\n</fieldset>\n<div class=\"ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2\">\n  <fieldset class=\"ds-c-fieldset ds-u-margin-top--0\">\n    <legend class=\"ds-c-label\">Select a historical figure</legend>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"truth-4\" type=\"radio\" name=\"historical-figures-4\" value=\"truth\" checked>\n    <label for=\"truth-4\">Sojourner Truth</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"douglass-4\" type=\"radio\" name=\"historical-figures-4\" value=\"douglass\">\n    <label for=\"douglass-4\">Frederick Douglass</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"washington-4\" type=\"radio\" name=\"historical-figures-4\" value=\"washington\">\n    <label for=\"washington-4\">Booker T. Washington</label>\n  </fieldset>\n</div>","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.choice"},{"header":"React - <code>&#x3C;Choice&#x3E;</code>","description":"","reference":"components.choice.react","referenceNumber":"3.4.5","referenceURI":"design-system/components/choice/react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Choice","parentReference":"components.choice"},{"header":"React - <code>&#x3C;ChoiceList&#x3E;</code>","description":"","reference":"components.choice.choicelist-react","referenceNumber":"3.4.2","referenceURI":"design-system/components/choice/choicelist-react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"ChoiceList","parentReference":"components.choice"},{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Surround a related set of choices with a <code>&lt;fieldset&gt;</code>. The <code>&lt;legend&gt;</code> provides context for the grouping. Do not use <code>fieldset</code> and <code>legend</code> for a single check.</li>\n<li>The custom checkboxes and radio buttons here are accessible to screen readers because the default fields are moved off-screen.</li>\n<li>Each input should have a semantic <code>id</code> attribute, and its corresponding <code>label</code> should have the same value in its <code>for</code> attribute.</li>\n</ul>\n<h2 id=\"guidelines\">Guidelines</h2>\n<ul>\n<li>Users should be able to tap on or click on either the text label or the checkbox to select or deselect an option.</li>\n<li>List options vertically if possible; horizontal listings can make it difficult to tell which label pertains to which checkbox.</li>\n<li>Avoid using negative language in labels as they can be counterintuitive. For example, “I want to receive a promotional email” instead of “I don’t want to receive promotional email.”</li>\n<li>If you customize, make sure selections are adequately spaced for touch screens.</li>\n<li>Use caution if you decide to set a default value. Setting a default value can discourage users from making conscious decisions, seem pushy, or alienate users who don’t fit into your assumptions. If you are unsure, leave nothing selected by default.</li>\n</ul>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme checkbox/radio options:</p>\n<ul>\n<li><code>$choice-border-width</code></li>\n<li><code>$choice-border-color</code></li>\n<li><code>$choice-border-color-inverse</code></li>\n<li><code>$choice-checked-background-color</code></li>\n</ul>\n<h2 id=\"checkboxes\">Checkboxes</h2>\n<h3 id=\"when-to-use\">When to use</h3>\n<ul>\n<li>When a user can select any number of choices from a set list.</li>\n<li>When a user needs to choose “yes” or “no” on only one option (use a stand-alone checkbox). For example, to toggle a setting on or off.</li>\n<li>When users need to see all the available options at a glance.</li>\n</ul>\n<h3 id=\"when-to-consider-something-different\">When to consider something different</h3>\n<ul>\n<li>If there are too many options to display on a mobile screen.</li>\n<li>If a user can only select one option from a list (use <code>radio</code> buttons instead).</li>\n</ul>\n<h2 id=\"radio-buttons\">Radio buttons</h2>\n<ul>\n<li>When users need to select only one option out of a set of mutually exclusive choices.</li>\n<li>When the number of available options can fit onto a mobile screen.</li>\n</ul>\n<h3 id=\"when-to-consider-something-else\">When to consider something else</h3>\n<ul>\n<li>Consider checkboxes if users need to select more than one option or if there is only one item to select.</li>\n<li>Consider a dropdown if you don’t have enough space to list out all available options.</li>\n<li>If users should be able to select zero of the options.</li>\n</ul>","reference":"components.choice.guidance","referenceNumber":"3.4.3","referenceURI":"design-system/components/choice/guidance","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.choice"}],"status":"prototype","uswdsUrl":"https://standards.usa.gov/components/form-controls","parentReference":"components"},{"header":"List","description":"","reference":"components.list","referenceNumber":"3.5","referenceURI":"design-system/components/list","weight":0,"markup":"<ul class=\"ds-c-list {{modifier}}\">\n  <li>List item 1</li>\n  <li>List item 2</li>\n</ul>","source":{"filename":"components/List/List.scss","path":"packages/core/src/components/List/List.scss"},"depth":2,"modifiers":[{"name":".ds-c-list--bare","description":"Unstyled list (no <code>margin</code>, <code>padding</code> or <code>list-style</code>)","className":"ds-c-list--bare"}],"sections":[],"status":"prototype","parentReference":"components"},{"header":"Select","description":"<p>A select field allows users to select one option from a list.</p>","reference":"components.select","referenceNumber":"3.6","referenceURI":"design-system/components/select","weight":0,"markup":"<label class=\"ds-c-label ds-u-margin-top--0\" for=\"options\">Field label</label>\n<select class=\"ds-c-field ds-c-field--select\" name=\"options\" id=\"options\">\n  <option value=\"value1\">Option A</option>\n  <option value=\"value2\">Option B</option>\n  <option value=\"value3\">Option C</option>\n</select>\n<div class=\"ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2\">\n  <label class=\"ds-c-label ds-u-margin-top--0\" for=\"options-inverse\">Field label</label>\n  <select class=\"ds-c-field ds-c-field--select ds-c-field--inverse\" name=\"options-inverse\" id=\"options-inverse\">\n    <option value=\"value1\">Option A</option>\n    <option value=\"value2\">Option B</option>\n    <option value=\"value3\">Option C</option>\n  </select>\n</div>","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":2,"modifiers":[],"sections":[{"header":"React - <code>&#x3C;Select&#x3E;</code>","description":"","reference":"components.select.react","referenceNumber":"3.6.3","referenceURI":"design-system/components/select/react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Select","parentReference":"components.select"},{"header":"React - <code>&#x3C;ChoiceList&#x3E;</code>","description":"","reference":"components.select.choicelist-react","referenceNumber":"3.6.1","referenceURI":"design-system/components/select/choicelist-react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"ChoiceList","parentReference":"components.select"},{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Make sure your dropdown has a label. Don’t replace it with the default menu option (for example, removing the “State” label and just having the dropdown read “Select a state” by default).</li>\n<li>Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Auto-submission disrupts screen readers because they select each option as they read them.</li>\n</ul>\n<h2 id=\"usability\">Usability</h2>\n<h3 id=\"when-to-use\">When to use</h3>\n<ul>\n<li>Use sparingly — only when a user needs to choose from about seven to 15 possible options and you have limited space to display the options.</li>\n</ul>\n<h3 id=\"when-to-consider-something-else\">When to consider something else</h3>\n<ul>\n<li>If the list of options is very short. Use radio buttons instead.</li>\n<li>If the list of options is very long. Let users type the same information into a text input that suggests possible options instead.</li>\n<li>If you need to allow users to select more than one option at once. Users often don’t understand how to select multiple items from dropdowns. Use checkboxes instead.</li>\n</ul>\n<h3 id=\"guidance\">Guidance</h3>\n<ul>\n<li>Test dropdowns thoroughly with members of your target audience. Several usability experts suggest they should be the “UI of last resort.” Many users find them confusing and difficult to use.</li>\n<li>Avoid making options in one dropdown menu change based on the input to another. Users often don’t understand how selecting an item in one impacts another.</li>\n<li>When most users will (or should) pick a particular option, make it the default: <code>&lt;option selected=&quot;selected&quot;&gt;Default&lt;/option&gt;</code></li>\n<li>Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Offer a “submit” button at the end of the form instead. Users often change their choices multiple times. Auto-submission is also less accessible.</li>\n</ul>","reference":"components.select.guidance","referenceNumber":"3.6.2","referenceURI":"design-system/components/select/guidance","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.select"}],"status":"prototype","uswdsUrl":"https://standards.usa.gov/components/form-controls/#dropdown","parentReference":"components"},{"header":"Table","description":"","reference":"components.table","referenceNumber":"3.7","referenceURI":"design-system/components/table","weight":0,"markup":"<table class=\"ds-c-table {{modifier}}\">\n  <thead>\n    <tr>\n      <th>Name</th>\n      <th>Favorite fruit</th>\n    </tr>\n  </thead>\n  <tbody>\n    <tr>\n      <td>Fred</td>\n      <td>Apples</td>\n    </tr>\n  </tbody>\n</table>","source":{"filename":"components/Table/Table.scss","path":"packages/core/src/components/Table/Table.scss"},"depth":2,"modifiers":[{"name":".ds-c-table--borderless","description":"Borderless table","className":"ds-c-table--borderless"}],"sections":[],"status":"prototype","parentReference":"components"},{"header":"Tabs","description":"<p>Tabs can be used as a navigation pattern, allowing a user to switch between panels of related content within the same context.</p>","reference":"components.tabs","referenceNumber":"3.8","referenceURI":"design-system/components/tabs","weight":0,"markup":"<div class=\"ds-c-tabs\" role=\"tablist\" aria-label=\"Settings\">\n  <a\n    class=\"ds-c-tabs__item\"\n    href=\"#panel-profile\"\n    role=\"tab\"\n    aria-selected=\"true\"\n    aria-controls=\"panel-profile\"\n    id=\"tab-profile\"\n  >\n    <svg class=\"ds-u-margin-right--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n      <use xlink:href=\"/design-system/public/images/symbols.svg#placeholder\"></use>\n    </svg>Profile\n  </a>\n  <a\n    class=\"ds-c-tabs__item\"\n    href=\"#panel-comms\"\n    role=\"tab\"\n    aria-selected=\"false\"\n    aria-controls=\"panel-comms\"\n    id=\"tab-comms\"\n  >\n    <svg class=\"ds-u-margin-right--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n      <use xlink:href=\"/design-system/public/images/symbols.svg#placeholder\"></use>\n    </svg>Communication preferences\n  </a>\n</div>\n<div class=\"ds-c-tabs__panel\" id=\"panel-profile\" aria-labelledby=\"tab-profile\" role=\"tabpanel\">\n  Note: This is just an example of the HTML markup. See the React example for\n  a functioning example.\n</div>\n<div class=\"ds-c-tabs__panel\" id=\"panel-comms\" aria-hidden=\"true\" aria-labelledby=\"tab-comms\" aria-selected=\"false\" role=\"tabpanel\">\n  Communication preferences content\n</div>","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":2,"modifiers":[],"sections":[{"header":"<code>&#x3C;Tabs&#x3E;</code>","description":"","reference":"components.tabs.react-tabs","referenceNumber":"3.8.4","referenceURI":"design-system/components/tabs/react-tabs","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Tabs","parentReference":"components.tabs"},{"header":"<code>&#x3C;TabPanel&#x3E;</code>","description":"","reference":"components.tabs.react-tabpanel","referenceNumber":"3.8.3","referenceURI":"design-system/components/tabs/react-tabpanel","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"hideExample":true,"reactComponent":"TabPanel","parentReference":"components.tabs"},{"header":"<code>&#x3C;Tab&#x3E;</code>","description":"","reference":"components.tabs.react-tab","referenceNumber":"3.8.2","referenceURI":"design-system/components/tabs/react-tab","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Tab","parentReference":"components.tabs"},{"header":"Guidelines","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Use an anchor link (<code>a</code>) to create the tabs. This allows you to link directly to a tab, and allows you to progressively enhance the page, retaining default browser behavior like opening links in a new window. Note: You&#39;ll need to implement the logic for selecting the correct tab based on the current URL.</li>\n<li>Ensure the HTML markup includes the proper ARIA attributes:<ul>\n<li>For tabs: <code>role</code>, <code>aria-selected</code>, <code>aria-controls</code></li>\n<li>For the tabs list parent: <code>role</code>, <code>aria-label</code></li>\n<li>For a tab panel: <code>role</code>, <code>aria-labelledby</code></li>\n</ul>\n</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<h3 id=\"responsiveness\">Responsiveness</h3>\n<p>Hiding tabs on small screens is not a user-friendly solution. If the tabs can&#39;t fit on one row on small screens, consider using utility classes to apply additional responsive styles or use a different pattern.</p>\n<h3 id=\"general-guidance\">General guidance</h3>\n<ul>\n<li>The content within tab panels should be related.</li>\n<li>Each Tab label should be descriptive of its content and set the user&#39;s expectations. Labels shoud be no more than two words.</li>\n<li>A maximum of three tabs should be displayed. Consider using a different pattern if your content requries being split into more than three panels.</li>\n</ul>\n<h2 id=\"further-reading\">Further reading</h2>\n<ul>\n<li><a href=\"https://24ways.org/2015/how-tabs-should-work/\">How Tabs Should Work</a></li>\n<li><a href=\"http://heydonworks.com/practical_aria_examples/#tab-interface\">Simple ARIA tab interface</a></li>\n</ul>","reference":"components.tabs.guidance","referenceNumber":"3.8.1","referenceURI":"design-system/components/tabs/guidance","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.tabs"}],"status":"prototype","parentReference":"components"},{"header":"Text field","description":"<p>A text field can be an <code>input</code> or <code>textarea</code> HTML element.</p>","reference":"components.text-field","referenceNumber":"3.9","referenceURI":"design-system/components/text-field","weight":0,"markup":"<label class=\"ds-c-label ds-u-margin-top--0\" for=\"input-firstname\">\n  First name\n  <span class=\"ds-c-field__hint\">Helpful hint text</span>\n</label>\n<input class=\"ds-c-field\" id=\"input-firstname\" name=\"firstname\" type=\"text\">\n<label class=\"ds-c-label\" for=\"input-lastname\">\n  <span class=\"ds-u-font-weight--bold\">Last name</span>\n  <span class=\"ds-c-field__hint ds-u-color--error\" role=\"alert\">\n    Please enter your last name\n  </span>\n  <span class=\"ds-c-field__hint\">Helpful hint text</span>\n</label>\n<input class=\"ds-c-field ds-c-field--error\" id=\"input-lastname\" name=\"lastname\" type=\"text\" />\n<label class=\"ds-c-label\" for=\"input-username\">Username</label>\n<input class=\"ds-c-field ds-c-field--success\" id=\"input-username\" name=\"username\" type=\"text\">\n<label class=\"ds-c-label\" for=\"input-bio\">Bio</label>\n<textarea class=\"ds-c-field\" id=\"input-bio\" name=\"bio\" rows=\"5\"></textarea>","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Inverse theme","description":"","reference":"components.text-field.inverse","referenceNumber":"3.9.2","referenceURI":"design-system/components/text-field/inverse","weight":0,"markup":"<div class=\"ds-base--inverse ds-u-padding--2\">\n  <label class=\"ds-c-label ds-u-margin-top--0\" for=\"input-firstname-2\">\n    First name\n    <span class=\"ds-c-field__hint ds-c-field__hint--inverse\">Helpful hint text</span>\n  </label>\n  <input class=\"ds-c-field ds-c-field--inverse\" id=\"input-firstname-2\" name=\"firstname\" type=\"text\">\n  <label class=\"ds-c-label\" for=\"input-lastname-2\">\n    <span class=\"ds-u-font-weight--bold\">Last name</span>\n    <span class=\"ds-c-field__hint ds-u-color--error-light\" role=\"alert\">\n      Please enter your last name\n    </span>\n    <span class=\"ds-c-field__hint ds-c-field__hint--inverse\">Helpful hint text</span>\n  </label>\n  <input class=\"ds-c-field ds-c-field--inverse ds-c-field--error\" id=\"input-lastname-2\" name=\"lastname\" type=\"text\">\n  <label class=\"ds-c-label\" for=\"input-username-2\">Username</label>\n  <input class=\"ds-c-field ds-c-field--inverse ds-c-field--success\" id=\"input-username-2\" name=\"username\" type=\"text\">\n  <label class=\"ds-c-label\" for=\"input-bio-2\">Bio</label>\n  <textarea class=\"ds-c-field ds-c-field--inverse\" id=\"input-bio-2\" name=\"bio\" rows=\"5\"></textarea>\n</div>","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.text-field"},{"header":"React - <code>&#x3C;TextField&#x3E;</code>","description":"","reference":"components.text-field.react","referenceNumber":"3.9.3","referenceURI":"design-system/components/text-field/react","weight":0,"markup":"","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"TextField","parentReference":"components.text-field"},{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Display form controls in the same order in HTML as they appear on screen. Do not use CSS to rearrange the form controls. Screen readers narrate forms in the order they appear in the HTML.</li>\n<li>Visually align validation messages with the input fields, so people using screen magnifiers can read them quickly.</li>\n<li>Group each set of thematically related controls in a fieldset element. Use the legend element to offer a label within each one. The fieldset and legend elements make it easier for screen reader users to navigate the form.</li>\n<li>Use a single legend for fieldset (this is required). One example of a common use of fieldset and legend is a question with radio button options for answers. The question text and radio buttons are wrapped in a fieldset, with the question itself being inside the legend tag.</li>\n<li>Embed multiple fieldsets and legends for more complex forms.x</li>\n<li>Keep your form blocks in a vertical pattern. This approach is ideal, from an accessibility standpoint, because of limited vision that makes it hard to scan from right to left.</li>\n</ul>\n<h2 id=\"usability\">Usability</h2>\n<h3 id=\"guidance\">Guidance</h3>\n<ul>\n<li>The length of the text input provides a hint to users as to how much text to write. Do not require users to write paragraphs of text into a single-line <code>input</code> box; use a <code>textarea</code> instead.</li>\n<li>Text inputs are among the easiest type of input for desktop users but are more difficult for mobile users.</li>\n<li>Only show error messages or stylings after a user has interacted with a particular field.</li>\n<li>Avoid using placeholder text that appears within a text field before a user starts typing. If placeholder text is no longer visible after a user clicks into the field, users will no longer have that text available when they need to review their entries. (People who have cognitive or visual disabilities have additional problems with placeholder text.)</li>\n</ul>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme a field: <code>$color-focus</code>, <code>$color-focus-inverse</code>, <code>$focus-shadow</code>, <code>$focus-shadow-inverse</code>, <code>$input-border-color</code>, <code>$input-border-color-inverse</code>, <code>$input-border-radius</code>, <code>$input-line-height</code>, <code>$input-border-width</code>, <code>$input-padding</code></p>\n<h2 id=\"further-reading\">Further reading</h2>\n<ul>\n<li><a href=\"https://www.nngroup.com/articles/form-design-placeholders/\">&quot;Placeholders in Form Fields Are Harmful&quot;</a></li>\n</ul>","reference":"components.text-field.guidance","referenceNumber":"3.9.1","referenceURI":"design-system/components/text-field/guidance","weight":0,"markup":"","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.text-field"}],"status":"prototype","uswdsUrl":"https://standards.usa.gov/components/form-controls/#text-input","parentReference":"components"},{"header":"Vertical navigation","description":"","reference":"components.vertical-nav","referenceNumber":"3.10","referenceURI":"design-system/components/vertical-nav","weight":0,"markup":"<ul class=\"ds-c-vertical-nav\">\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link ds-c-vertical-nav__link--current\" href=\"http://example.com\">Current page</a>\n  </li>\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Parent link</a>\n  </li>\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Parent link</a>\n  </li>\n</ul>","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Nested menus","description":"","reference":"components.vertical-nav.nested","referenceNumber":"3.10.2","referenceURI":"design-system/components/vertical-nav/nested","weight":0,"markup":"<ul class=\"ds-c-vertical-nav\">\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Parent link</a>\n  </li>\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link ds-c-vertical-nav__link--current\" href=\"http://example.com\">Current page</a>\n    <ul class=\"ds-c-vertical-nav__subnav\">\n      <li class=\"ds-c-vertical-nav__item\">\n        <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Child link</a>\n      </li>\n      <li class=\"ds-c-vertical-nav__item\">\n        <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Child link</a>\n        <ul class=\"ds-c-vertical-nav__subnav\">\n          <li class=\"ds-c-vertical-nav__item\">\n            <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Grandchild link</a>\n          </li>\n          <li class=\"ds-c-vertical-nav__item\">\n            <a class=\"ds-c-vertical-nav__link ds-c-vertical-nav__link--current\" href=\"http://example.com\">Grandchild link</a>\n          </li>\n        </ul>\n      </li>\n      <li class=\"ds-c-vertical-nav__item\">\n        <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Child link</a>\n      </li>\n    </ul>\n  </li>\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Parent link</a>\n  </li>\n</ul>","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.vertical-nav"},{"header":"React - <code>&#x3C;VerticalNav&#x3E;</code>","description":"","reference":"components.vertical-nav.VerticalNav","referenceNumber":"3.10.3","referenceURI":"design-system/components/vertical-nav/VerticalNav","weight":0,"markup":"","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"VerticalNav","parentReference":"components.vertical-nav"},{"header":"React - <code>&#x3C;VerticalNavItem&#x3E;</code>","description":"","reference":"components.vertical-nav.VerticalNavItem","referenceNumber":"3.10.4","referenceURI":"design-system/components/vertical-nav/VerticalNavItem","weight":0,"markup":"","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"hideExample":true,"reactComponent":"VerticalNavItem","parentReference":"components.vertical-nav"},{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Users should be able to tab through each link.</li>\n<li>If you have nested menus that are collapsible, ensure the toggle button has its <code>aria-controls</code> and <code>aria-expanded</code> attributes set. This is done automatically for you\nif you&#39;re using the React components.</li>\n</ul>\n<h2 id=\"usability\">Usability</h2>\n<h3 id=\"when-to-use\">When to use</h3>\n<ul>\n<li>To display a navigational hierarchy with one to three levels.</li>\n<li>To display the “sub-navigation” within a section of the website.</li>\n</ul>\n<h3 id=\"when-to-consider-something-else\">When to consider something else</h3>\n<ul>\n<li>If the site has fewer than five pages, consider organizing the page without a navigational hierarchy.</li>\n<li>If your page already has a horizontal and vertical navigation bar, consider ways to simplify your navigation system.</li>\n<li>If your content is within a frame or sub-area of a page, consider ways to simplify your navigation system.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Indicate where a user is within the navigational hierarchy. Use the <code>ds-c-vertical-nav__link--current</code> modifier to show users which page they have navigated to.</li>\n<li>Keep the navigation links short. They can be shorter derivatives of page titles themselves.</li>\n<li>If the navigation hierarchy is too long, users may miss items at the bottom. If it’s too deep, users may miss items that require too many clicks. Usability test to find the right balance between breadth and depth.</li>\n</ul>","reference":"components.vertical-nav.guidance","referenceNumber":"3.10.1","referenceURI":"design-system/components/vertical-nav/guidance","weight":0,"markup":"","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.vertical-nav"}],"status":"beta","uswdsUrl":"https://standards.usa.gov/components/sidenav/","parentReference":"components"}],"parentReference":null};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Components","description":"<p>Component class names follow the format: <code>ds-c-[BLOCK]__[ELEMENT]--[MODIFIER]</code></p>\n<p>Components are designed, self-contained UI elements. In most cases a component will also have a corresponding React component.</p>","reference":"components","referenceNumber":"3","referenceURI":"design-system/components","weight":30,"markup":"","source":{"filename":"components/_index.scss","path":"packages/core/src/components/_index.scss"},"depth":1,"modifiers":[],"sections":[{"header":"Alert","description":"<p>Alerts keep users informed of important and sometimes time-sensitive changes.</p>","reference":"components.alert","referenceNumber":"3.1","referenceURI":"design-system/components/alert","weight":0,"markup":"<div class=\"ds-c-alert {{modifier}}\">\n  <div class=\"ds-c-alert__body\">\n    <h3 class=\"ds-c-alert__heading\">Status heading</h3>\n    <p class=\"ds-c-alert__text\">Lorem ipsum dolor sit <a href=\"http://example.com\">link text</a>, consectetur adipiscing elit, sed do eiusmod.</p>\n  </div>\n</div>","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":2,"modifiers":[{"name":".ds-c-alert--error","description":"Error message","className":"ds-c-alert--error"},{"name":".ds-c-alert--warn","description":"Warning message","className":"ds-c-alert--warn"},{"name":".ds-c-alert--success","description":"Success message","className":"ds-c-alert--success"}],"sections":[{"header":"---","description":"<h3 id=\"other-patterns\">Other patterns</h3>","reference":"components.alert.variations","referenceNumber":"3.1.4","referenceURI":"design-system/components/alert/variations","weight":0,"markup":"<div class=\"ds-c-alert\">\n  <div class=\"ds-c-alert__body\">\n    <p class=\"ds-c-alert__text\">{{lorem-l}}</p>\n  </div>\n</div>\n<div class=\"ds-c-alert ds-u-margin-top--2\">\n  <div class=\"ds-c-alert__body\">\n    <p class=\"ds-c-alert__text\">{{lorem-s}}</p>\n  </div>\n</div>\n<div class=\"ds-c-alert ds-u-margin-top--2\">\n  <div class=\"ds-c-alert__body\">\n    <h3 class=\"ds-c-alert__heading\">Status heading</h3>\n    <p class=\"ds-c-alert__text\">{{lorem-m}}</p>\n    <ul class=\"ds-c-list\">\n      <li>Alert list item</li>\n      <li>Alert list item</li>\n    </ul>\n    <a href=\"http://example.com\">Link text</a>\n  </div>\n</div>","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.alert"},{"header":"---","description":"","reference":"components.alert.inverse","referenceNumber":"3.1.2","referenceURI":"design-system/components/alert/inverse","weight":0,"markup":"<div class=\"ds-base--inverse ds-u-padding--2\">\n  <div class=\"ds-c-alert {{modifier}}\">\n    <div class=\"ds-c-alert__body\">\n      <h3 class=\"ds-c-alert__heading\">Status heading</h3>\n      <p class=\"ds-c-alert__text\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod.</p>\n    </div>\n  </div>\n</div>","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.alert"},{"header":"React","description":"","reference":"components.alert.react","referenceNumber":"3.1.3","referenceURI":"design-system/components/alert/react","weight":0,"markup":"","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Alert","parentReference":"components.alert"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>As a validation message that alerts someone that they just did something that needs to be corrected or as confirmation that a task was completed successfully.</li>\n<li>As a callout or notification for important or timely information. This includes errors, warnings, and general information.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>On long forms, always include in-line validation in addition to any error messages that appear at the top of the form. When possible, simplify forms by rewriting and where possible, splitting long forms across multiple pages</li>\n<li>If an action will result in destroying a user’s work (for example, deleting an application) use a more intrusive pattern, such as a confirmation modal dialogue, to allow the user to confirm that this is what they want.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Don’t overdo it — too many notifications will either overwhelm or annoy the user and are likely to be ignored.</li>\n<li>Write the message in concise, human readable language; avoid jargon and computer code.</li>\n<li>Don’t include notifications that aren’t related to the user’s current goal.</li>\n<li>When the user is required to do something in response to an alert, let them know what they need to do and make that task as easy as possible.</li>\n</ul>\n<p><strong>When the alert is for an error:</strong></p>\n<ul>\n<li>Be polite in error messages — don’t place blame on the user.</li>\n<li>Users generally won’t read documentation but will read a message that helps them resolve an error; include some educational material in your error message.</li>\n<li>If the error relates to specific text fields, give these fields an error state as well.</li>\n</ul>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Use the ARIA <code>role=&quot;alert&quot;</code> to inform assistive technologies of a time-sensitive and important message that is not interactive. If the message is interactive, use the <code>alertdialog</code> role instead.</li>\n<li>Do not visually hide alert messages on the page and then make them visible when they are needed. Users of older assistive technologies may still be able to perceive the alert messages even if they are not currently applicable.</li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"https://content-guide.18f.gov/active-voice/\">18F Content Guide - Active voice</a></li>\n</ul>","reference":"components.alert.guidance","referenceNumber":"3.1.1","referenceURI":"design-system/components/alert/guidance","weight":0,"markup":"","source":{"filename":"components/Alert/Alert.scss","path":"packages/core/src/components/Alert/Alert.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.alert"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/alerts","parentReference":"components"},{"header":"Badge","description":"<p>Badges hold small amounts of information and draw attention to new or important content.</p>","reference":"components.badge","referenceNumber":"3.2","referenceURI":"design-system/components/badge","weight":0,"markup":"<span class=\"ds-c-badge {{modifier}}\">5</span>\n<span class=\"ds-c-badge {{modifier}}\">Badge label</span>\n<span class=\"ds-c-badge {{modifier}} ds-u-font-size--base\">Badge label</span>","source":{"filename":"components/Badge/Badge.scss","path":"packages/core/src/components/Badge/Badge.scss"},"depth":2,"modifiers":[{"name":".ds-c-badge--info","description":"Info badge","className":"ds-c-badge--info"},{"name":".ds-c-badge--success","description":"Success badge","className":"ds-c-badge--success"},{"name":".ds-c-badge--warn","description":"Warning badge","className":"ds-c-badge--warn"},{"name":".ds-c-badge--alert","description":"Alert or error badge","className":"ds-c-badge--alert"}],"sections":[{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>To draw attention to new, important content on a page that might otherwise be missed.</li>\n<li>To filter results with one or more tags.</li>\n<li>To indicate the number of new or unread items within a container. For example, to indicate the number of unread messages within a person’s inbox.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>When users are likely to confuse a badge with a button. For example, when the badge appears in the same area of the page as buttons.</li>\n<li>To call attention to new or updated content, consider changing the background color of the object itself or experiment with changing the font weight.</li>\n<li>When users already expect content to be updated frequently. For example, on a site dedicated to breaking news. In this case placing the new content at the top may be enough.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Don’t overdo it — if everything on a page is called out as important, nothing is important.</li>\n<li>Users may confuse badges as buttons. Always conduct usability testing to make sure your particular implementation is not causing frustration.</li>\n<li>Don’t mix interactive and static badges on your site. Once you establish a pattern for how badges behave, users will expect that behavior every time.</li>\n</ul>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>When badges are used to call out new content that is dynamically loaded onto a page, be sure to use <a href=\"https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions\">ARIA live regions</a> to alert screen readers of the change.</li>\n</ul>\n<h2 id=\"future-research\">Future research</h2>\n<ul>\n<li>Further usability testing should be done to ensure badges aren&#39;t being confused with buttons. Further iteration can be done with sizing and colors if there is confusion.</li>\n</ul>","reference":"components.badge.guidance","referenceNumber":"3.2.1","referenceURI":"design-system/components/badge/guidance","weight":0,"markup":"","source":{"filename":"components/Badge/Badge.scss","path":"packages/core/src/components/Badge/Badge.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.badge"}],"status":"beta","uswdsUrl":"https://standards.usa.gov/components/labels/","parentReference":"components"},{"header":"Button","description":"<p>Use buttons to signal actions.</p>","reference":"components.button","referenceNumber":"3.3","referenceURI":"design-system/components/button","weight":0,"markup":"<a href=\"http://example.com\" class=\"ds-c-button {{modifier}}\">Link</a>\n<button type=\"button\" class=\"ds-c-button {{modifier}} ds-c-button--small\">Button</button>\n<button type=\"button\" class=\"ds-c-button {{modifier}}\">Button</button>\n<button type=\"button\" class=\"ds-c-button {{modifier}} ds-c-button--big\">Button</button>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":2,"modifiers":[{"name":".ds-c-button--primary","description":"The primary call-to-action","className":"ds-c-button--primary"},{"name":".ds-c-button--transparent","description":"A button closer to resembling an anchor element","className":"ds-c-button--transparent"},{"name":".ds-c-button--danger","description":"Indicates an action is destructive or dangerous","className":"ds-c-button--danger"},{"name":".ds-c-button--success","description":"Indicates a positive or successful action","className":"ds-c-button--success"}],"sections":[{"header":"---","description":"<h3 id=\"disabled-button\">Disabled button</h3>","reference":"components.button.disabled","referenceNumber":"3.3.1","referenceURI":"design-system/components/button/disabled","weight":0,"markup":"<button class=\"ds-c-button ds-c-button--disabled\">Button</button>\n<input disabled type=\"submit\" class=\"ds-c-button\" />","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"---","description":"<h3 id=\"inverse-theme\">Inverse theme</h3>","reference":"components.button.inverse","referenceNumber":"3.3.5","referenceURI":"design-system/components/button/inverse","weight":0,"markup":"<div class=\"ds-base--inverse ds-u-padding--2\">\n  <button class=\"ds-c-button ds-c-button--inverse\">Button</button>\n  <button class=\"ds-c-button ds-c-button--transparent-inverse\">Button</button>\n  <button class=\"ds-c-button ds-c-button--primary\">Button</button>\n  <button class=\"ds-c-button ds-c-button--danger\">Button</button>\n  <button class=\"ds-c-button ds-c-button--success\">Button</button>\n  <button class=\"ds-c-button ds-c-button--disabled-inverse\">Button</button>\n</div>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"Button icons","description":"<ul>\n<li>Add an inline SVG icon and it will become the same color as the button text. For the crispest icon rendering, ensure the icon has a square <code>viewBox</code> with values that are multiples of <code>8</code> (ie. <code>24x24</code>).</li>\n<li>Use the margin utility class to add spacing between the icon and button text.</li>\n</ul>","reference":"components.button.icons","referenceNumber":"3.3.3","referenceURI":"design-system/components/button/icons","weight":0,"markup":"<button class=\"ds-c-button\">\n  <svg class=\"ds-u-margin-right--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n    <use xlink:href=\"/design-system/public/images/symbols.svg#download\"></use>\n  </svg>Left icon\n</button>\n<button class=\"ds-c-button ds-c-button--primary\">\n  Right icon<svg class=\"ds-u-margin-left--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n    <use xlink:href=\"/design-system/public/images/symbols.svg#arrow-right\"></use>\n  </svg>\n</button>\n<button class=\"ds-c-button ds-c-button--outline\">\n  No icon\n</button>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"Button inline with field","description":"<p>The button is the same height as a single-line text field.</p>","reference":"components.button.inline-field","referenceNumber":"3.3.4","referenceURI":"design-system/components/button/inline-field","weight":0,"markup":"<input type=\"text\" class=\"ds-c-field ds-u-display--inline-block\" />\n<button class=\"ds-c-button\">Submit</button>","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"},{"header":"React","description":"","reference":"components.button.react","referenceNumber":"3.3.6","referenceURI":"design-system/components/button/react","weight":0,"markup":"","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Button","parentReference":"components.button"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>Use buttons for the most important actions you want users to take on your site, such as &quot;Download,&quot; &quot;Sign up,&quot; or &quot;Apply.&quot;</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>Less popular or less important actions may be visually styled as links.</li>\n<li>Buttons are for performing actions, not making choices. If you need your users to make a choice, use something else like radio buttons. Alternatively, if one choice is much less important then try styling it as a link instead.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Use the &quot;primary&quot; button variation for the button most users should click. This is your primary call-to-action.</li>\n<li>Avoid using too many buttons on a page. Aim to use only one button per page.</li>\n<li>Avoid similar styles elsewhere on the page that could be confused for buttons.</li>\n<li>Use buttons for the primary action and links for secondary actions.</li>\n</ul>\n<p><strong>Label text</strong></p>\n<ul>\n<li>Use sentence case for button labels.</li>\n<li>Button labels should be as short as possible with “trigger words” that your users will recognize to clearly explain what will happen when the button is clicked (for example, “Save and continue,” “Download” or “Sign up”).</li>\n<li>Make the first word of the button’s label a verb. For example, instead of “Complaint Filing”, label the button “File a complaint.”</li>\n<li>If a button has an icon, it should still have accompanying text describing the action.</li>\n</ul>\n<p><strong>Destructive buttons</strong></p>\n<ul>\n<li>Use the &quot;danger&quot; button variation for destructive buttons. For example, buttons that delete or reset a user&#39;s information.</li>\n<li>Confirm the user meant to trigger a destructive action before following through with the action.</li>\n<li>Provide a method for a user to undo a destructive action.</li>\n</ul>\n<p><strong>Disabled buttons</strong></p>\n<ul>\n<li>Don’t disable buttons, unless there’s a good reason to.</li>\n<li>If you do disable a button, make sure it receives the disabled styling. A <code>button</code> element will automatically be styled as a disabled button when it has the <code>disabled</code> HTML attribute, but an <code>a</code> element will need to have the disabled modifier class applied to it.</li>\n</ul>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Buttons should display a visible focus state when users tab to them.</li>\n<li>Create a button with a <code>button</code> or <code>a</code> element to retain the native click functionality. Avoid using <code>&lt;div&gt;</code> or <code>&lt;img&gt;</code> tags to create buttons. Screen readers don&#39;t automatically know either is a usable button.</li>\n<li>When styling links to look like buttons, remember that screen readers handle links slightly differently than they do buttons. Pressing the <code>Space</code> key triggers a button, but pressing the <code>Enter</code> key triggers a link.</li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"https://www.nngroup.com/articles/clickable-elements/\">Beyond Blue Links: Making Clickable Elements Recognizable</a></li>\n<li><a href=\"http://www.uxmatters.com/mt/archives/2012/05/7-basic-best-practices-for-buttons.php\">7 Basic Best Practices for Buttons</a></li>\n<li><a href=\"http://www.uxbooth.com/articles/the-grammar-of-interactivity/\">The Grammar of Interactivity</a></li>\n<li><a href=\"https://paper.dropbox.com/doc/Navigation-buttons-continue-next-previous-ghLqL5a9Ostxxb3rvBhyO\">GOV.UK navigation buttons discussion</a></li>\n</ul>\n<p><strong>Button alignment</strong></p>\n<ul>\n<li><a href=\"http://www.slideshare.net/cjforms/buttons-on-forms-and-surveys-a-look-at-some-research-2012\">Buttons on forms and surveys: a look at some research</a></li>\n<li><a href=\"https://www.lukew.com/ff/entry.asp?730=\">Previous and Next Actions in Web Forms</a></li>\n</ul>\n<p><strong>ARIA</strong></p>\n<ul>\n<li><a href=\"https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_button_role\">Using the button role</a></li>\n<li><a href=\"https://www.deque.com/blog/accessible-aria-buttons\">Building Accessible Buttons with ARIA</a></li>\n</ul>","reference":"components.button.guidance","referenceNumber":"3.3.2","referenceURI":"design-system/components/button/guidance","weight":0,"markup":"","source":{"filename":"components/Button/Button.scss","path":"packages/core/src/components/Button/Button.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.button"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/buttons","parentReference":"components"},{"header":"Checkbox & Radio","description":"<p>Checkboxes allow users to select one or more options from a visible list, whereas radio buttons allow a user to select only one option.</p>","reference":"components.choice","referenceNumber":"3.4","referenceURI":"design-system/components/choice","weight":0,"markup":"<fieldset class=\"ds-c-fieldset ds-u-margin-top--0\">\n  <legend class=\"ds-c-label\">Historical figures</legend>\n  <span class=\"ds-c-field__hint\">Select all that apply</span>\n  <input class=\"ds-c-choice\" id=\"truth-1\" type=\"checkbox\" name=\"historical-figures-1\" value=\"truth\" checked>\n  <label for=\"truth-1\">Sojourner Truth</label>\n  <input class=\"ds-c-choice\" id=\"douglass-1\" type=\"checkbox\" name=\"historical-figures-1\" value=\"douglass\">\n  <label for=\"douglass-1\">Frederick Douglass</label>\n  <input class=\"ds-c-choice\" id=\"washington-1\" type=\"checkbox\" name=\"historical-figures-1\" value=\"washington\">\n  <label for=\"washington-1\">Booker T. Washington</label>\n  <input class=\"ds-c-choice\" id=\"carver-1\" type=\"checkbox\" name=\"historical-figures-1\" disabled>\n  <label for=\"carver-1\">George Washington Carver</label>\n</fieldset>\n<fieldset class=\"ds-c-fieldset\">\n  <legend class=\"ds-c-label\">Select a historical figure</legend>\n  <input class=\"ds-c-choice\" id=\"truth-3\" type=\"radio\" name=\"historical-figures-3\" value=\"truth\" checked>\n  <label for=\"truth-3\">Sojourner Truth</label>\n  <input class=\"ds-c-choice\" id=\"douglass-3\" type=\"radio\" name=\"historical-figures-3\" value=\"douglass\">\n  <label for=\"douglass-3\">Frederick Douglass</label>\n  <input class=\"ds-c-choice\" id=\"washington-3\" type=\"radio\" name=\"historical-figures-3\" value=\"washington\">\n  <label for=\"washington-3\">Booker T. Washington</label>\n</fieldset>\n<div class=\"ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2\">\n  <fieldset class=\"ds-c-fieldset ds-u-margin-top--0\">\n    <legend class=\"ds-c-label\">Historical figures</legend>\n    <span class=\"ds-c-field__hint ds-c-field__hint--inverse\">Select all that apply</span>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"truth-2\" type=\"checkbox\" name=\"historical-figures-2\" value=\"truth\" checked>\n    <label for=\"truth-2\">Sojourner Truth</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"douglass-2\" type=\"checkbox\" name=\"historical-figures-2\" value=\"douglass\">\n    <label for=\"douglass-2\">Frederick Douglass</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"washington-2\" type=\"checkbox\" name=\"historical-figures-2\" value=\"washington\">\n    <label for=\"washington-2\">Booker T. Washington</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"carver-2\" type=\"checkbox\" name=\"historical-figures-2\" disabled>\n    <label for=\"carver-2\">George Washington Carver</label>\n  </fieldset>\n  <fieldset class=\"ds-c-fieldset\">\n    <legend class=\"ds-c-label\">Select a historical figure</legend>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"truth-4\" type=\"radio\" name=\"historical-figures-4\" value=\"truth\" checked>\n    <label for=\"truth-4\">Sojourner Truth</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"douglass-4\" type=\"radio\" name=\"historical-figures-4\" value=\"douglass\">\n    <label for=\"douglass-4\">Frederick Douglass</label>\n    <input class=\"ds-c-choice ds-c-choice--inverse\" id=\"washington-4\" type=\"radio\" name=\"historical-figures-4\" value=\"washington\">\n    <label for=\"washington-4\">Booker T. Washington</label>\n  </fieldset>\n</div>","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":2,"modifiers":[],"sections":[{"header":"<code>&#x3C;Choice&#x3E;</code>","description":"","reference":"components.choice.react","referenceNumber":"3.4.3","referenceURI":"design-system/components/choice/react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Choice","parentReference":"components.choice"},{"header":"<code>&#x3C;ChoiceList&#x3E;</code>","description":"","reference":"components.choice.choicelist-react","referenceNumber":"3.4.1","referenceURI":"design-system/components/choice/choicelist-react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"ChoiceList","parentReference":"components.choice"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<p><strong>Checkboxes</strong></p>\n<ul>\n<li>When a user can select any number of choices from a set list.</li>\n<li>When a user needs to choose “yes” or “no” on only one option (use a stand-alone checkbox). For example, to toggle a setting on or off.</li>\n<li>When users need to see all the available options at a glance.</li>\n<li>When users should be able to select zero of the options.</li>\n</ul>\n<p><strong>Radio buttons</strong></p>\n<ul>\n<li>When users need to select only one option out of a set of mutually exclusive choices.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>If there are too many options to display on a mobile screen. Consider a <code>select</code> menu if you don’t have enough space to list out all available options, and if the user can only select one of the options.</li>\n<li>Never use radio buttons for optional questions, since once a radio button is selected from a list, it or another choice will remain selected.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Don&#39;t rely on the visual difference between radio buttons and checkboxes. Make it clear with words when users can select one or multiple options.</li>\n<li>Users should be able to tap on or click on either the text label or the checkbox to select or deselect an option.</li>\n<li>In general, list choices vertically; horizontal listings can make it difficult to tell which label pertains to which choice. An exception is where you have binary choices with short labels, like &#39;Yes / No&#39;. The convention here is for horizontal alignment.</li>\n<li>Avoid using negative language in labels as they can be counterintuitive. For example, “I want to receive a promotional email” instead of “I don’t want to receive promotional email.”</li>\n<li>Use caution if you decide to set a default value. Setting a default value can discourage users from making conscious decisions, seem pushy, or alienate users who don’t fit into your assumptions. In addition, you&#39;ll never know if the user explicitly chose that option or just didn&#39;t notice the question. If you&#39;re unsure, leave nothing selected by default.</li>\n</ul>\n<p><strong><a href=\"/design-system/guidelines/forms/\">View the &quot;Forms&quot; guidelines for additional guidance and best practices.</a></strong></p>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Surround a related set of choices with a <code>&lt;fieldset&gt;</code>. The <code>&lt;legend&gt;</code> provides context for the grouping. Do not use <code>fieldset</code> and <code>legend</code> for a single checkbox.</li>\n<li>Some screen readers read the <code>legend</code> text for each <code>fieldset</code>, so it should be brief and descriptive.</li>\n<li>Each input should have a semantic <code>id</code> attribute, and its corresponding <code>label</code> should have the same value in its <code>for</code> attribute.</li>\n<li>The custom checkboxes and radio buttons here are accessible to screen readers because the default fields are moved off-screen.</li>\n</ul>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme choice fields:</p>\n<ul>\n<li><code>$choice-border-width</code></li>\n<li><code>$choice-border-color</code></li>\n<li><code>$choice-border-color-inverse</code></li>\n<li><code>$choice-checked-background-color</code></li>\n</ul>\n<h2 id=\"related-patterns\">Related patterns</h2>\n<ul>\n<li><a href=\"/design-system/components/select\">Select menu</a></li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"/design-system/guidelines/forms/\">Form Guidelines</a></li>\n<li><a href=\"https://paper.dropbox.com/doc/Radio-buttons-oIwWoxwBKClt5IXvDbnpF\">GOV.UK Checkbox/Radio buttons discussion</a></li>\n<li><a href=\"https://designnotes.blog.gov.uk/2016/11/30/weve-updated-the-radios-and-checkboxes-on-gov-uk/\">&quot;We&#39;ve updated the radios and checkboxes on GOV.UK&quot;</a></li>\n<li><a href=\"http://www.formsthatwork.com/files/Articles/dropdown.pdf\">Four steps for choosing form elements on the Web (PDF)</a></li>\n</ul>","reference":"components.choice.guidance","referenceNumber":"3.4.2","referenceURI":"design-system/components/choice/guidance","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Choice.scss","path":"packages/core/src/components/ChoiceList/Choice.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.choice"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/form-controls","parentReference":"components"},{"header":"List","description":"<p>Lists organize written information for users.</p>","reference":"components.list","referenceNumber":"3.5","referenceURI":"design-system/components/list","weight":0,"markup":"<h6 class=\"ds-h6\">Unordered list</h6>\n<ul class=\"ds-c-list {{modifier}}\">\n  <li>List item 1</li>\n  <li>List item 2</li>\n</ul>\n<h6 class=\"ds-h6\">Ordered list</h6>\n<ol class=\"ds-c-list {{modifier}}\">\n  <li>List item 1</li>\n  <li>List item 2</li>\n</ol>","source":{"filename":"components/List/List.scss","path":"packages/core/src/components/List/List.scss"},"depth":2,"modifiers":[{"name":".ds-c-list--bare","description":"Unstyled list (no <code>margin</code>, <code>padding</code> or <code>list-style</code>)","className":"ds-c-list--bare"}],"sections":[{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>Use an ordered list when you need to display text in some ranking, hierarchy, or series of steps.</li>\n<li>Use unordered lists to display text in no specific order.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>If you need to communicate long lists of narrative text.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Use sentence case and begin lists with a capital letter.</li>\n<li>Use punctuation appropriate to the text. Do not leave sentences without periods.</li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"https://content-guide.18f.gov/punctuation/#bulleted-lists\">18F Content Guide - Bulleted lists</a></li>\n</ul>","reference":"components.list.guidance","referenceNumber":"3.5.1","referenceURI":"design-system/components/list/guidance","weight":0,"markup":"","source":{"filename":"components/List/List.scss","path":"packages/core/src/components/List/List.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.list"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/typography/#lists","parentReference":"components"},{"header":"Select","description":"<p>A select field allows users to select one option from a list.</p>","reference":"components.select","referenceNumber":"3.6","referenceURI":"design-system/components/select","weight":0,"markup":"<label class=\"ds-c-label ds-u-margin-top--0\" for=\"options\">Field label</label>\n<select class=\"ds-c-field ds-c-field--select\" name=\"options\" id=\"options\">\n  <option value=\"1\">Option 1</option>\n  <option value=\"2\">Option 2</option>\n  <option value=\"3\">Option 3</option>\n  <option value=\"4\">Option 4</option>\n  <option value=\"5\">Option 5</option>\n  <option value=\"6\">Option 6</option>\n  <option value=\"7\">Option 7</option>\n</select>\n<div class=\"ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2\">\n  <label class=\"ds-c-label ds-u-margin-top--0\" for=\"options-inverse\">Field label</label>\n  <select class=\"ds-c-field ds-c-field--select ds-c-field--inverse\" name=\"options-inverse\" id=\"options-inverse\">\n    <option value=\"1\">Option 1</option>\n    <option value=\"2\">Option 2</option>\n    <option value=\"3\">Option 3</option>\n    <option value=\"4\">Option 4</option>\n    <option value=\"5\">Option 5</option>\n    <option value=\"6\">Option 6</option>\n    <option value=\"7\">Option 7</option>\n  </select>\n</div>","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":2,"modifiers":[],"sections":[{"header":"<code>&#x3C;Select&#x3E;</code>","description":"","reference":"components.select.react","referenceNumber":"3.6.3","referenceURI":"design-system/components/select/react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Select","parentReference":"components.select"},{"header":"<code>&#x3C;ChoiceList&#x3E;</code>","description":"","reference":"components.select.choicelist-react","referenceNumber":"3.6.1","referenceURI":"design-system/components/select/choicelist-react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"ChoiceList","parentReference":"components.select"},{"header":"---","description":"<h3 id=\"when-to-use\">When to use</h3>\n<ul>\n<li>Use sparingly — only when a user needs to choose from about seven to 15 possible options and you have limited space to display the options.</li>\n</ul>\n<h3 id=\"when-to-consider-alternatives\">When to consider alternatives</h3>\n<ul>\n<li>If the list of options is short. Use radio or checkboxes buttons instead.</li>\n<li>If the list of options is very long. Let users type the same information into a text input that suggests possible options instead. Long lists can sometimes be broken into multiple shorter lists by asking a few questions up-front to filter out options.</li>\n<li>If you need to allow users to select more than one option at once. Users often don’t understand how to select multiple items from dropdowns. Use checkboxes instead.</li>\n<li>If the data is highly familiar to users, such as the day, month, or year of their birth.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Choose a sensible order for the options to enable visual scanning of the lists.</li>\n<li>Test dropdowns thoroughly with members of your target audience. Several usability experts suggest they should be the “UI of last resort.” Many users find them confusing and difficult to use.</li>\n<li>Avoid making options in one dropdown menu change based on the input to another. Users often don’t understand how selecting an item in one impacts another.</li>\n<li>When most users will (or should) pick a particular option, make it the default: <code>&lt;option selected=&quot;selected&quot;&gt;Default&lt;/option&gt;</code></li>\n<li>Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Offer a “submit” button at the end of the form instead. Users often change their choices multiple times. Auto-submission is also less accessible.</li>\n</ul>\n<p><strong><a href=\"/design-system/guidelines/forms/\">View the &quot;Forms&quot; guidelines for additional guidance and best practices.</a></strong></p>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Make sure your dropdown has a label. Don’t replace it with the default menu option (for example, removing the “State” label and just having the dropdown read “Select a state” by default).</li>\n<li>Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Auto-submission disrupts screen readers because they select each option as they read them.</li>\n<li>On some devices the list of options cannot be zoomed, which means that some people with visual impairments cannot use them.</li>\n</ul>\n<h2 id=\"related-patterns\">Related patterns</h2>\n<ul>\n<li><a href=\"/design-system/components/choice\">Checkbox and Radio</a></li>\n<li><a href=\"/design-system/components/text-field\">Text field</a></li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"/design-system/guidelines/forms/\">Form Guidelines</a></li>\n<li><a href=\"https://designnotes.blog.gov.uk/2013/12/05/asking-for-a-date-of-birth/\">Asking for a date of birth</a></li>\n<li><a href=\"http://www.formsthatwork.com/files/Articles/dropdown.pdf\">Four steps for choosing form elements on the Web (PDF)</a></li>\n<li><a href=\"https://www.nngroup.com/articles/drop-down-menus/\">Dropdowns: Design Guidelines</a></li>\n</ul>","reference":"components.select.guidance","referenceNumber":"3.6.2","referenceURI":"design-system/components/select/guidance","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.select"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/form-controls/#dropdown","parentReference":"components"},{"header":"Table","description":"<p>Tables show tabular data in columns and rows.</p>","reference":"components.table","referenceNumber":"3.7","referenceURI":"design-system/components/table","weight":0,"markup":"<table class=\"ds-c-table {{modifier}}\">\n  <thead>\n    <tr>\n      <th>Name</th>\n      <th class=\"ds-u-text-align--right\">Rate</th>\n      <th>Favorite fruit</th>\n    </tr>\n  </thead>\n  <tbody>\n    <tr>\n      <td>Fred</td>\n      <td class=\"ds-u-text-align--right\">51.25%</td>\n      <td>Apples</td>\n    </tr>\n    <tr>\n      <td>Tamara</td>\n      <td class=\"ds-u-text-align--right\">98.70%</td>\n      <td>Strawberries</td>\n    </tr>\n  </tbody>\n</table>","source":{"filename":"components/Table/Table.scss","path":"packages/core/src/components/Table/Table.scss"},"depth":2,"modifiers":[{"name":".ds-c-table--borderless","description":"Borderless table","className":"ds-c-table--borderless"}],"sections":[{"header":"Table with two headers and a caption","description":"","reference":"components.table.complex","referenceNumber":"3.7.1","referenceURI":"design-system/components/table/complex","weight":0,"markup":"<table class=\"ds-c-table {{modifier}}\">\n  <caption class=\"ds-c-table__caption\">Household members</caption>\n  <thead>\n    <tr>\n      <th scope=\"col\">Name</th>\n      <th scope=\"col\">Street</th>\n      <th scope=\"col\">Employer</th>\n    </tr>\n  </thead>\n  <tbody>\n    <tr>\n      <th scope=\"row\">John Doe</th>\n      <td>123 Braavos Ave.</td>\n      <td>Acme Co.</td>\n    </tr>\n    <tr>\n      <th scope=\"row\">Jane Doe</th>\n      <td>456 King's Landing</td>\n      <td>Acme Co.</td>\n    </tr>\n  </tbody>\n</table>","source":{"filename":"components/Table/Table.scss","path":"packages/core/src/components/Table/Table.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.table"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>When you need tabular information, such as statistical data.</li>\n<li>When users need to compare sets of information.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>Depending on the type of content, consider using other presentation formats such as definition lists or hierarchical lists.</li>\n<li>If you&#39;re writing out name / value pairs, there&#39;s often a more compact way compared to using a table.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Right-align numerical data in tables. You can use a <a href=\"/design-system/utilities/text-align\">text alignment utility class</a> for this. This makes it easier to scan and compare values.</li>\n</ul>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Tables can have two levels of headers. Each header cell should have <code>scope=&quot;col&quot;</code> or <code>scope=&quot;row&quot;</code>. <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th#attr-scope\">Learn more about the &quot;scope&quot; attribute.</a></li>\n<li>Complex tables are tables with more than two levels of headers. Each header should be given a unique <code>id</code> and each data cell should have a <code>headers</code> attribute with each related header cell’s <code>id</code> listed.</li>\n<li>When adding a title to a table, include it in a <code>&lt;caption&gt;</code> tag inside of the <code>&lt;table&gt;</code> element.</li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"https://www.w3.org/WAI/tutorials/tables/\">W3C Web Accessibility Tutorial - Table Concepts</a></li>\n<li><a href=\"https://medium.com/mission-log/design-better-data-tables-430a30a00d8c\">Design Better Data Tables</a></li>\n</ul>","reference":"components.table.guidance","referenceNumber":"3.7.2","referenceURI":"design-system/components/table/guidance","weight":0,"markup":"","source":{"filename":"components/Table/Table.scss","path":"packages/core/src/components/Table/Table.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.table"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/tables/","parentReference":"components"},{"header":"Tabs","description":"<p>Tabs can be used as a navigation pattern, allowing a user to switch between panels of related content within the same context.</p>","reference":"components.tabs","referenceNumber":"3.8","referenceURI":"design-system/components/tabs","weight":0,"markup":"<div class=\"ds-c-tabs\" role=\"tablist\" aria-label=\"Settings\">\n  <a\n    class=\"ds-c-tabs__item\"\n    href=\"#panel-profile\"\n    role=\"tab\"\n    aria-selected=\"true\"\n    aria-controls=\"panel-profile\"\n    id=\"tab-profile\"\n  >\n    <svg class=\"ds-u-margin-right--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n      <use xlink:href=\"/design-system/public/images/symbols.svg#placeholder\"></use>\n    </svg>Profile\n  </a>\n  <a\n    class=\"ds-c-tabs__item\"\n    href=\"#panel-comms\"\n    role=\"tab\"\n    aria-selected=\"false\"\n    aria-controls=\"panel-comms\"\n    id=\"tab-comms\"\n  >\n    <svg class=\"ds-u-margin-right--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n      <use xlink:href=\"/design-system/public/images/symbols.svg#placeholder\"></use>\n    </svg>Communication preferences\n  </a>\n</div>\n<div class=\"ds-c-tabs__panel\" id=\"panel-profile\" aria-labelledby=\"tab-profile\" role=\"tabpanel\">\n  Note: This is just an example of the HTML markup. See the React example for\n  a functioning example.\n</div>\n<div class=\"ds-c-tabs__panel\" id=\"panel-comms\" aria-hidden=\"true\" aria-labelledby=\"tab-comms\" aria-selected=\"false\" role=\"tabpanel\">\n  Communication preferences content\n</div>","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":2,"modifiers":[],"sections":[{"header":"<code>&#x3C;Tabs&#x3E;</code>","description":"","reference":"components.tabs.react-tabs","referenceNumber":"3.8.4","referenceURI":"design-system/components/tabs/react-tabs","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Tabs","parentReference":"components.tabs"},{"header":"<code>&#x3C;TabPanel&#x3E;</code>","description":"","reference":"components.tabs.react-tabpanel","referenceNumber":"3.8.3","referenceURI":"design-system/components/tabs/react-tabpanel","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"hideExample":true,"reactComponent":"TabPanel","parentReference":"components.tabs"},{"header":"<code>&#x3C;Tab&#x3E;</code>","description":"","reference":"components.tabs.react-tab","referenceNumber":"3.8.2","referenceURI":"design-system/components/tabs/react-tab","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Tab","parentReference":"components.tabs"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>If you have 2-3 panels of related content that needs to be condensed.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>If you have more than three tabs. Consider using a different pattern if your content requires being split into more than three panels.</li>\n<li>If the panel contents aren&#39;t related.</li>\n<li>If the panel contents can be displayed at once. This will improve the scanability of your page&#39;s content and it&#39;s more likely the user will be able to find what they&#39;re looking for.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Don&#39;t hide tabs on small screens. If the tabs can&#39;t fit on one row on small screens, consider using utility classes to apply additional responsive styles or use a different pattern.</li>\n<li>Each Tab label should be descriptive of its content and set the user&#39;s expectations. Labels should be no more than two words.</li>\n</ul>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Use an anchor link (<code>a</code>) to create the tabs. This allows you to link directly to a tab, and allows you to progressively enhance the page, retaining default browser behavior like opening links in a new window. Note: You&#39;ll need to implement the logic for selecting the correct tab based on the current URL.</li>\n<li>Ensure the HTML markup includes the proper ARIA attributes:<ul>\n<li>For tabs: <code>role</code>, <code>aria-selected</code>, <code>aria-controls</code></li>\n<li>For the tabs list parent: <code>role</code>, <code>aria-label</code></li>\n<li>For a tab panel: <code>role</code>, <code>aria-labelledby</code></li>\n</ul>\n</li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"https://24ways.org/2015/how-tabs-should-work/\">How Tabs Should Work</a></li>\n<li><a href=\"http://heydonworks.com/practical_aria_examples/#tab-interface\">Simple ARIA tab interface</a></li>\n</ul>","reference":"components.tabs.guidance","referenceNumber":"3.8.1","referenceURI":"design-system/components/tabs/guidance","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.tabs"}],"status":"beta","parentReference":"components"},{"header":"Text field","description":"<p>Text fields allow people to enter any combination of letters, numbers, or symbols of their choosing (unless otherwise restricted). Text fields can span single or multiple lines.</p>","reference":"components.text-field","referenceNumber":"3.9","referenceURI":"design-system/components/text-field","weight":0,"markup":"<label class=\"ds-c-label ds-u-margin-top--0\" for=\"input-firstname\">\n  First name\n  <span class=\"ds-c-field__hint\">Helpful hint text</span>\n</label>\n<input class=\"ds-c-field\" id=\"input-firstname\" name=\"firstname\" type=\"text\">\n<label class=\"ds-c-label\" for=\"input-lastname\">\n  <span class=\"ds-u-font-weight--bold\">Last name</span>\n  <span class=\"ds-c-field__hint ds-u-color--error\" role=\"alert\">\n    Please enter your last name\n  </span>\n  <span class=\"ds-c-field__hint\">Helpful hint text</span>\n</label>\n<input class=\"ds-c-field ds-c-field--error\" id=\"input-lastname\" name=\"lastname\" type=\"text\" />\n<label class=\"ds-c-label\" for=\"input-username\">Username</label>\n<input class=\"ds-c-field ds-c-field--success\" id=\"input-username\" name=\"username\" type=\"text\">\n<label class=\"ds-c-label\" for=\"input-bio\">Bio</label>\n<textarea class=\"ds-c-field\" id=\"input-bio\" name=\"bio\" rows=\"5\"></textarea>","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"","reference":"components.text-field.inverse","referenceNumber":"3.9.2","referenceURI":"design-system/components/text-field/inverse","weight":0,"markup":"<div class=\"ds-base--inverse ds-u-padding--2\">\n  <label class=\"ds-c-label ds-u-margin-top--0\" for=\"input-firstname-2\">\n    First name\n    <span class=\"ds-c-field__hint ds-c-field__hint--inverse\">Helpful hint text</span>\n  </label>\n  <input class=\"ds-c-field ds-c-field--inverse\" id=\"input-firstname-2\" name=\"firstname\" type=\"text\">\n  <label class=\"ds-c-label\" for=\"input-lastname-2\">\n    <span class=\"ds-u-font-weight--bold\">Last name</span>\n    <span class=\"ds-c-field__hint ds-u-color--error-light\" role=\"alert\">\n      Please enter your last name\n    </span>\n    <span class=\"ds-c-field__hint ds-c-field__hint--inverse\">Helpful hint text</span>\n  </label>\n  <input class=\"ds-c-field ds-c-field--inverse ds-c-field--error\" id=\"input-lastname-2\" name=\"lastname\" type=\"text\">\n  <label class=\"ds-c-label\" for=\"input-username-2\">Username</label>\n  <input class=\"ds-c-field ds-c-field--inverse ds-c-field--success\" id=\"input-username-2\" name=\"username\" type=\"text\">\n  <label class=\"ds-c-label\" for=\"input-bio-2\">Bio</label>\n  <textarea class=\"ds-c-field ds-c-field--inverse\" id=\"input-bio-2\" name=\"bio\" rows=\"5\"></textarea>\n</div>","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.text-field"},{"header":"<code>&#x3C;TextField&#x3E;</code>","description":"","reference":"components.text-field.react","referenceNumber":"3.9.3","referenceURI":"design-system/components/text-field/react","weight":0,"markup":"","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"TextField","parentReference":"components.text-field"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>If you can’t reasonably predict a user’s answer to a prompt and there might be wide variability in users’ answers.</li>\n<li>When using another type of input will make answering more difficult. For example, birthdays and other known dates are easier to type in than they are to select from a calendar picker.</li>\n<li>When users want to paste in a response.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>When users are choosing from a specific set of options. Consider checkboxes, radio buttons, or a select menu in these cases.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Don&#39;t use placeholder text in form fields. Use hint text instead, if you need to provide contextual information. Placeholder text disappears after a user types a value, therefore users will no longer have that text available when they need to review their entries. People who have cognitive or visual disabilities have additional problems with placeholder text.</li>\n<li>The length of the text field provides a hint to users as to how much text to write. Do not require users to write paragraphs of text into a single-line <code>input</code> box; use a <code>textarea</code> instead.</li>\n<li>Text fields are among the easiest type of input for desktop users but are more difficult for mobile users.</li>\n<li>Only show error messages or styling after a user has interacted with a particular field.</li>\n</ul>\n<p><strong><a href=\"/design-system/guidelines/forms/\">View the &quot;Forms&quot; guidelines for additional guidance and best practices.</a></strong></p>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Group each set of thematically related controls in a <code>fieldset</code> element. Use the <code>legend</code> element to offer a label within each <code>fieldset</code>. The <code>fieldset</code> and <code>legend</code> elements make it easier for screen reader users to navigate the form.</li>\n<li>Keep your form blocks in a vertical pattern. This approach is ideal, from an accessibility standpoint, because of limited vision that makes it hard to scan from left to right.</li>\n</ul>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme a field:</p>\n<ul>\n<li><code>$color-focus</code></li>\n<li><code>$color-focus-inverse</code></li>\n<li><code>$focus-shadow</code></li>\n<li><code>$focus-shadow-inverse</code></li>\n<li><code>$input-border-color</code></li>\n<li><code>$input-border-color-inverse</code></li>\n<li><code>$input-border-radius</code></li>\n<li><code>$input-line-height</code></li>\n<li><code>$input-border-width</code></li>\n<li><code>$input-padding</code></li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"/design-system/guidelines/forms/\">Form Guidelines</a></li>\n<li><a href=\"https://www.nngroup.com/articles/form-design-placeholders/\">&quot;Placeholders in Form Fields Are Harmful&quot;</a></li>\n<li><a href=\"https://designnotes.blog.gov.uk/2013/12/05/asking-for-a-date-of-birth/\">Asking for a date of birth</a></li>\n<li><a href=\"https://paper.dropbox.com/doc/Text-boxes-8NLlgz9tjR8OzTz2N9wE3\">GOV.UK text boxes discussion</a></li>\n<li><a href=\"http://www.formsthatwork.com/files/Articles/dropdown.pdf\">Four steps for choosing form elements on the Web (PDF)</a></li>\n</ul>","reference":"components.text-field.guidance","referenceNumber":"3.9.1","referenceURI":"design-system/components/text-field/guidance","weight":0,"markup":"","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.text-field"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/form-controls/#text-input","parentReference":"components"},{"header":"Vertical navigation","description":"<p>Hierarchical, vertical navigation.</p>","reference":"components.vertical-nav","referenceNumber":"3.10","referenceURI":"design-system/components/vertical-nav","weight":0,"markup":"<ul class=\"ds-c-vertical-nav\">\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Parent link</a>\n  </li>\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link ds-c-vertical-nav__link--current\" href=\"http://example.com\">Current page</a>\n    <ul class=\"ds-c-vertical-nav__subnav\">\n      <li class=\"ds-c-vertical-nav__item\">\n        <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Child link</a>\n      </li>\n      <li class=\"ds-c-vertical-nav__item\">\n        <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Child link</a>\n        <ul class=\"ds-c-vertical-nav__subnav\">\n          <li class=\"ds-c-vertical-nav__item\">\n            <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Grandchild link</a>\n          </li>\n          <li class=\"ds-c-vertical-nav__item\">\n            <a class=\"ds-c-vertical-nav__link ds-c-vertical-nav__link--current\" href=\"http://example.com\">Grandchild link</a>\n          </li>\n        </ul>\n      </li>\n      <li class=\"ds-c-vertical-nav__item\">\n        <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Child link</a>\n      </li>\n    </ul>\n  </li>\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Parent link</a>\n  </li>\n</ul>","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":2,"modifiers":[],"sections":[{"header":"<code>&#x3C;VerticalNav&#x3E;</code>","description":"","reference":"components.vertical-nav.VerticalNav","referenceNumber":"3.10.2","referenceURI":"design-system/components/vertical-nav/VerticalNav","weight":0,"markup":"","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"VerticalNav","parentReference":"components.vertical-nav"},{"header":"<code>&#x3C;VerticalNavItem&#x3E;</code>","description":"","reference":"components.vertical-nav.VerticalNavItem","referenceNumber":"3.10.3","referenceURI":"design-system/components/vertical-nav/VerticalNavItem","weight":0,"markup":"","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"hideExample":true,"reactComponent":"VerticalNavItem","parentReference":"components.vertical-nav"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>To display a navigational hierarchy with one to three levels.</li>\n<li>To display the “sub-navigation” within a section of the website.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>If the site has fewer than five pages, consider organizing the page without a navigational hierarchy.</li>\n<li>If your page already has a horizontal and vertical navigation bar, consider ways to simplify your navigation system.</li>\n<li>If your content is within a frame or sub-area of a page, consider ways to simplify your navigation system.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Indicate where a user is within the navigational hierarchy. Use the <code>ds-c-vertical-nav__link--current</code> modifier to show users which page they have navigated to.</li>\n<li>Keep the navigation links short and follow sentence case. They can be shorter derivatives of page titles themselves.</li>\n<li>If the navigation hierarchy is too long, users may miss items at the bottom. If it’s too deep, users may miss items that require too many clicks. Usability test to find the right balance between breadth and depth.</li>\n</ul>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Users should be able to tab through each link.</li>\n<li>If you have nested menus that are collapsible, ensure the toggle button has its <code>aria-controls</code> and <code>aria-expanded</code> attributes set. This is done automatically for you\nif you&#39;re using the React components.</li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"https://content-guide.18f.gov/capitalization/#headings\">18F Content Guide - Heading capitalization</a></li>\n<li><a href=\"https://content-guide.18f.gov/headings-and-titles/\">18F Content Guide - Headings and titles</a></li>\n</ul>","reference":"components.vertical-nav.guidance","referenceNumber":"3.10.1","referenceURI":"design-system/components/vertical-nav/guidance","weight":0,"markup":"","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.vertical-nav"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/sidenav/","parentReference":"components"}],"parentReference":null};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/components/list/index.html b/docs/components/list/index.html
index f0426ca4b3..eab7b1e099 100644
--- a/docs/components/list/index.html
+++ b/docs/components/list/index.html
@@ -2,30 +2,71 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>List - CMSgov Design System</title>
+  <title>List - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="884521723"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-u-fill--warn ds-u-color--base" data-reactid="12">prototype</span><h1 class="ds-display" id="components.list" data-reactid="13">List</h1><div class="ds-u-clearfix" data-reactid="14"></div><code class="ds-u-font-size--small" data-reactid="15">components/List/List.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="16"><article class="ds-u-margin-y--6 l-content" data-reactid="17"><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20"><ul class="ds-c-list">
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="299785930"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-c-badge--success" data-reactid="10">recommended</span><h1 class="ds-display" id="components.list" data-reactid="11">List</h1><div class="ds-u-clearfix" data-reactid="12"></div><code class="ds-u-font-size--small" data-reactid="13">components/List/List.scss</code><p data-reactid="14"><a href="https://standards.usa.gov/components/typography/#lists" data-reactid="15">US Web Design Standard</a></p></heading><div data-reactid="16"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="17"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="18">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="19">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="20"><article class="ds-u-margin-y--6 l-content" data-reactid="21"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="22"><p>Lists organize written information for users.</p></div><section class="ds-u-margin-top--3" data-reactid="23"><div class="markup markup--html" data-reactid="24"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="25"><h6 class="ds-h6">Unordered list</h6>
+<ul class="ds-c-list">
   <li>List item 1</li>
   <li>List item 2</li>
-</ul></div><details class="ds-u-margin-bottom--2" data-reactid="21"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="22">Code snippet</summary><pre class="language-markup" data-reactid="23"><code data-reactid="24"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ul</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-list<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</ul>
+<h6 class="ds-h6">Ordered list</h6>
+<ol class="ds-c-list">
+  <li>List item 1</li>
+  <li>List item 2</li>
+</ol></div><details class="ds-u-margin-bottom--2" data-reactid="26"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="27">Code snippet</summary><pre class="language-markup" data-reactid="28"><code data-reactid="29"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h6</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-h6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Unordered list<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h6</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ul</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-list<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>li</span><span class="token punctuation">></span></span>List item 1<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>li</span><span class="token punctuation">></span></span>List item 2<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>ul</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h6</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-h6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Ordered list<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h6</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ol</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-list<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>li</span><span class="token punctuation">></span></span>List item 1<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>li</span><span class="token punctuation">></span></span>List item 2<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>ul</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="25"><div class="c-markup__header" data-reactid="26"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="27"><!-- react-text: 28 -->Modifier: <!-- /react-text --><code data-reactid="29">ds-c-list--bare</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="30">Unstyled list (no <code>margin</code>, <code>padding</code> or <code>list-style</code>)</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="31"><ul class="ds-c-list ds-c-list--bare">
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>ol</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="30"><div class="c-markup__header" data-reactid="31"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="32"><!-- react-text: 33 -->Modifier: <!-- /react-text --><code data-reactid="34">ds-c-list--bare</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="35">Unstyled list (no <code>margin</code>, <code>padding</code> or <code>list-style</code>)</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="36"><h6 class="ds-h6">Unordered list</h6>
+<ul class="ds-c-list ds-c-list--bare">
   <li>List item 1</li>
   <li>List item 2</li>
-</ul></div><details class="ds-u-margin-bottom--2" data-reactid="32"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="33">Code snippet</summary><pre class="language-markup" data-reactid="34"><code data-reactid="35"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ul</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-list ds-c-list--bare<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</ul>
+<h6 class="ds-h6">Ordered list</h6>
+<ol class="ds-c-list ds-c-list--bare">
+  <li>List item 1</li>
+  <li>List item 2</li>
+</ol></div><details class="ds-u-margin-bottom--2" data-reactid="37"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="38">Code snippet</summary><pre class="language-markup" data-reactid="39"><code data-reactid="40"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h6</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-h6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Unordered list<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h6</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ul</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-list ds-c-list--bare<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>li</span><span class="token punctuation">></span></span>List item 1<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>li</span><span class="token punctuation">></span></span>List item 2<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>ul</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h6</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-h6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Ordered list<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h6</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ol</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-list ds-c-list--bare<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>li</span><span class="token punctuation">></span></span>List item 1<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>li</span><span class="token punctuation">></span></span>List item 2<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>ul</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></main></div></div></div>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>ol</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="41"><article class="ds-u-margin-y--6 l-content" data-reactid="42"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="43"><h2 id="when-to-use">When to use</h2>
+<ul>
+<li>Use an ordered list when you need to display text in some ranking, hierarchy, or series of steps.</li>
+<li>Use unordered lists to display text in no specific order.</li>
+</ul>
+<h2 id="when-to-consider-alternatives">When to consider alternatives</h2>
+<ul>
+<li>If you need to communicate long lists of narrative text.</li>
+</ul>
+<h2 id="guidance">Guidance</h2>
+<ul>
+<li>Use sentence case and begin lists with a capital letter.</li>
+<li>Use punctuation appropriate to the text. Do not leave sentences without periods.</li>
+</ul>
+<h2 id="learn-more">Learn more</h2>
+<ul>
+<li><a href="https://content-guide.18f.gov/punctuation/#bulleted-lists">18F Content Guide - Bulleted lists</a></li>
+</ul></div></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"List","description":"","reference":"components.list","referenceNumber":"3.5","referenceURI":"design-system/components/list","weight":0,"markup":"<ul class=\"ds-c-list {{modifier}}\">\n  <li>List item 1</li>\n  <li>List item 2</li>\n</ul>","source":{"filename":"components/List/List.scss","path":"packages/core/src/components/List/List.scss"},"depth":2,"modifiers":[{"name":".ds-c-list--bare","description":"Unstyled list (no <code>margin</code>, <code>padding</code> or <code>list-style</code>)","className":"ds-c-list--bare"}],"sections":[],"status":"prototype","parentReference":"components"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"List","description":"<p>Lists organize written information for users.</p>","reference":"components.list","referenceNumber":"3.5","referenceURI":"design-system/components/list","weight":0,"markup":"<h6 class=\"ds-h6\">Unordered list</h6>\n<ul class=\"ds-c-list {{modifier}}\">\n  <li>List item 1</li>\n  <li>List item 2</li>\n</ul>\n<h6 class=\"ds-h6\">Ordered list</h6>\n<ol class=\"ds-c-list {{modifier}}\">\n  <li>List item 1</li>\n  <li>List item 2</li>\n</ol>","source":{"filename":"components/List/List.scss","path":"packages/core/src/components/List/List.scss"},"depth":2,"modifiers":[{"name":".ds-c-list--bare","description":"Unstyled list (no <code>margin</code>, <code>padding</code> or <code>list-style</code>)","className":"ds-c-list--bare"}],"sections":[{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>Use an ordered list when you need to display text in some ranking, hierarchy, or series of steps.</li>\n<li>Use unordered lists to display text in no specific order.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>If you need to communicate long lists of narrative text.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Use sentence case and begin lists with a capital letter.</li>\n<li>Use punctuation appropriate to the text. Do not leave sentences without periods.</li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"https://content-guide.18f.gov/punctuation/#bulleted-lists\">18F Content Guide - Bulleted lists</a></li>\n</ul>","reference":"components.list.guidance","referenceNumber":"3.5.1","referenceURI":"design-system/components/list/guidance","weight":0,"markup":"","source":{"filename":"components/List/List.scss","path":"packages/core/src/components/List/List.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.list"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/typography/#lists","parentReference":"components"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/components/select/index.html b/docs/components/select/index.html
index 0c36e1f25a..98defbb281 100644
--- a/docs/components/select/index.html
+++ b/docs/components/select/index.html
@@ -2,44 +2,60 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Select - CMSgov Design System</title>
+  <title>Select - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="832658254"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-u-fill--warn ds-u-color--base" data-reactid="12">prototype</span><h1 class="ds-display" id="components.select" data-reactid="13">Select</h1><div class="ds-u-clearfix" data-reactid="14"></div><code class="ds-u-font-size--small" data-reactid="15">components/ChoiceList/Select.scss</code><p data-reactid="16"><a href="https://standards.usa.gov/components/form-controls/#dropdown" data-reactid="17">US Web Design Standard</a></p></heading><div data-reactid="18"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="19"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="20">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="21">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="22"><article class="ds-u-margin-y--6 l-content" data-reactid="23"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="24"><p>A select field allows users to select one option from a list.</p></div><section class="ds-u-margin-top--3" data-reactid="25"><div class="markup markup--html" data-reactid="26"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="27"><label class="ds-c-label ds-u-margin-top--0" for="options">Field label</label>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1696593002"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-c-badge--success" data-reactid="10">recommended</span><h1 class="ds-display" id="components.select" data-reactid="11">Select</h1><div class="ds-u-clearfix" data-reactid="12"></div><code class="ds-u-font-size--small" data-reactid="13">components/ChoiceList/Select.scss</code><p data-reactid="14"><a href="https://standards.usa.gov/components/form-controls/#dropdown" data-reactid="15">US Web Design Standard</a></p></heading><div data-reactid="16"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="17"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="18">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="19">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="20"><article class="ds-u-margin-y--6 l-content" data-reactid="21"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="22"><p>A select field allows users to select one option from a list.</p></div><section class="ds-u-margin-top--3" data-reactid="23"><div class="markup markup--html" data-reactid="24"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="25"><label class="ds-c-label ds-u-margin-top--0" for="options">Field label</label>
 <select class="ds-c-field ds-c-field--select" name="options" id="options">
-  <option value="value1">Option A</option>
-  <option value="value2">Option B</option>
-  <option value="value3">Option C</option>
+  <option value="1">Option 1</option>
+  <option value="2">Option 2</option>
+  <option value="3">Option 3</option>
+  <option value="4">Option 4</option>
+  <option value="5">Option 5</option>
+  <option value="6">Option 6</option>
+  <option value="7">Option 7</option>
 </select>
 <div class="ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2">
   <label class="ds-c-label ds-u-margin-top--0" for="options-inverse">Field label</label>
   <select class="ds-c-field ds-c-field--select ds-c-field--inverse" name="options-inverse" id="options-inverse">
-    <option value="value1">Option A</option>
-    <option value="value2">Option B</option>
-    <option value="value3">Option C</option>
+    <option value="1">Option 1</option>
+    <option value="2">Option 2</option>
+    <option value="3">Option 3</option>
+    <option value="4">Option 4</option>
+    <option value="5">Option 5</option>
+    <option value="6">Option 6</option>
+    <option value="7">Option 7</option>
   </select>
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="28"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="29">Code snippet</summary><pre class="language-markup" data-reactid="30"><code data-reactid="31"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label ds-u-margin-top--0<span class="token punctuation">"</span></span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>options<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Field label<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="26"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="27">Code snippet</summary><pre class="language-markup" data-reactid="28"><code data-reactid="29"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label ds-u-margin-top--0<span class="token punctuation">"</span></span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>options<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Field label<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>select</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field ds-c-field--select<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>options<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>options<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>value1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option A<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>value2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option B<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>value3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option C<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 1<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 2<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 3<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>4<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 4<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>5<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 5<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 6<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>7<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 7<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>select</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label ds-u-margin-top--0<span class="token punctuation">"</span></span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>options-inverse<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Field label<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>select</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field ds-c-field--select ds-c-field--inverse<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>options-inverse<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>options-inverse<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
-    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>value1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option A<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
-    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>value2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option B<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
-    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>value3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option C<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 1<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 2<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 3<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>4<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 4<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>5<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 5<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 6<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>7<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Option 7<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>select</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="32"><div data-reactid="33"><h1 class="ds-h1" id="components.select.react" data-reactid="34">React - <code>&#x3C;Select&#x3E;</code></h1><code class="ds-u-font-size--small" data-reactid="35">components/ChoiceList/Select</code></div><section data-reactid="36"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="37"><p>A <code>Select</code> component can be used to render an HTML <code>select</code> menu.
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="30"><div data-reactid="31"><h2 class="ds-h2" id="components.select.react" data-reactid="32"><code>&#x3C;Select&#x3E;</code></h2><code class="ds-u-font-size--small" data-reactid="33">components/ChoiceList/Select.jsx</code></div><section data-reactid="34"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="35"><p>A <code>Select</code> component can be used to render an HTML <code>select</code> menu.
 Any <em>undocumented</em> props that you pass to this component will be passed
 to the <code>select</code> element, so you can use this to set additional attributes if
 necessary.</p>
-</div><div class="markup markup--react" data-reactid="38"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="39"><select class="ds-c-field ds-c-field--select" id="select_select-demo_16" name="select-demo" data-reactid="40"><option value="1" data-reactid="41">Option 1</option><option selected="" value="2" data-reactid="42">Option 2</option><option value="3" data-reactid="43">Option 3</option></select></div><details class="ds-u-margin-bottom--2" data-reactid="44"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="45">Code snippet</summary><pre class="language-jsx" data-reactid="46"><code data-reactid="47"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Select</span>
+</div><div class="markup markup--react" data-reactid="36"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="37"><select class="ds-c-field ds-c-field--select" id="select_select-demo_16" name="select-demo" data-reactid="38"><option value="1" data-reactid="39">Option 1</option><option selected="" value="2" data-reactid="40">Option 2</option><option value="3" data-reactid="41">Option 3</option><option value="4" data-reactid="42">Option 4</option><option value="5" data-reactid="43">Option 5</option><option value="6" data-reactid="44">Option 6</option><option value="7" data-reactid="45">Option 7</option></select></div><details class="ds-u-margin-bottom--2" data-reactid="46"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="47">Code snippet</summary><pre class="language-jsx" data-reactid="48"><code data-reactid="49"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Select</span>
   <span class="token attr-name">defaultValue</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>2<span class="token punctuation">"</span></span>
   <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>select-demo<span class="token punctuation">"</span></span>
 <span class="token punctuation">></span></span>
@@ -52,25 +68,37 @@
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     Option <span class="token number">3</span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>Select</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="48">Props</h3><table class="ds-c-table" data-reactid="49"><thead data-reactid="50"><tr data-reactid="51"><td data-reactid="52">Name</td><td data-reactid="53">Type</td><td data-reactid="54">Default</td><td data-reactid="55">Description</td></tr></thead><tbody data-reactid="56"><tr data-reactid="57"><td data-reactid="58"><code class="ds-u-font-weight--bold" data-reactid="59">className</code></td><td data-reactid="60"><code data-reactid="61">string</code></td><td data-reactid="62"></td><td data-reactid="63"><div data-reactid="64"><p>Additional classes to be added to the root <code>select</code> element.</p>
-</div></td></tr><tr data-reactid="65"><td data-reactid="66"><code class="ds-u-font-weight--bold" data-reactid="67">defaultValue</code></td><td data-reactid="68"><code data-reactid="69">string</code></td><td data-reactid="70"></td><td data-reactid="71"><div data-reactid="72"><p>Sets the initial <code>selected</code> state and allows the user to select a different
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>4<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+    Option <span class="token number">4</span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>5<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+    Option <span class="token number">5</span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+    Option <span class="token number">6</span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>option</span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>7<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+    Option <span class="token number">7</span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>option</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>Select</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="50">Props</h3><table class="ds-c-table" data-reactid="51"><thead data-reactid="52"><tr data-reactid="53"><td data-reactid="54">Name</td><td data-reactid="55">Type</td><td data-reactid="56">Default</td><td data-reactid="57">Description</td></tr></thead><tbody data-reactid="58"><tr data-reactid="59"><td data-reactid="60"><code class="ds-u-font-weight--bold" data-reactid="61">className</code></td><td data-reactid="62"><code data-reactid="63">string</code></td><td data-reactid="64"></td><td data-reactid="65"><div data-reactid="66"><p>Additional classes to be added to the root <code>select</code> element.</p>
+</div></td></tr><tr data-reactid="67"><td data-reactid="68"><code class="ds-u-font-weight--bold" data-reactid="69">defaultValue</code></td><td data-reactid="70"><code data-reactid="71">string</code></td><td data-reactid="72"></td><td data-reactid="73"><div data-reactid="74"><p>Sets the initial <code>selected</code> state and allows the user to select a different
 option without also requiring an <code>onChange</code> event handler.</p>
-</div></td></tr><tr data-reactid="73"><td data-reactid="74"><code class="ds-u-font-weight--bold" data-reactid="75">disabled</code></td><td data-reactid="76"><code data-reactid="77">bool</code></td><td data-reactid="78"></td><td data-reactid="79"></td></tr><tr data-reactid="80"><td data-reactid="81"><code class="ds-u-font-weight--bold" data-reactid="82">id</code></td><td data-reactid="83"><code data-reactid="84">string</code></td><td data-reactid="85"></td><td data-reactid="86"><div data-reactid="87"><p>A unique ID to be used for the select field. A unique ID will be generated
+</div></td></tr><tr data-reactid="75"><td data-reactid="76"><code class="ds-u-font-weight--bold" data-reactid="77">disabled</code></td><td data-reactid="78"><code data-reactid="79">bool</code></td><td data-reactid="80"></td><td data-reactid="81"></td></tr><tr data-reactid="82"><td data-reactid="83"><code class="ds-u-font-weight--bold" data-reactid="84">id</code></td><td data-reactid="85"><code data-reactid="86">string</code></td><td data-reactid="87"></td><td data-reactid="88"><div data-reactid="89"><p>A unique ID to be used for the select field. A unique ID will be generated
 if one isn&#39;t provided.</p>
-</div></td></tr><tr data-reactid="88"><td data-reactid="89"><code class="ds-u-font-weight--bold" data-reactid="90">inversed</code></td><td data-reactid="91"><code data-reactid="92">bool</code></td><td data-reactid="93"></td><td data-reactid="94"><div data-reactid="95"><p>Applies the &quot;inverse&quot; UI theme</p>
-</div></td></tr><tr data-reactid="96"><td data-reactid="97"><code class="ds-u-font-weight--bold" data-reactid="98">multiple</code></td><td data-reactid="99"><code data-reactid="100">custom</code></td><td data-reactid="101"></td><td data-reactid="102"><div data-reactid="103"><p>Setting this prop to <code>true</code> will result in an error message due to
+</div></td></tr><tr data-reactid="90"><td data-reactid="91"><code class="ds-u-font-weight--bold" data-reactid="92">inversed</code></td><td data-reactid="93"><code data-reactid="94">bool</code></td><td data-reactid="95"></td><td data-reactid="96"><div data-reactid="97"><p>Applies the &quot;inverse&quot; UI theme</p>
+</div></td></tr><tr data-reactid="98"><td data-reactid="99"><code class="ds-u-font-weight--bold" data-reactid="100">multiple</code></td><td data-reactid="101"><code data-reactid="102">custom</code></td><td data-reactid="103"></td><td data-reactid="104"><div data-reactid="105"><p>Setting this prop to <code>true</code> will result in an error message due to
 accessibility concerns. See the usability guidelines for more info.</p>
-</div></td></tr><tr data-reactid="104"><td data-reactid="105"><code class="ds-u-font-weight--bold" data-reactid="106">name</code><p data-reactid="107"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="108">Required</span></p></td><td data-reactid="109"><code data-reactid="110">string</code></td><td data-reactid="111"></td><td data-reactid="112"></td></tr><tr data-reactid="113"><td data-reactid="114"><code class="ds-u-font-weight--bold" data-reactid="115">onBlur</code></td><td data-reactid="116"><code data-reactid="117">func</code></td><td data-reactid="118"></td><td data-reactid="119"></td></tr><tr data-reactid="120"><td data-reactid="121"><code class="ds-u-font-weight--bold" data-reactid="122">onChange</code></td><td data-reactid="123"><code data-reactid="124">func</code></td><td data-reactid="125"></td><td data-reactid="126"></td></tr><tr data-reactid="127"><td data-reactid="128"><code class="ds-u-font-weight--bold" data-reactid="129">value</code></td><td data-reactid="130"><code data-reactid="131">string</code></td><td data-reactid="132"></td><td data-reactid="133"><div data-reactid="134"><p>Setting this prop will render a read-only field and require an <code>onChange</code>
+</div></td></tr><tr data-reactid="106"><td data-reactid="107"><code class="ds-u-font-weight--bold" data-reactid="108">name</code><p data-reactid="109"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="110">Required</span></p></td><td data-reactid="111"><code data-reactid="112">string</code></td><td data-reactid="113"></td><td data-reactid="114"></td></tr><tr data-reactid="115"><td data-reactid="116"><code class="ds-u-font-weight--bold" data-reactid="117">onBlur</code></td><td data-reactid="118"><code data-reactid="119">func</code></td><td data-reactid="120"></td><td data-reactid="121"></td></tr><tr data-reactid="122"><td data-reactid="123"><code class="ds-u-font-weight--bold" data-reactid="124">onChange</code></td><td data-reactid="125"><code data-reactid="126">func</code></td><td data-reactid="127"></td><td data-reactid="128"></td></tr><tr data-reactid="129"><td data-reactid="130"><code class="ds-u-font-weight--bold" data-reactid="131">value</code></td><td data-reactid="132"><code data-reactid="133">string</code></td><td data-reactid="134"></td><td data-reactid="135"><div data-reactid="136"><p>Setting this prop will render a read-only field and require an <code>onChange</code>
 event handler if you&#39;d want to change its <code>selected</code> stated. Use
 <code>defaultValue</code> if you want the field to be mutable.</p>
-</div></td></tr></tbody></table></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="135"><div data-reactid="136"><h1 class="ds-h1" id="components.select.choicelist-react" data-reactid="137">React - <code>&#x3C;ChoiceList&#x3E;</code></h1><code class="ds-u-font-size--small" data-reactid="138">components/ChoiceList/ChoiceList</code></div><section data-reactid="139"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="140"><p>A <code>ChoiceList</code> component can be used to render a <code>select</code> menu, radio
-button group, or checkbox group, and their corresponding <code>label</code> or <code>legend</code>.</p>
+</div></td></tr></tbody></table></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="137"><div data-reactid="138"><h2 class="ds-h2" id="components.select.choicelist-react" data-reactid="139"><code>&#x3C;ChoiceList&#x3E;</code></h2><code class="ds-u-font-size--small" data-reactid="140">components/ChoiceList/ChoiceList.jsx</code></div><section data-reactid="141"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="142"><p>A <code>ChoiceList</code> component can be used to render a <code>select</code> menu, radio
+button group, or checkbox group.</p>
 <p>You can manually pass in the <code>type</code> prop, but the real power of this component
 is unleashed when you let it determine the type of fields for you. It takes
 into account accessibility and usability best practices, so you can pass in
-an array of choices and let it determine whether the choices should be
-presented as radio buttons, checkboxes, or a <code>select</code> menu.</p>
-</div><div class="markup markup--react" data-reactid="141"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="142"><div data-reactid="143"><fieldset class="ds-c-fieldset ds-u-margin-top--0" data-reactid="144"><legend class="ds-c-label" data-reactid="145"><span data-reactid="146">Radio example</span></legend><div data-reactid="147"><input type="radio" class="ds-c-choice" id="radio_choices_field_17" value="1" name="choices_field" data-reactid="148"/><label for="radio_choices_field_17" data-reactid="149">Choice 1</label></div><div data-reactid="150"><input type="radio" class="ds-c-choice" id="radio_choices_field_18" value="2" checked="" name="choices_field" data-reactid="151"/><label for="radio_choices_field_18" data-reactid="152">Choice 2</label></div><div data-reactid="153"><input type="radio" class="ds-c-choice" id="radio_choices_field_19" value="3" disabled="" name="choices_field" data-reactid="154"/><label for="radio_choices_field_19" data-reactid="155">Choice 3</label></div><div data-reactid="156"><input type="radio" class="ds-c-choice" id="radio_choices_field_20" value="4" name="choices_field" data-reactid="157"/><label for="radio_choices_field_20" data-reactid="158">Choice 4</label></div></fieldset><fieldset class="ds-c-fieldset" data-reactid="159"><legend class="ds-c-label" data-reactid="160"><span class="ds-u-font-weight--bold" data-reactid="161">Checkbox example</span><span class="ds-c-field__hint ds-u-color--error" id="undefined-message" role="alert" data-reactid="162">Example error message</span></legend><div data-reactid="163"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_21" value="1" name="multiple_choices_field" data-reactid="164"/><label for="checkbox_multiple_choices_field_21" data-reactid="165">Choice 1</label></div><div data-reactid="166"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_22" value="2" checked="" name="multiple_choices_field" data-reactid="167"/><label for="checkbox_multiple_choices_field_22" data-reactid="168">Choice 2</label></div><div data-reactid="169"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_23" value="3" disabled="" name="multiple_choices_field" data-reactid="170"/><label for="checkbox_multiple_choices_field_23" data-reactid="171">Choice 3</label></div><div data-reactid="172"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_24" value="4" name="multiple_choices_field" data-reactid="173"/><label for="checkbox_multiple_choices_field_24" data-reactid="174">Choice 4</label></div></fieldset><div data-reactid="175"><label class="ds-c-label" for="select_select_choices_field_25" data-reactid="176"><span data-reactid="177">Select example</span><span class="ds-c-field__hint" data-reactid="178">Example hint text</span></label><select class="ds-c-field ds-c-field--select" id="select_select_choices_field_25" name="select_choices_field" data-reactid="179"><option value="1" data-reactid="180">Choice 1</option><option selected="" value="2" data-reactid="181">Choice 2</option><option value="3" data-reactid="182">Choice 3</option><option value="4" data-reactid="183">Choice 4</option><option value="5" data-reactid="184">Choice 5</option><option value="6" data-reactid="185">Choice 6</option><option value="7" data-reactid="186">Choice 7</option><option value="8" data-reactid="187">Choice 8</option></select></div><div class="ds-base--inverse ds-u-margin-top--4 ds-u-padding--1" data-reactid="188"><div data-reactid="189"><label class="ds-c-label ds-u-margin-top--0" for="select_select_choices_field_inverse_26" data-reactid="190"><span data-reactid="191">Select example</span><span class="ds-c-field__hint ds-c-field__hint--inverse" data-reactid="192">Example hint text</span></label><select class="ds-c-field ds-c-field--select ds-c-field--inverse" id="select_select_choices_field_inverse_26" name="select_choices_field_inverse" data-reactid="193"><option value="1" data-reactid="194">Choice 1</option><option selected="" value="2" data-reactid="195">Choice 2</option><option value="3" data-reactid="196">Choice 3</option><option value="4" data-reactid="197">Choice 4</option><option value="5" data-reactid="198">Choice 5</option><option value="6" data-reactid="199">Choice 6</option><option value="7" data-reactid="200">Choice 7</option><option value="8" data-reactid="201">Choice 8</option></select></div></div></div></div><details class="ds-u-margin-bottom--2" data-reactid="202"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="203">Code snippet</summary><pre class="language-jsx" data-reactid="204"><code data-reactid="205"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">></span></span>
+an array of choices and let it determine what type of field would be best for
+the user.</p>
+</div><div class="markup markup--react" data-reactid="143"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="144"><div data-reactid="145"><fieldset class="ds-c-fieldset ds-u-margin-top--0" data-reactid="146"><legend class="ds-c-label" data-reactid="147"><span data-reactid="148">Radio example</span></legend><div data-reactid="149"><input type="radio" class="ds-c-choice" id="radio_choices_field_17" value="1" name="choices_field" data-reactid="150"/><label for="radio_choices_field_17" data-reactid="151">Choice 1</label></div><div data-reactid="152"><input type="radio" class="ds-c-choice" id="radio_choices_field_18" value="2" checked="" name="choices_field" data-reactid="153"/><label for="radio_choices_field_18" data-reactid="154">Choice 2</label></div><div data-reactid="155"><input type="radio" class="ds-c-choice" id="radio_choices_field_19" value="3" disabled="" name="choices_field" data-reactid="156"/><label for="radio_choices_field_19" data-reactid="157">Choice 3</label></div><div data-reactid="158"><input type="radio" class="ds-c-choice" id="radio_choices_field_20" value="4" name="choices_field" data-reactid="159"/><label for="radio_choices_field_20" data-reactid="160">Choice 4</label></div></fieldset><fieldset class="ds-c-fieldset" data-reactid="161"><legend class="ds-c-label" data-reactid="162"><span class="ds-u-font-weight--bold" data-reactid="163">Checkbox example</span><span class="ds-c-field__hint ds-u-color--error" id="undefined-message" role="alert" data-reactid="164">Example error message</span></legend><div data-reactid="165"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_21" value="1" name="multiple_choices_field" data-reactid="166"/><label for="checkbox_multiple_choices_field_21" data-reactid="167">Choice 1</label></div><div data-reactid="168"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_22" value="2" checked="" name="multiple_choices_field" data-reactid="169"/><label for="checkbox_multiple_choices_field_22" data-reactid="170">Choice 2</label></div><div data-reactid="171"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_23" value="3" disabled="" name="multiple_choices_field" data-reactid="172"/><label for="checkbox_multiple_choices_field_23" data-reactid="173">Choice 3</label></div><div data-reactid="174"><input type="checkbox" class="ds-c-choice" id="checkbox_multiple_choices_field_24" value="4" name="multiple_choices_field" data-reactid="175"/><label for="checkbox_multiple_choices_field_24" data-reactid="176">Choice 4</label></div></fieldset><div data-reactid="177"><label class="ds-c-label" for="select_select_choices_field_25" data-reactid="178"><span data-reactid="179">Select example</span><span class="ds-c-field__hint" data-reactid="180">Example hint text</span></label><select class="ds-c-field ds-c-field--select" id="select_select_choices_field_25" name="select_choices_field" data-reactid="181"><option value="1" data-reactid="182">Choice 1</option><option selected="" value="2" data-reactid="183">Choice 2</option><option value="3" data-reactid="184">Choice 3</option><option value="4" data-reactid="185">Choice 4</option><option value="5" data-reactid="186">Choice 5</option><option value="6" data-reactid="187">Choice 6</option><option value="7" data-reactid="188">Choice 7</option><option value="8" data-reactid="189">Choice 8</option></select></div><div class="ds-base--inverse ds-u-margin-top--4 ds-u-padding--1" data-reactid="190"><div data-reactid="191"><label class="ds-c-label ds-u-margin-top--0" for="select_select_choices_field_inverse_26" data-reactid="192"><span data-reactid="193">Select example</span><span class="ds-c-field__hint ds-c-field__hint--inverse" data-reactid="194">Example hint text</span></label><select class="ds-c-field ds-c-field--select ds-c-field--inverse" id="select_select_choices_field_inverse_26" name="select_choices_field_inverse" data-reactid="195"><option value="1" data-reactid="196">Choice 1</option><option selected="" value="2" data-reactid="197">Choice 2</option><option value="3" data-reactid="198">Choice 3</option><option value="4" data-reactid="199">Choice 4</option><option value="5" data-reactid="200">Choice 5</option><option value="6" data-reactid="201">Choice 6</option><option value="7" data-reactid="202">Choice 7</option><option value="8" data-reactid="203">Choice 8</option></select></div></div></div></div><details class="ds-u-margin-bottom--2" data-reactid="204"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="205">Code snippet</summary><pre class="language-jsx" data-reactid="206"><code data-reactid="207"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ChoiceList</span>
     <span class="token attr-name">choices</span><span class="token script language-javascript"><span class="token punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">[</span>
       <span class="token punctuation">{</span>
@@ -206,48 +234,63 @@
       <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>select_choices_field_inverse<span class="token punctuation">"</span></span>
     <span class="token punctuation">/></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="206">Props</h3><table class="ds-c-table" data-reactid="207"><thead data-reactid="208"><tr data-reactid="209"><td data-reactid="210">Name</td><td data-reactid="211">Type</td><td data-reactid="212">Default</td><td data-reactid="213">Description</td></tr></thead><tbody data-reactid="214"><tr data-reactid="215"><td data-reactid="216"><code class="ds-u-font-weight--bold" data-reactid="217">choices</code><p data-reactid="218"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="219">Required</span></p></td><td data-reactid="220"><code data-reactid="221">arrayOf[{checked, defaultChecked, disabled, label, value}]</code></td><td data-reactid="222"></td><td data-reactid="223"><div data-reactid="224"><p>The list of choices to be rendered. The number of choices you pass in may
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="208">Props</h3><table class="ds-c-table" data-reactid="209"><thead data-reactid="210"><tr data-reactid="211"><td data-reactid="212">Name</td><td data-reactid="213">Type</td><td data-reactid="214">Default</td><td data-reactid="215">Description</td></tr></thead><tbody data-reactid="216"><tr data-reactid="217"><td data-reactid="218"><code class="ds-u-font-weight--bold" data-reactid="219">choices</code><p data-reactid="220"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="221">Required</span></p></td><td data-reactid="222"><code data-reactid="223">arrayOf[{checked, defaultChecked, disabled, label, value}]</code></td><td data-reactid="224"></td><td data-reactid="225"><div data-reactid="226"><p>The list of choices to be rendered. The number of choices you pass in may
 affect the type of field(s) rendered. See <code>type</code> for more info.</p>
-</div></td></tr><tr data-reactid="225"><td data-reactid="226"><code class="ds-u-font-weight--bold" data-reactid="227">className</code></td><td data-reactid="228"><code data-reactid="229">string</code></td><td data-reactid="230"></td><td data-reactid="231"><div data-reactid="232"><p>Additional classes to be added to the root element.</p>
-</div></td></tr><tr data-reactid="233"><td data-reactid="234"><code class="ds-u-font-weight--bold" data-reactid="235">disabled</code></td><td data-reactid="236"><code data-reactid="237">bool</code></td><td data-reactid="238"></td><td data-reactid="239"><div data-reactid="240"><p>Disables the entire field.</p>
-</div></td></tr><tr data-reactid="241"><td data-reactid="242"><code class="ds-u-font-weight--bold" data-reactid="243">errorMessage</code></td><td data-reactid="244"><code data-reactid="245">string</code></td><td data-reactid="246"></td><td data-reactid="247"></td></tr><tr data-reactid="248"><td data-reactid="249"><code class="ds-u-font-weight--bold" data-reactid="250">hint</code></td><td data-reactid="251"><code data-reactid="252">node</code></td><td data-reactid="253"></td><td data-reactid="254"><div data-reactid="255"><p>Hint text</p>
-</div></td></tr><tr data-reactid="256"><td data-reactid="257"><code class="ds-u-font-weight--bold" data-reactid="258">inversed</code></td><td data-reactid="259"><code data-reactid="260">bool</code></td><td data-reactid="261"></td><td data-reactid="262"><div data-reactid="263"><p>Applies the &quot;inverse&quot; UI theme</p>
-</div></td></tr><tr data-reactid="264"><td data-reactid="265"><code class="ds-u-font-weight--bold" data-reactid="266">label</code><p data-reactid="267"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="268">Required</span></p></td><td data-reactid="269"><code data-reactid="270">node</code></td><td data-reactid="271"></td><td data-reactid="272"><div data-reactid="273"><p>The label for the entire list of choices</p>
-</div></td></tr><tr data-reactid="274"><td data-reactid="275"><code class="ds-u-font-weight--bold" data-reactid="276">labelClassName</code></td><td data-reactid="277"><code data-reactid="278">string</code></td><td data-reactid="279"></td><td data-reactid="280"><div data-reactid="281"><p>Additional classes to be added to the <code>FormLabel</code>.</p>
-</div></td></tr><tr data-reactid="282"><td data-reactid="283"><code class="ds-u-font-weight--bold" data-reactid="284">multiple</code></td><td data-reactid="285"><code data-reactid="286">bool</code></td><td data-reactid="287"></td><td data-reactid="288"><div data-reactid="289"><p>Allows the user to select multiple choices. Setting this to <code>true</code> results
+</div></td></tr><tr data-reactid="227"><td data-reactid="228"><code class="ds-u-font-weight--bold" data-reactid="229">className</code></td><td data-reactid="230"><code data-reactid="231">string</code></td><td data-reactid="232"></td><td data-reactid="233"><div data-reactid="234"><p>Additional classes to be added to the root element.</p>
+</div></td></tr><tr data-reactid="235"><td data-reactid="236"><code class="ds-u-font-weight--bold" data-reactid="237">disabled</code></td><td data-reactid="238"><code data-reactid="239">bool</code></td><td data-reactid="240"></td><td data-reactid="241"><div data-reactid="242"><p>Disables the entire field.</p>
+</div></td></tr><tr data-reactid="243"><td data-reactid="244"><code class="ds-u-font-weight--bold" data-reactid="245">errorMessage</code></td><td data-reactid="246"><code data-reactid="247">string</code></td><td data-reactid="248"></td><td data-reactid="249"></td></tr><tr data-reactid="250"><td data-reactid="251"><code class="ds-u-font-weight--bold" data-reactid="252">hint</code></td><td data-reactid="253"><code data-reactid="254">node</code></td><td data-reactid="255"></td><td data-reactid="256"><div data-reactid="257"><p>Hint text</p>
+</div></td></tr><tr data-reactid="258"><td data-reactid="259"><code class="ds-u-font-weight--bold" data-reactid="260">inversed</code></td><td data-reactid="261"><code data-reactid="262">bool</code></td><td data-reactid="263"></td><td data-reactid="264"><div data-reactid="265"><p>Applies the &quot;inverse&quot; UI theme</p>
+</div></td></tr><tr data-reactid="266"><td data-reactid="267"><code class="ds-u-font-weight--bold" data-reactid="268">label</code><p data-reactid="269"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="270">Required</span></p></td><td data-reactid="271"><code data-reactid="272">node</code></td><td data-reactid="273"></td><td data-reactid="274"><div data-reactid="275"><p>The label for the entire list of choices</p>
+</div></td></tr><tr data-reactid="276"><td data-reactid="277"><code class="ds-u-font-weight--bold" data-reactid="278">labelClassName</code></td><td data-reactid="279"><code data-reactid="280">string</code></td><td data-reactid="281"></td><td data-reactid="282"><div data-reactid="283"><p>Additional classes to be added to the <code>FormLabel</code>.</p>
+</div></td></tr><tr data-reactid="284"><td data-reactid="285"><code class="ds-u-font-weight--bold" data-reactid="286">multiple</code></td><td data-reactid="287"><code data-reactid="288">bool</code></td><td data-reactid="289"></td><td data-reactid="290"><div data-reactid="291"><p>Allows the user to select multiple choices. Setting this to <code>true</code> results
 in a list of checkbox fields to be rendered.</p>
-</div></td></tr><tr data-reactid="290"><td data-reactid="291"><code class="ds-u-font-weight--bold" data-reactid="292">name</code><p data-reactid="293"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="294">Required</span></p></td><td data-reactid="295"><code data-reactid="296">string</code></td><td data-reactid="297"></td><td data-reactid="298"></td></tr><tr data-reactid="299"><td data-reactid="300"><code class="ds-u-font-weight--bold" data-reactid="301">onBlur</code></td><td data-reactid="302"><code data-reactid="303">func</code></td><td data-reactid="304"></td><td data-reactid="305"></td></tr><tr data-reactid="306"><td data-reactid="307"><code class="ds-u-font-weight--bold" data-reactid="308">onChange</code></td><td data-reactid="309"><code data-reactid="310">func</code></td><td data-reactid="311"></td><td data-reactid="312"></td></tr><tr data-reactid="313"><td data-reactid="314"><code class="ds-u-font-weight--bold" data-reactid="315">type</code></td><td data-reactid="316"><code data-reactid="317">&#x27;checkbox&#x27;, &#x27;radio&#x27;, &#x27;select&#x27;</code></td><td data-reactid="318"></td><td data-reactid="319"><div data-reactid="320"><p>You can manually set the <code>type</code> if you prefer things to be less magical.
+</div></td></tr><tr data-reactid="292"><td data-reactid="293"><code class="ds-u-font-weight--bold" data-reactid="294">name</code><p data-reactid="295"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="296">Required</span></p></td><td data-reactid="297"><code data-reactid="298">string</code></td><td data-reactid="299"></td><td data-reactid="300"></td></tr><tr data-reactid="301"><td data-reactid="302"><code class="ds-u-font-weight--bold" data-reactid="303">onBlur</code></td><td data-reactid="304"><code data-reactid="305">func</code></td><td data-reactid="306"></td><td data-reactid="307"></td></tr><tr data-reactid="308"><td data-reactid="309"><code class="ds-u-font-weight--bold" data-reactid="310">onChange</code></td><td data-reactid="311"><code data-reactid="312">func</code></td><td data-reactid="313"></td><td data-reactid="314"></td></tr><tr data-reactid="315"><td data-reactid="316"><code class="ds-u-font-weight--bold" data-reactid="317">type</code></td><td data-reactid="318"><code data-reactid="319">&#x27;checkbox&#x27;, &#x27;radio&#x27;, &#x27;select&#x27;</code></td><td data-reactid="320"></td><td data-reactid="321"><div data-reactid="322"><p>You can manually set the <code>type</code> if you prefer things to be less magical.
 Otherwise, the type will be inferred by the other <code>props</code>, based
 on what&#39;s best for accessibility and usability. If <code>multiple</code> is <code>true</code>, then
 <code>checkbox</code> fields will be rendered. If less than 10 choices are passed in,
 then <code>radio</code> buttons will be rendered.</p>
-</div></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="321"><article class="ds-u-margin-y--6 l-content" data-reactid="322"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="323"><h2 id="accessibility">Accessibility</h2>
-<ul>
-<li>Make sure your dropdown has a label. Don’t replace it with the default menu option (for example, removing the “State” label and just having the dropdown read “Select a state” by default).</li>
-<li>Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Auto-submission disrupts screen readers because they select each option as they read them.</li>
-</ul>
-<h2 id="usability">Usability</h2>
-<h3 id="when-to-use">When to use</h3>
+</div></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="323"><article class="ds-u-margin-y--6 l-content" data-reactid="324"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="325"><h3 id="when-to-use">When to use</h3>
 <ul>
 <li>Use sparingly — only when a user needs to choose from about seven to 15 possible options and you have limited space to display the options.</li>
 </ul>
-<h3 id="when-to-consider-something-else">When to consider something else</h3>
+<h3 id="when-to-consider-alternatives">When to consider alternatives</h3>
 <ul>
-<li>If the list of options is very short. Use radio buttons instead.</li>
-<li>If the list of options is very long. Let users type the same information into a text input that suggests possible options instead.</li>
+<li>If the list of options is short. Use radio or checkboxes buttons instead.</li>
+<li>If the list of options is very long. Let users type the same information into a text input that suggests possible options instead. Long lists can sometimes be broken into multiple shorter lists by asking a few questions up-front to filter out options.</li>
 <li>If you need to allow users to select more than one option at once. Users often don’t understand how to select multiple items from dropdowns. Use checkboxes instead.</li>
+<li>If the data is highly familiar to users, such as the day, month, or year of their birth.</li>
 </ul>
-<h3 id="guidance">Guidance</h3>
+<h2 id="guidance">Guidance</h2>
 <ul>
+<li>Choose a sensible order for the options to enable visual scanning of the lists.</li>
 <li>Test dropdowns thoroughly with members of your target audience. Several usability experts suggest they should be the “UI of last resort.” Many users find them confusing and difficult to use.</li>
 <li>Avoid making options in one dropdown menu change based on the input to another. Users often don’t understand how selecting an item in one impacts another.</li>
 <li>When most users will (or should) pick a particular option, make it the default: <code>&lt;option selected=&quot;selected&quot;&gt;Default&lt;/option&gt;</code></li>
 <li>Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Offer a “submit” button at the end of the form instead. Users often change their choices multiple times. Auto-submission is also less accessible.</li>
+</ul>
+<p><strong><a href="/design-system/guidelines/forms/">View the &quot;Forms&quot; guidelines for additional guidance and best practices.</a></strong></p>
+<h2 id="accessibility">Accessibility</h2>
+<ul>
+<li>Make sure your dropdown has a label. Don’t replace it with the default menu option (for example, removing the “State” label and just having the dropdown read “Select a state” by default).</li>
+<li>Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Auto-submission disrupts screen readers because they select each option as they read them.</li>
+<li>On some devices the list of options cannot be zoomed, which means that some people with visual impairments cannot use them.</li>
+</ul>
+<h2 id="related-patterns">Related patterns</h2>
+<ul>
+<li><a href="/design-system/components/choice">Checkbox and Radio</a></li>
+<li><a href="/design-system/components/text-field">Text field</a></li>
+</ul>
+<h2 id="learn-more">Learn more</h2>
+<ul>
+<li><a href="/design-system/guidelines/forms/">Form Guidelines</a></li>
+<li><a href="https://designnotes.blog.gov.uk/2013/12/05/asking-for-a-date-of-birth/">Asking for a date of birth</a></li>
+<li><a href="http://www.formsthatwork.com/files/Articles/dropdown.pdf">Four steps for choosing form elements on the Web (PDF)</a></li>
+<li><a href="https://www.nngroup.com/articles/drop-down-menus/">Dropdowns: Design Guidelines</a></li>
 </ul></div></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Select","description":"<p>A select field allows users to select one option from a list.</p>","reference":"components.select","referenceNumber":"3.6","referenceURI":"design-system/components/select","weight":0,"markup":"<label class=\"ds-c-label ds-u-margin-top--0\" for=\"options\">Field label</label>\n<select class=\"ds-c-field ds-c-field--select\" name=\"options\" id=\"options\">\n  <option value=\"value1\">Option A</option>\n  <option value=\"value2\">Option B</option>\n  <option value=\"value3\">Option C</option>\n</select>\n<div class=\"ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2\">\n  <label class=\"ds-c-label ds-u-margin-top--0\" for=\"options-inverse\">Field label</label>\n  <select class=\"ds-c-field ds-c-field--select ds-c-field--inverse\" name=\"options-inverse\" id=\"options-inverse\">\n    <option value=\"value1\">Option A</option>\n    <option value=\"value2\">Option B</option>\n    <option value=\"value3\">Option C</option>\n  </select>\n</div>","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":2,"modifiers":[],"sections":[{"header":"React - <code>&#x3C;Select&#x3E;</code>","description":"","reference":"components.select.react","referenceNumber":"3.6.3","referenceURI":"design-system/components/select/react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Select","parentReference":"components.select"},{"header":"React - <code>&#x3C;ChoiceList&#x3E;</code>","description":"","reference":"components.select.choicelist-react","referenceNumber":"3.6.1","referenceURI":"design-system/components/select/choicelist-react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"ChoiceList","parentReference":"components.select"},{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Make sure your dropdown has a label. Don’t replace it with the default menu option (for example, removing the “State” label and just having the dropdown read “Select a state” by default).</li>\n<li>Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Auto-submission disrupts screen readers because they select each option as they read them.</li>\n</ul>\n<h2 id=\"usability\">Usability</h2>\n<h3 id=\"when-to-use\">When to use</h3>\n<ul>\n<li>Use sparingly — only when a user needs to choose from about seven to 15 possible options and you have limited space to display the options.</li>\n</ul>\n<h3 id=\"when-to-consider-something-else\">When to consider something else</h3>\n<ul>\n<li>If the list of options is very short. Use radio buttons instead.</li>\n<li>If the list of options is very long. Let users type the same information into a text input that suggests possible options instead.</li>\n<li>If you need to allow users to select more than one option at once. Users often don’t understand how to select multiple items from dropdowns. Use checkboxes instead.</li>\n</ul>\n<h3 id=\"guidance\">Guidance</h3>\n<ul>\n<li>Test dropdowns thoroughly with members of your target audience. Several usability experts suggest they should be the “UI of last resort.” Many users find them confusing and difficult to use.</li>\n<li>Avoid making options in one dropdown menu change based on the input to another. Users often don’t understand how selecting an item in one impacts another.</li>\n<li>When most users will (or should) pick a particular option, make it the default: <code>&lt;option selected=&quot;selected&quot;&gt;Default&lt;/option&gt;</code></li>\n<li>Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Offer a “submit” button at the end of the form instead. Users often change their choices multiple times. Auto-submission is also less accessible.</li>\n</ul>","reference":"components.select.guidance","referenceNumber":"3.6.2","referenceURI":"design-system/components/select/guidance","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.select"}],"status":"prototype","uswdsUrl":"https://standards.usa.gov/components/form-controls/#dropdown","parentReference":"components"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Select","description":"<p>A select field allows users to select one option from a list.</p>","reference":"components.select","referenceNumber":"3.6","referenceURI":"design-system/components/select","weight":0,"markup":"<label class=\"ds-c-label ds-u-margin-top--0\" for=\"options\">Field label</label>\n<select class=\"ds-c-field ds-c-field--select\" name=\"options\" id=\"options\">\n  <option value=\"1\">Option 1</option>\n  <option value=\"2\">Option 2</option>\n  <option value=\"3\">Option 3</option>\n  <option value=\"4\">Option 4</option>\n  <option value=\"5\">Option 5</option>\n  <option value=\"6\">Option 6</option>\n  <option value=\"7\">Option 7</option>\n</select>\n<div class=\"ds-base ds-base--inverse ds-u-padding--2 ds-u-margin-top--2\">\n  <label class=\"ds-c-label ds-u-margin-top--0\" for=\"options-inverse\">Field label</label>\n  <select class=\"ds-c-field ds-c-field--select ds-c-field--inverse\" name=\"options-inverse\" id=\"options-inverse\">\n    <option value=\"1\">Option 1</option>\n    <option value=\"2\">Option 2</option>\n    <option value=\"3\">Option 3</option>\n    <option value=\"4\">Option 4</option>\n    <option value=\"5\">Option 5</option>\n    <option value=\"6\">Option 6</option>\n    <option value=\"7\">Option 7</option>\n  </select>\n</div>","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":2,"modifiers":[],"sections":[{"header":"<code>&#x3C;Select&#x3E;</code>","description":"","reference":"components.select.react","referenceNumber":"3.6.3","referenceURI":"design-system/components/select/react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Select","parentReference":"components.select"},{"header":"<code>&#x3C;ChoiceList&#x3E;</code>","description":"","reference":"components.select.choicelist-react","referenceNumber":"3.6.1","referenceURI":"design-system/components/select/choicelist-react","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"ChoiceList","parentReference":"components.select"},{"header":"---","description":"<h3 id=\"when-to-use\">When to use</h3>\n<ul>\n<li>Use sparingly — only when a user needs to choose from about seven to 15 possible options and you have limited space to display the options.</li>\n</ul>\n<h3 id=\"when-to-consider-alternatives\">When to consider alternatives</h3>\n<ul>\n<li>If the list of options is short. Use radio or checkboxes buttons instead.</li>\n<li>If the list of options is very long. Let users type the same information into a text input that suggests possible options instead. Long lists can sometimes be broken into multiple shorter lists by asking a few questions up-front to filter out options.</li>\n<li>If you need to allow users to select more than one option at once. Users often don’t understand how to select multiple items from dropdowns. Use checkboxes instead.</li>\n<li>If the data is highly familiar to users, such as the day, month, or year of their birth.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Choose a sensible order for the options to enable visual scanning of the lists.</li>\n<li>Test dropdowns thoroughly with members of your target audience. Several usability experts suggest they should be the “UI of last resort.” Many users find them confusing and difficult to use.</li>\n<li>Avoid making options in one dropdown menu change based on the input to another. Users often don’t understand how selecting an item in one impacts another.</li>\n<li>When most users will (or should) pick a particular option, make it the default: <code>&lt;option selected=&quot;selected&quot;&gt;Default&lt;/option&gt;</code></li>\n<li>Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Offer a “submit” button at the end of the form instead. Users often change their choices multiple times. Auto-submission is also less accessible.</li>\n</ul>\n<p><strong><a href=\"/design-system/guidelines/forms/\">View the &quot;Forms&quot; guidelines for additional guidance and best practices.</a></strong></p>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Make sure your dropdown has a label. Don’t replace it with the default menu option (for example, removing the “State” label and just having the dropdown read “Select a state” by default).</li>\n<li>Don’t use JavaScript to automatically submit the form (or do anything else) when an option is selected. Auto-submission disrupts screen readers because they select each option as they read them.</li>\n<li>On some devices the list of options cannot be zoomed, which means that some people with visual impairments cannot use them.</li>\n</ul>\n<h2 id=\"related-patterns\">Related patterns</h2>\n<ul>\n<li><a href=\"/design-system/components/choice\">Checkbox and Radio</a></li>\n<li><a href=\"/design-system/components/text-field\">Text field</a></li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"/design-system/guidelines/forms/\">Form Guidelines</a></li>\n<li><a href=\"https://designnotes.blog.gov.uk/2013/12/05/asking-for-a-date-of-birth/\">Asking for a date of birth</a></li>\n<li><a href=\"http://www.formsthatwork.com/files/Articles/dropdown.pdf\">Four steps for choosing form elements on the Web (PDF)</a></li>\n<li><a href=\"https://www.nngroup.com/articles/drop-down-menus/\">Dropdowns: Design Guidelines</a></li>\n</ul>","reference":"components.select.guidance","referenceNumber":"3.6.2","referenceURI":"design-system/components/select/guidance","weight":0,"markup":"","source":{"filename":"components/ChoiceList/Select.scss","path":"packages/core/src/components/ChoiceList/Select.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.select"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/form-controls/#dropdown","parentReference":"components"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/components/table/index.html b/docs/components/table/index.html
index 7ece3057c6..ee063c44dd 100644
--- a/docs/components/table/index.html
+++ b/docs/components/table/index.html
@@ -2,70 +2,164 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Table - CMSgov Design System</title>
+  <title>Table - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="775420871"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-u-fill--warn ds-u-color--base" data-reactid="12">prototype</span><h1 class="ds-display" id="components.table" data-reactid="13">Table</h1><div class="ds-u-clearfix" data-reactid="14"></div><code class="ds-u-font-size--small" data-reactid="15">components/Table/Table.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="16"><article class="ds-u-margin-y--6 l-content" data-reactid="17"><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20"><table class="ds-c-table">
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1895142297"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-c-badge--success" data-reactid="10">recommended</span><h1 class="ds-display" id="components.table" data-reactid="11">Table</h1><div class="ds-u-clearfix" data-reactid="12"></div><code class="ds-u-font-size--small" data-reactid="13">components/Table/Table.scss</code><p data-reactid="14"><a href="https://standards.usa.gov/components/tables/" data-reactid="15">US Web Design Standard</a></p></heading><div data-reactid="16"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="17"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="18">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="19">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="20"><article class="ds-u-margin-y--6 l-content" data-reactid="21"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="22"><p>Tables show tabular data in columns and rows.</p></div><section class="ds-u-margin-top--3" data-reactid="23"><div class="markup markup--html" data-reactid="24"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="25"><table class="ds-c-table">
   <thead>
     <tr>
       <th>Name</th>
+      <th class="ds-u-text-align--right">Rate</th>
       <th>Favorite fruit</th>
     </tr>
   </thead>
   <tbody>
     <tr>
       <td>Fred</td>
+      <td class="ds-u-text-align--right">51.25%</td>
       <td>Apples</td>
     </tr>
+    <tr>
+      <td>Tamara</td>
+      <td class="ds-u-text-align--right">98.70%</td>
+      <td>Strawberries</td>
+    </tr>
   </tbody>
-</table></div><details class="ds-u-margin-bottom--2" data-reactid="21"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="22">Code snippet</summary><pre class="language-markup" data-reactid="23"><code data-reactid="24"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>table</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-table<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</table></div><details class="ds-u-margin-bottom--2" data-reactid="26"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="27">Code snippet</summary><pre class="language-markup" data-reactid="28"><code data-reactid="29"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>table</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-table<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>thead</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tr</span><span class="token punctuation">></span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span><span class="token punctuation">></span></span>Name<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-align--right<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Rate<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">></span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span><span class="token punctuation">></span></span>Favorite fruit<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tr</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>thead</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tbody</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tr</span><span class="token punctuation">></span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">></span></span>Fred<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-align--right<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>51.25%<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">></span></span>Apples<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tr</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tr</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">></span></span>Tamara<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-align--right<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>98.70%<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">></span></span>Strawberries<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tr</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tbody</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>table</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="25"><div class="c-markup__header" data-reactid="26"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="27"><!-- react-text: 28 -->Modifier: <!-- /react-text --><code data-reactid="29">ds-c-table--borderless</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="30">Borderless table</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="31"><table class="ds-c-table ds-c-table--borderless">
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>table</span><span class="token punctuation">></span></span></code></pre></details></div><div class="markup markup--html" data-reactid="30"><div class="c-markup__header" data-reactid="31"><h4 class="ds-u-font-size--h5 ds-u-margin-bottom--0" data-reactid="32"><!-- react-text: 33 -->Modifier: <!-- /react-text --><code data-reactid="34">ds-c-table--borderless</code></h4><p class="ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted" data-reactid="35">Borderless table</p></div><div class="ds-u-border--1 ds-u-padding--1" data-reactid="36"><table class="ds-c-table ds-c-table--borderless">
   <thead>
     <tr>
       <th>Name</th>
+      <th class="ds-u-text-align--right">Rate</th>
       <th>Favorite fruit</th>
     </tr>
   </thead>
   <tbody>
     <tr>
       <td>Fred</td>
+      <td class="ds-u-text-align--right">51.25%</td>
       <td>Apples</td>
     </tr>
+    <tr>
+      <td>Tamara</td>
+      <td class="ds-u-text-align--right">98.70%</td>
+      <td>Strawberries</td>
+    </tr>
   </tbody>
-</table></div><details class="ds-u-margin-bottom--2" data-reactid="32"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="33">Code snippet</summary><pre class="language-markup" data-reactid="34"><code data-reactid="35"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>table</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-table ds-c-table--borderless<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</table></div><details class="ds-u-margin-bottom--2" data-reactid="37"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="38">Code snippet</summary><pre class="language-markup" data-reactid="39"><code data-reactid="40"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>table</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-table ds-c-table--borderless<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>thead</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tr</span><span class="token punctuation">></span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span><span class="token punctuation">></span></span>Name<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-align--right<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Rate<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">></span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span><span class="token punctuation">></span></span>Favorite fruit<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tr</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>thead</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tbody</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tr</span><span class="token punctuation">></span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">></span></span>Fred<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-align--right<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>51.25%<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">></span></span>Apples<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tr</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tr</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">></span></span>Tamara<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-align--right<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>98.70%<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">></span></span>Strawberries<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tr</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tbody</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>table</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="41"><div data-reactid="42"><h2 class="ds-h2" id="components.table.complex" data-reactid="43">Table with two headers and a caption</h2></div><section class="ds-u-margin-top--3" data-reactid="44"><div class="markup markup--html" data-reactid="45"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="46"><table class="ds-c-table">
+  <caption class="ds-c-table__caption">Household members</caption>
+  <thead>
+    <tr>
+      <th scope="col">Name</th>
+      <th scope="col">Street</th>
+      <th scope="col">Employer</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <th scope="row">John Doe</th>
+      <td>123 Braavos Ave.</td>
+      <td>Acme Co.</td>
+    </tr>
+    <tr>
+      <th scope="row">Jane Doe</th>
+      <td>456 King's Landing</td>
+      <td>Acme Co.</td>
+    </tr>
+  </tbody>
+</table></div><details class="ds-u-margin-bottom--2" data-reactid="47"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="48">Code snippet</summary><pre class="language-markup" data-reactid="49"><code data-reactid="50"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>table</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-table<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>caption</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-table__caption<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Household members<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>caption</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>thead</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tr</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span> <span class="token attr-name">scope</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>col<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Name<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span> <span class="token attr-name">scope</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>col<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Street<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span> <span class="token attr-name">scope</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>col<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Employer<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tr</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>thead</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tbody</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tr</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span> <span class="token attr-name">scope</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>row<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>John Doe<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">></span></span>123 Braavos Ave.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">></span></span>Acme Co.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tr</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tr</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span> <span class="token attr-name">scope</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>row<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Jane Doe<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">></span></span>456 King's Landing<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
+      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">></span></span>Acme Co.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tr</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tbody</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>table</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></main></div></div></div>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>table</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="51"><article class="ds-u-margin-y--6 l-content" data-reactid="52"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="53"><h2 id="when-to-use">When to use</h2>
+<ul>
+<li>When you need tabular information, such as statistical data.</li>
+<li>When users need to compare sets of information.</li>
+</ul>
+<h2 id="when-to-consider-alternatives">When to consider alternatives</h2>
+<ul>
+<li>Depending on the type of content, consider using other presentation formats such as definition lists or hierarchical lists.</li>
+<li>If you&#39;re writing out name / value pairs, there&#39;s often a more compact way compared to using a table.</li>
+</ul>
+<h2 id="guidance">Guidance</h2>
+<ul>
+<li>Right-align numerical data in tables. You can use a <a href="/design-system/utilities/text-align">text alignment utility class</a> for this. This makes it easier to scan and compare values.</li>
+</ul>
+<h2 id="accessibility">Accessibility</h2>
+<ul>
+<li>Tables can have two levels of headers. Each header cell should have <code>scope=&quot;col&quot;</code> or <code>scope=&quot;row&quot;</code>. <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th#attr-scope">Learn more about the &quot;scope&quot; attribute.</a></li>
+<li>Complex tables are tables with more than two levels of headers. Each header should be given a unique <code>id</code> and each data cell should have a <code>headers</code> attribute with each related header cell’s <code>id</code> listed.</li>
+<li>When adding a title to a table, include it in a <code>&lt;caption&gt;</code> tag inside of the <code>&lt;table&gt;</code> element.</li>
+</ul>
+<h2 id="learn-more">Learn more</h2>
+<ul>
+<li><a href="https://www.w3.org/WAI/tutorials/tables/">W3C Web Accessibility Tutorial - Table Concepts</a></li>
+<li><a href="https://medium.com/mission-log/design-better-data-tables-430a30a00d8c">Design Better Data Tables</a></li>
+</ul></div></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Table","description":"","reference":"components.table","referenceNumber":"3.7","referenceURI":"design-system/components/table","weight":0,"markup":"<table class=\"ds-c-table {{modifier}}\">\n  <thead>\n    <tr>\n      <th>Name</th>\n      <th>Favorite fruit</th>\n    </tr>\n  </thead>\n  <tbody>\n    <tr>\n      <td>Fred</td>\n      <td>Apples</td>\n    </tr>\n  </tbody>\n</table>","source":{"filename":"components/Table/Table.scss","path":"packages/core/src/components/Table/Table.scss"},"depth":2,"modifiers":[{"name":".ds-c-table--borderless","description":"Borderless table","className":"ds-c-table--borderless"}],"sections":[],"status":"prototype","parentReference":"components"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Table","description":"<p>Tables show tabular data in columns and rows.</p>","reference":"components.table","referenceNumber":"3.7","referenceURI":"design-system/components/table","weight":0,"markup":"<table class=\"ds-c-table {{modifier}}\">\n  <thead>\n    <tr>\n      <th>Name</th>\n      <th class=\"ds-u-text-align--right\">Rate</th>\n      <th>Favorite fruit</th>\n    </tr>\n  </thead>\n  <tbody>\n    <tr>\n      <td>Fred</td>\n      <td class=\"ds-u-text-align--right\">51.25%</td>\n      <td>Apples</td>\n    </tr>\n    <tr>\n      <td>Tamara</td>\n      <td class=\"ds-u-text-align--right\">98.70%</td>\n      <td>Strawberries</td>\n    </tr>\n  </tbody>\n</table>","source":{"filename":"components/Table/Table.scss","path":"packages/core/src/components/Table/Table.scss"},"depth":2,"modifiers":[{"name":".ds-c-table--borderless","description":"Borderless table","className":"ds-c-table--borderless"}],"sections":[{"header":"Table with two headers and a caption","description":"","reference":"components.table.complex","referenceNumber":"3.7.1","referenceURI":"design-system/components/table/complex","weight":0,"markup":"<table class=\"ds-c-table {{modifier}}\">\n  <caption class=\"ds-c-table__caption\">Household members</caption>\n  <thead>\n    <tr>\n      <th scope=\"col\">Name</th>\n      <th scope=\"col\">Street</th>\n      <th scope=\"col\">Employer</th>\n    </tr>\n  </thead>\n  <tbody>\n    <tr>\n      <th scope=\"row\">John Doe</th>\n      <td>123 Braavos Ave.</td>\n      <td>Acme Co.</td>\n    </tr>\n    <tr>\n      <th scope=\"row\">Jane Doe</th>\n      <td>456 King's Landing</td>\n      <td>Acme Co.</td>\n    </tr>\n  </tbody>\n</table>","source":{"filename":"components/Table/Table.scss","path":"packages/core/src/components/Table/Table.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.table"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>When you need tabular information, such as statistical data.</li>\n<li>When users need to compare sets of information.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>Depending on the type of content, consider using other presentation formats such as definition lists or hierarchical lists.</li>\n<li>If you&#39;re writing out name / value pairs, there&#39;s often a more compact way compared to using a table.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Right-align numerical data in tables. You can use a <a href=\"/design-system/utilities/text-align\">text alignment utility class</a> for this. This makes it easier to scan and compare values.</li>\n</ul>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Tables can have two levels of headers. Each header cell should have <code>scope=&quot;col&quot;</code> or <code>scope=&quot;row&quot;</code>. <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th#attr-scope\">Learn more about the &quot;scope&quot; attribute.</a></li>\n<li>Complex tables are tables with more than two levels of headers. Each header should be given a unique <code>id</code> and each data cell should have a <code>headers</code> attribute with each related header cell’s <code>id</code> listed.</li>\n<li>When adding a title to a table, include it in a <code>&lt;caption&gt;</code> tag inside of the <code>&lt;table&gt;</code> element.</li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"https://www.w3.org/WAI/tutorials/tables/\">W3C Web Accessibility Tutorial - Table Concepts</a></li>\n<li><a href=\"https://medium.com/mission-log/design-better-data-tables-430a30a00d8c\">Design Better Data Tables</a></li>\n</ul>","reference":"components.table.guidance","referenceNumber":"3.7.2","referenceURI":"design-system/components/table/guidance","weight":0,"markup":"","source":{"filename":"components/Table/Table.scss","path":"packages/core/src/components/Table/Table.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.table"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/tables/","parentReference":"components"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/components/tabs/index.html b/docs/components/tabs/index.html
index ccf4881f55..2e555db9b9 100644
--- a/docs/components/tabs/index.html
+++ b/docs/components/tabs/index.html
@@ -2,14 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Tabs - CMSgov Design System</title>
+  <title>Tabs - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1825458911"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-u-fill--warn ds-u-color--base" data-reactid="12">prototype</span><h1 class="ds-display" id="components.tabs" data-reactid="13">Tabs</h1><div class="ds-u-clearfix" data-reactid="14"></div><code class="ds-u-font-size--small" data-reactid="15">components/Tabs/Tabs.scss</code></heading><div data-reactid="16"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="17"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="18">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="19">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="20"><article class="ds-u-margin-y--6 l-content" data-reactid="21"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="22"><p>Tabs can be used as a navigation pattern, allowing a user to switch between panels of related content within the same context.</p></div><section class="ds-u-margin-top--3" data-reactid="23"><div class="markup markup--html" data-reactid="24"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="25"><div class="ds-c-tabs" role="tablist" aria-label="Settings">
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-89190257"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-c-badge--warn" data-reactid="10">beta</span><h1 class="ds-display" id="components.tabs" data-reactid="11">Tabs</h1><div class="ds-u-clearfix" data-reactid="12"></div><code class="ds-u-font-size--small" data-reactid="13">components/Tabs/Tabs.scss</code></heading><div data-reactid="14"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="15"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="16">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="17">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="18"><article class="ds-u-margin-y--6 l-content" data-reactid="19"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="20"><p>Tabs can be used as a navigation pattern, allowing a user to switch between panels of related content within the same context.</p></div><section class="ds-u-margin-top--3" data-reactid="21"><div class="markup markup--html" data-reactid="22"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="23"><div class="ds-c-tabs" role="tablist" aria-label="Settings">
   <a
     class="ds-c-tabs__item"
     href="#panel-profile"
@@ -41,7 +41,7 @@
 </div>
 <div class="ds-c-tabs__panel" id="panel-comms" aria-hidden="true" aria-labelledby="tab-comms" aria-selected="false" role="tabpanel">
   Communication preferences content
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="26"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="27">Code snippet</summary><pre class="language-markup" data-reactid="28"><code data-reactid="29"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-tabs<span class="token punctuation">"</span></span> <span class="token attr-name">role</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>tablist<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Settings<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="24"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="25">Code snippet</summary><pre class="language-markup" data-reactid="26"><code data-reactid="27"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-tabs<span class="token punctuation">"</span></span> <span class="token attr-name">role</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>tablist<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Settings<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span>
     <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-tabs__item<span class="token punctuation">"</span></span>
     <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>#panel-profile<span class="token punctuation">"</span></span>
@@ -73,10 +73,10 @@
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-tabs__panel<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>panel-comms<span class="token punctuation">"</span></span> <span class="token attr-name">aria-hidden</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>true<span class="token punctuation">"</span></span> <span class="token attr-name">aria-labelledby</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>tab-comms<span class="token punctuation">"</span></span> <span class="token attr-name">aria-selected</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>false<span class="token punctuation">"</span></span> <span class="token attr-name">role</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>tabpanel<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   Communication preferences content
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="30"><div data-reactid="31"><h1 class="ds-h1" id="components.tabs.react-tabs" data-reactid="32"><code>&#x3C;Tabs&#x3E;</code></h1><code class="ds-u-font-size--small" data-reactid="33">components/Tabs/Tabs</code></div><section data-reactid="34"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="35"><p>A container component that manages the state of your tabs for you. For most
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="28"><div data-reactid="29"><h2 class="ds-h2" id="components.tabs.react-tabs" data-reactid="30"><code>&#x3C;Tabs&#x3E;</code></h2><code class="ds-u-font-size--small" data-reactid="31">components/Tabs/Tabs.jsx</code></div><section data-reactid="32"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="33"><p>A container component that manages the state of your tabs for you. For most
 cases, you&#39;ll want to use this component rather than the presentational
 components (<code>Tab</code>, <code>TabPanel</code>) on their own.</p>
-</div><div class="markup markup--react" data-reactid="36"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="37"><div data-reactid="38"><div class="ds-c-tabs" role="tablist" data-reactid="39"><a aria-selected="true" aria-controls="summary" class="ds-c-tabs__item" href="#summary" id="ds-c-tabs__item--summary" role="tab" data-reactid="40">Summary</a><a aria-selected="false" aria-controls="amendments" class="ds-c-tabs__item" href="#amendments" id="ds-c-tabs__item--amendments" role="tab" data-reactid="41">Amendments</a></div><div aria-labelledby="ds-c-tabs__item--summary" aria-hidden="false" class="ds-c-tabs__panel" id="summary" role="tabpanel" data-reactid="42">The Bill of Rights is the first ten amendments to the United States Constitution.</div><div aria-labelledby="ds-c-tabs__item--amendments" aria-hidden="true" class="ds-c-tabs__panel" id="amendments" role="tabpanel" data-reactid="43"><h2 class="ds-h4" data-reactid="44">Bill of Rights</h2><ol class="ds-c-list" data-reactid="45"><li data-reactid="46">Freedoms, Petitions, Assembly</li><li data-reactid="47">Right to bear arms</li><li data-reactid="48">Quartering of soldiers</li><li data-reactid="49">Search and arrest</li><li data-reactid="50">Rights in criminal cases</li><li data-reactid="51">Right to a fair trial</li><li data-reactid="52">Rights in civil cases</li><li data-reactid="53">Bail, fines, punishment</li><li data-reactid="54">Rights retained by the People</li><li data-reactid="55">States’ rights</li></ol><h2 class="ds-h4" data-reactid="56">Later Amendments</h2><ol class="ds-c-list" start="11" data-reactid="57"><li data-reactid="58">Lawsuits against states</li><li data-reactid="59">Presidential elections</li><li data-reactid="60">Abolition of slavery</li><li data-reactid="61">Civil rights</li><li data-reactid="62">Black suffrage</li><li data-reactid="63">Income taxes</li><li data-reactid="64">Senatorial elections</li><li data-reactid="65">Prohibition of liquor</li><li data-reactid="66">Women’s suffrage</li><li data-reactid="67">Terms of office</li><li data-reactid="68">Repeal of Prohibition</li><li data-reactid="69">Term Limits for the Presidency</li><li data-reactid="70">Washington, D.C., suffrage</li><li data-reactid="71">Abolition of poll taxes</li><li data-reactid="72">Presidential succession</li><li data-reactid="73">18-year-old suffrage</li><li data-reactid="74">Congressional pay raises</li></ol></div></div></div><details class="ds-u-margin-bottom--2" data-reactid="75"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="76">Code snippet</summary><pre class="language-jsx" data-reactid="77"><code data-reactid="78"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Tabs</span><span class="token punctuation">></span></span>
+</div><div class="markup markup--react" data-reactid="34"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="35"><div data-reactid="36"><div class="ds-c-tabs" role="tablist" data-reactid="37"><a aria-selected="true" aria-controls="summary" class="ds-c-tabs__item" href="#summary" id="ds-c-tabs__item--summary" role="tab" data-reactid="38">Summary</a><a aria-selected="false" aria-controls="amendments" class="ds-c-tabs__item" href="#amendments" id="ds-c-tabs__item--amendments" role="tab" data-reactid="39">Amendments</a></div><div aria-labelledby="ds-c-tabs__item--summary" aria-hidden="false" class="ds-c-tabs__panel" id="summary" role="tabpanel" data-reactid="40">The Bill of Rights is the first ten amendments to the United States Constitution.</div><div aria-labelledby="ds-c-tabs__item--amendments" aria-hidden="true" class="ds-c-tabs__panel" id="amendments" role="tabpanel" data-reactid="41"><h2 class="ds-h4" data-reactid="42">Bill of Rights</h2><ol class="ds-c-list" data-reactid="43"><li data-reactid="44">Freedoms, Petitions, Assembly</li><li data-reactid="45">Right to bear arms</li><li data-reactid="46">Quartering of soldiers</li><li data-reactid="47">Search and arrest</li><li data-reactid="48">Rights in criminal cases</li><li data-reactid="49">Right to a fair trial</li><li data-reactid="50">Rights in civil cases</li><li data-reactid="51">Bail, fines, punishment</li><li data-reactid="52">Rights retained by the People</li><li data-reactid="53">States’ rights</li></ol><h2 class="ds-h4" data-reactid="54">Later Amendments</h2><ol class="ds-c-list" start="11" data-reactid="55"><li data-reactid="56">Lawsuits against states</li><li data-reactid="57">Presidential elections</li><li data-reactid="58">Abolition of slavery</li><li data-reactid="59">Civil rights</li><li data-reactid="60">Black suffrage</li><li data-reactid="61">Income taxes</li><li data-reactid="62">Senatorial elections</li><li data-reactid="63">Prohibition of liquor</li><li data-reactid="64">Women’s suffrage</li><li data-reactid="65">Terms of office</li><li data-reactid="66">Repeal of Prohibition</li><li data-reactid="67">Term Limits for the Presidency</li><li data-reactid="68">Washington, D.C., suffrage</li><li data-reactid="69">Abolition of poll taxes</li><li data-reactid="70">Presidential succession</li><li data-reactid="71">18-year-old suffrage</li><li data-reactid="72">Congressional pay raises</li></ol></div></div></div><details class="ds-u-margin-bottom--2" data-reactid="73"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="74">Code snippet</summary><pre class="language-jsx" data-reactid="75"><code data-reactid="76"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Tabs</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>TabPanel</span>
     <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>summary<span class="token punctuation">"</span></span>
     <span class="token attr-name">tab</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Summary<span class="token punctuation">"</span></span>
@@ -182,21 +182,21 @@
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>ol</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>TabPanel</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>Tabs</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="79">Props</h3><table class="ds-c-table" data-reactid="80"><thead data-reactid="81"><tr data-reactid="82"><td data-reactid="83">Name</td><td data-reactid="84">Type</td><td data-reactid="85">Default</td><td data-reactid="86">Description</td></tr></thead><tbody data-reactid="87"><tr data-reactid="88"><td data-reactid="89"><code class="ds-u-font-weight--bold" data-reactid="90">defaultSelectedId</code></td><td data-reactid="91"><code data-reactid="92">string</code></td><td data-reactid="93"></td><td data-reactid="94"><div data-reactid="95"><p>Default selected <code>TabPanel</code>&#39;s <code>id</code>. If this isn&#39;t set, the first <code>TabPanel</code>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>Tabs</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="77">Props</h3><table class="ds-c-table" data-reactid="78"><thead data-reactid="79"><tr data-reactid="80"><td data-reactid="81">Name</td><td data-reactid="82">Type</td><td data-reactid="83">Default</td><td data-reactid="84">Description</td></tr></thead><tbody data-reactid="85"><tr data-reactid="86"><td data-reactid="87"><code class="ds-u-font-weight--bold" data-reactid="88">defaultSelectedId</code></td><td data-reactid="89"><code data-reactid="90">string</code></td><td data-reactid="91"></td><td data-reactid="92"><div data-reactid="93"><p>Default selected <code>TabPanel</code>&#39;s <code>id</code>. If this isn&#39;t set, the first <code>TabPanel</code>
 will be selected.</p>
-</div></td></tr><tr data-reactid="96"><td data-reactid="97"><code class="ds-u-font-weight--bold" data-reactid="98">onChange</code></td><td data-reactid="99"><code data-reactid="100">func</code></td><td data-reactid="101"></td><td data-reactid="102"><div data-reactid="103"><p>A callback function that&#39;s invoked when the selected tab is changed.
+</div></td></tr><tr data-reactid="94"><td data-reactid="95"><code class="ds-u-font-weight--bold" data-reactid="96">onChange</code></td><td data-reactid="97"><code data-reactid="98">func</code></td><td data-reactid="99"></td><td data-reactid="100"><div data-reactid="101"><p>A callback function that&#39;s invoked when the selected tab is changed.
 <code>(selectedId, prevSelectedId) =&gt; void</code></p>
-</div></td></tr><tr data-reactid="104"><td data-reactid="105"><code class="ds-u-font-weight--bold" data-reactid="106">tablistClassName</code></td><td data-reactid="107"><code data-reactid="108">string</code></td><td data-reactid="109"></td><td data-reactid="110"><div data-reactid="111"><p>Additional classes to be added to the component wrapping the tabs</p>
-</div></td></tr></tbody></table></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="112"><div data-reactid="113"><h1 class="ds-h1" id="components.tabs.react-tabpanel" data-reactid="114"><code>&#x3C;TabPanel&#x3E;</code></h1><code class="ds-u-font-size--small" data-reactid="115">components/Tabs/TabPanel</code></div><section data-reactid="116"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="117"></div><h3 data-reactid="118">Props</h3><table class="ds-c-table" data-reactid="119"><thead data-reactid="120"><tr data-reactid="121"><td data-reactid="122">Name</td><td data-reactid="123">Type</td><td data-reactid="124">Default</td><td data-reactid="125">Description</td></tr></thead><tbody data-reactid="126"><tr data-reactid="127"><td data-reactid="128"><code class="ds-u-font-weight--bold" data-reactid="129">className</code></td><td data-reactid="130"><code data-reactid="131">string</code></td><td data-reactid="132"></td><td data-reactid="133"><div data-reactid="134"><p>Additional classes to be added to the root element.</p>
-</div></td></tr><tr data-reactid="135"><td data-reactid="136"><code class="ds-u-font-weight--bold" data-reactid="137">id</code><p data-reactid="138"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="139">Required</span></p></td><td data-reactid="140"><code data-reactid="141">string</code></td><td data-reactid="142"></td><td data-reactid="143"><div data-reactid="144"><p>A unique <code>id</code>, to be used on the rendered panel element.</p>
-</div></td></tr><tr data-reactid="145"><td data-reactid="146"><code class="ds-u-font-weight--bold" data-reactid="147">selected</code></td><td data-reactid="148"><code data-reactid="149">bool</code></td><td data-reactid="150"><code data-reactid="151">false</code></td><td data-reactid="152"></td></tr><tr data-reactid="153"><td data-reactid="154"><code class="ds-u-font-weight--bold" data-reactid="155">tab</code></td><td data-reactid="156"><code data-reactid="157">string</code></td><td data-reactid="158"></td><td data-reactid="159"><div data-reactid="160"><p>The associated tab&#39;s label. Only applicable when the panel is a
+</div></td></tr><tr data-reactid="102"><td data-reactid="103"><code class="ds-u-font-weight--bold" data-reactid="104">tablistClassName</code></td><td data-reactid="105"><code data-reactid="106">string</code></td><td data-reactid="107"></td><td data-reactid="108"><div data-reactid="109"><p>Additional classes to be added to the component wrapping the tabs</p>
+</div></td></tr></tbody></table></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="110"><div data-reactid="111"><h2 class="ds-h2" id="components.tabs.react-tabpanel" data-reactid="112"><code>&#x3C;TabPanel&#x3E;</code></h2><code class="ds-u-font-size--small" data-reactid="113">components/Tabs/TabPanel.jsx</code></div><section data-reactid="114"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="115"></div><h3 data-reactid="116">Props</h3><table class="ds-c-table" data-reactid="117"><thead data-reactid="118"><tr data-reactid="119"><td data-reactid="120">Name</td><td data-reactid="121">Type</td><td data-reactid="122">Default</td><td data-reactid="123">Description</td></tr></thead><tbody data-reactid="124"><tr data-reactid="125"><td data-reactid="126"><code class="ds-u-font-weight--bold" data-reactid="127">className</code></td><td data-reactid="128"><code data-reactid="129">string</code></td><td data-reactid="130"></td><td data-reactid="131"><div data-reactid="132"><p>Additional classes to be added to the root element.</p>
+</div></td></tr><tr data-reactid="133"><td data-reactid="134"><code class="ds-u-font-weight--bold" data-reactid="135">id</code><p data-reactid="136"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="137">Required</span></p></td><td data-reactid="138"><code data-reactid="139">string</code></td><td data-reactid="140"></td><td data-reactid="141"><div data-reactid="142"><p>A unique <code>id</code>, to be used on the rendered panel element.</p>
+</div></td></tr><tr data-reactid="143"><td data-reactid="144"><code class="ds-u-font-weight--bold" data-reactid="145">selected</code></td><td data-reactid="146"><code data-reactid="147">bool</code></td><td data-reactid="148"><code data-reactid="149">false</code></td><td data-reactid="150"></td></tr><tr data-reactid="151"><td data-reactid="152"><code class="ds-u-font-weight--bold" data-reactid="153">tab</code></td><td data-reactid="154"><code data-reactid="155">string</code></td><td data-reactid="156"></td><td data-reactid="157"><div data-reactid="158"><p>The associated tab&#39;s label. Only applicable when the panel is a
 child of <code>Tabs</code>.</p>
-</div></td></tr><tr data-reactid="161"><td data-reactid="162"><code class="ds-u-font-weight--bold" data-reactid="163">tabClassName</code></td><td data-reactid="164"><code data-reactid="165">string</code></td><td data-reactid="166"></td><td data-reactid="167"><div data-reactid="168"><p>Additional classes for the associated tab. Only applicable when the panel
+</div></td></tr><tr data-reactid="159"><td data-reactid="160"><code class="ds-u-font-weight--bold" data-reactid="161">tabClassName</code></td><td data-reactid="162"><code data-reactid="163">string</code></td><td data-reactid="164"></td><td data-reactid="165"><div data-reactid="166"><p>Additional classes for the associated tab. Only applicable when the panel
 is a child of <code>Tabs</code>.</p>
-</div></td></tr><tr data-reactid="169"><td data-reactid="170"><code class="ds-u-font-weight--bold" data-reactid="171">tabHref</code></td><td data-reactid="172"><code data-reactid="173">string</code></td><td data-reactid="174"></td><td data-reactid="175"><div data-reactid="176"><p>The associated tab&#39;s <code>href</code>. Only applicable when the panel is a
+</div></td></tr><tr data-reactid="167"><td data-reactid="168"><code class="ds-u-font-weight--bold" data-reactid="169">tabHref</code></td><td data-reactid="170"><code data-reactid="171">string</code></td><td data-reactid="172"></td><td data-reactid="173"><div data-reactid="174"><p>The associated tab&#39;s <code>href</code>. Only applicable when the panel is a
 child of <code>Tabs</code>.</p>
-</div></td></tr><tr data-reactid="177"><td data-reactid="178"><code class="ds-u-font-weight--bold" data-reactid="179">tabId</code></td><td data-reactid="180"><code data-reactid="181">string</code></td><td data-reactid="182"></td><td data-reactid="183"><div data-reactid="184"><p>The <code>id</code> of the associated <code>Tab</code>. Used for the <code>aria-labelledby</code> attribute</p>
-</div></td></tr></tbody></table></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="185"><div data-reactid="186"><h1 class="ds-h1" id="components.tabs.react-tab" data-reactid="187"><code>&#x3C;Tab&#x3E;</code></h1><code class="ds-u-font-size--small" data-reactid="188">components/Tabs/Tab</code></div><section data-reactid="189"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="190"></div><div class="markup markup--react" data-reactid="191"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="192"><div class="ds-c-tabs" role="tablist" data-reactid="193"><a aria-selected="true" aria-controls="tab-example-panel-1" class="ds-c-tabs__item" href="#tab-example-panel-1" id="tab-example-1" role="tab" data-reactid="194">Selected tab</a><a aria-selected="false" aria-controls="tab-example-panel-2" class="ds-c-tabs__item" href="#tab-example-panel-2" id="tab-example-2" role="tab" data-reactid="195">Other tab</a></div></div><details class="ds-u-margin-bottom--2" data-reactid="196"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="197">Code snippet</summary><pre class="language-jsx" data-reactid="198"><code data-reactid="199"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span>
+</div></td></tr><tr data-reactid="175"><td data-reactid="176"><code class="ds-u-font-weight--bold" data-reactid="177">tabId</code></td><td data-reactid="178"><code data-reactid="179">string</code></td><td data-reactid="180"></td><td data-reactid="181"><div data-reactid="182"><p>The <code>id</code> of the associated <code>Tab</code>. Used for the <code>aria-labelledby</code> attribute</p>
+</div></td></tr></tbody></table></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="183"><div data-reactid="184"><h2 class="ds-h2" id="components.tabs.react-tab" data-reactid="185"><code>&#x3C;Tab&#x3E;</code></h2><code class="ds-u-font-size--small" data-reactid="186">components/Tabs/Tab.jsx</code></div><section data-reactid="187"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="188"></div><div class="markup markup--react" data-reactid="189"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="190"><div class="ds-c-tabs" role="tablist" data-reactid="191"><a aria-selected="true" aria-controls="tab-example-panel-1" class="ds-c-tabs__item" href="#tab-example-panel-1" id="tab-example-1" role="tab" data-reactid="192">Selected tab</a><a aria-selected="false" aria-controls="tab-example-panel-2" class="ds-c-tabs__item" href="#tab-example-panel-2" id="tab-example-2" role="tab" data-reactid="193">Other tab</a></div></div><details class="ds-u-margin-bottom--2" data-reactid="194"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="195">Code snippet</summary><pre class="language-jsx" data-reactid="196"><code data-reactid="197"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span>
   <span class="token attr-name">className</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-tabs<span class="token punctuation">"</span></span>
   <span class="token attr-name">role</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>tablist<span class="token punctuation">"</span></span>
 <span class="token punctuation">></span></span>
@@ -213,15 +213,30 @@
   <span class="token punctuation">></span></span>
     Other tab
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>Tab</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="200">Props</h3><table class="ds-c-table" data-reactid="201"><thead data-reactid="202"><tr data-reactid="203"><td data-reactid="204">Name</td><td data-reactid="205">Type</td><td data-reactid="206">Default</td><td data-reactid="207">Description</td></tr></thead><tbody data-reactid="208"><tr data-reactid="209"><td data-reactid="210"><code class="ds-u-font-weight--bold" data-reactid="211">className</code></td><td data-reactid="212"><code data-reactid="213">string</code></td><td data-reactid="214"></td><td data-reactid="215"><div data-reactid="216"><p>Additional classes to be added to the root tab element.</p>
-</div></td></tr><tr data-reactid="217"><td data-reactid="218"><code class="ds-u-font-weight--bold" data-reactid="219">id</code><p data-reactid="220"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="221">Required</span></p></td><td data-reactid="222"><code data-reactid="223">string</code></td><td data-reactid="224"></td><td data-reactid="225"><div data-reactid="226"><p>A unique <code>id</code>, to be used on the rendered tab element.</p>
-</div></td></tr><tr data-reactid="227"><td data-reactid="228"><code class="ds-u-font-weight--bold" data-reactid="229">href</code></td><td data-reactid="230"><code data-reactid="231">string</code></td><td data-reactid="232"></td><td data-reactid="233"><div data-reactid="234"><p>You can optionally set the <code>href</code> attribute used for the tab. This can be
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="198">Props</h3><table class="ds-c-table" data-reactid="199"><thead data-reactid="200"><tr data-reactid="201"><td data-reactid="202">Name</td><td data-reactid="203">Type</td><td data-reactid="204">Default</td><td data-reactid="205">Description</td></tr></thead><tbody data-reactid="206"><tr data-reactid="207"><td data-reactid="208"><code class="ds-u-font-weight--bold" data-reactid="209">className</code></td><td data-reactid="210"><code data-reactid="211">string</code></td><td data-reactid="212"></td><td data-reactid="213"><div data-reactid="214"><p>Additional classes to be added to the root tab element.</p>
+</div></td></tr><tr data-reactid="215"><td data-reactid="216"><code class="ds-u-font-weight--bold" data-reactid="217">id</code><p data-reactid="218"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="219">Required</span></p></td><td data-reactid="220"><code data-reactid="221">string</code></td><td data-reactid="222"></td><td data-reactid="223"><div data-reactid="224"><p>A unique <code>id</code>, to be used on the rendered tab element.</p>
+</div></td></tr><tr data-reactid="225"><td data-reactid="226"><code class="ds-u-font-weight--bold" data-reactid="227">href</code></td><td data-reactid="228"><code data-reactid="229">string</code></td><td data-reactid="230"></td><td data-reactid="231"><div data-reactid="232"><p>You can optionally set the <code>href</code> attribute used for the tab. This can be
 useful if you want to use relative links rather than a URL hash (the default)</p>
-</div></td></tr><tr data-reactid="235"><td data-reactid="236"><code class="ds-u-font-weight--bold" data-reactid="237">onClick</code></td><td data-reactid="238"><code data-reactid="239">func</code></td><td data-reactid="240"></td><td data-reactid="241"><div data-reactid="242"><p>Called when the tab is clicked, with the following arguments:
+</div></td></tr><tr data-reactid="233"><td data-reactid="234"><code class="ds-u-font-weight--bold" data-reactid="235">onClick</code></td><td data-reactid="236"><code data-reactid="237">func</code></td><td data-reactid="238"></td><td data-reactid="239"><div data-reactid="240"><p>Called when the tab is clicked, with the following arguments:
 <a href="https://facebook.github.io/react/docs/events.html"><code>SyntheticEvent</code></a>,
 <code>id</code>, <code>panelId</code></p>
-</div></td></tr><tr data-reactid="243"><td data-reactid="244"><code class="ds-u-font-weight--bold" data-reactid="245">panelId</code><p data-reactid="246"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="247">Required</span></p></td><td data-reactid="248"><code data-reactid="249">string</code></td><td data-reactid="250"></td><td data-reactid="251"><div data-reactid="252"><p>The <code>id</code> of the associated <code>TabPanel</code>. Used for the <code>aria-controls</code> attribute</p>
-</div></td></tr><tr data-reactid="253"><td data-reactid="254"><code class="ds-u-font-weight--bold" data-reactid="255">selected</code></td><td data-reactid="256"><code data-reactid="257">bool</code></td><td data-reactid="258"><code data-reactid="259">false</code></td><td data-reactid="260"></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="261"><article class="ds-u-margin-y--6 l-content" data-reactid="262"><div data-reactid="263"><h1 class="ds-h1" id="components.tabs.guidance" data-reactid="264">Guidelines</h1><code class="ds-u-font-size--small" data-reactid="265">components/Tabs/Tabs.scss</code></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="266"><h2 id="accessibility">Accessibility</h2>
+</div></td></tr><tr data-reactid="241"><td data-reactid="242"><code class="ds-u-font-weight--bold" data-reactid="243">panelId</code><p data-reactid="244"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="245">Required</span></p></td><td data-reactid="246"><code data-reactid="247">string</code></td><td data-reactid="248"></td><td data-reactid="249"><div data-reactid="250"><p>The <code>id</code> of the associated <code>TabPanel</code>. Used for the <code>aria-controls</code> attribute</p>
+</div></td></tr><tr data-reactid="251"><td data-reactid="252"><code class="ds-u-font-weight--bold" data-reactid="253">selected</code></td><td data-reactid="254"><code data-reactid="255">bool</code></td><td data-reactid="256"><code data-reactid="257">false</code></td><td data-reactid="258"></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="259"><article class="ds-u-margin-y--6 l-content" data-reactid="260"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="261"><h2 id="when-to-use">When to use</h2>
+<ul>
+<li>If you have 2-3 panels of related content that needs to be condensed.</li>
+</ul>
+<h2 id="when-to-consider-alternatives">When to consider alternatives</h2>
+<ul>
+<li>If you have more than three tabs. Consider using a different pattern if your content requires being split into more than three panels.</li>
+<li>If the panel contents aren&#39;t related.</li>
+<li>If the panel contents can be displayed at once. This will improve the scanability of your page&#39;s content and it&#39;s more likely the user will be able to find what they&#39;re looking for.</li>
+</ul>
+<h2 id="guidance">Guidance</h2>
+<ul>
+<li>Don&#39;t hide tabs on small screens. If the tabs can&#39;t fit on one row on small screens, consider using utility classes to apply additional responsive styles or use a different pattern.</li>
+<li>Each Tab label should be descriptive of its content and set the user&#39;s expectations. Labels should be no more than two words.</li>
+</ul>
+<h2 id="accessibility">Accessibility</h2>
 <ul>
 <li>Use an anchor link (<code>a</code>) to create the tabs. This allows you to link directly to a tab, and allows you to progressively enhance the page, retaining default browser behavior like opening links in a new window. Note: You&#39;ll need to implement the logic for selecting the correct tab based on the current URL.</li>
 <li>Ensure the HTML markup includes the proper ARIA attributes:<ul>
@@ -231,24 +246,15 @@
 </ul>
 </li>
 </ul>
-<h2 id="guidance">Guidance</h2>
-<h3 id="responsiveness">Responsiveness</h3>
-<p>Hiding tabs on small screens is not a user-friendly solution. If the tabs can&#39;t fit on one row on small screens, consider using utility classes to apply additional responsive styles or use a different pattern.</p>
-<h3 id="general-guidance">General guidance</h3>
-<ul>
-<li>The content within tab panels should be related.</li>
-<li>Each Tab label should be descriptive of its content and set the user&#39;s expectations. Labels shoud be no more than two words.</li>
-<li>A maximum of three tabs should be displayed. Consider using a different pattern if your content requries being split into more than three panels.</li>
-</ul>
-<h2 id="further-reading">Further reading</h2>
+<h2 id="learn-more">Learn more</h2>
 <ul>
 <li><a href="https://24ways.org/2015/how-tabs-should-work/">How Tabs Should Work</a></li>
 <li><a href="http://heydonworks.com/practical_aria_examples/#tab-interface">Simple ARIA tab interface</a></li>
 </ul></div></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Tabs","description":"<p>Tabs can be used as a navigation pattern, allowing a user to switch between panels of related content within the same context.</p>","reference":"components.tabs","referenceNumber":"3.8","referenceURI":"design-system/components/tabs","weight":0,"markup":"<div class=\"ds-c-tabs\" role=\"tablist\" aria-label=\"Settings\">\n  <a\n    class=\"ds-c-tabs__item\"\n    href=\"#panel-profile\"\n    role=\"tab\"\n    aria-selected=\"true\"\n    aria-controls=\"panel-profile\"\n    id=\"tab-profile\"\n  >\n    <svg class=\"ds-u-margin-right--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n      <use xlink:href=\"/design-system/public/images/symbols.svg#placeholder\"></use>\n    </svg>Profile\n  </a>\n  <a\n    class=\"ds-c-tabs__item\"\n    href=\"#panel-comms\"\n    role=\"tab\"\n    aria-selected=\"false\"\n    aria-controls=\"panel-comms\"\n    id=\"tab-comms\"\n  >\n    <svg class=\"ds-u-margin-right--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n      <use xlink:href=\"/design-system/public/images/symbols.svg#placeholder\"></use>\n    </svg>Communication preferences\n  </a>\n</div>\n<div class=\"ds-c-tabs__panel\" id=\"panel-profile\" aria-labelledby=\"tab-profile\" role=\"tabpanel\">\n  Note: This is just an example of the HTML markup. See the React example for\n  a functioning example.\n</div>\n<div class=\"ds-c-tabs__panel\" id=\"panel-comms\" aria-hidden=\"true\" aria-labelledby=\"tab-comms\" aria-selected=\"false\" role=\"tabpanel\">\n  Communication preferences content\n</div>","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":2,"modifiers":[],"sections":[{"header":"<code>&#x3C;Tabs&#x3E;</code>","description":"","reference":"components.tabs.react-tabs","referenceNumber":"3.8.4","referenceURI":"design-system/components/tabs/react-tabs","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Tabs","parentReference":"components.tabs"},{"header":"<code>&#x3C;TabPanel&#x3E;</code>","description":"","reference":"components.tabs.react-tabpanel","referenceNumber":"3.8.3","referenceURI":"design-system/components/tabs/react-tabpanel","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"hideExample":true,"reactComponent":"TabPanel","parentReference":"components.tabs"},{"header":"<code>&#x3C;Tab&#x3E;</code>","description":"","reference":"components.tabs.react-tab","referenceNumber":"3.8.2","referenceURI":"design-system/components/tabs/react-tab","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Tab","parentReference":"components.tabs"},{"header":"Guidelines","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Use an anchor link (<code>a</code>) to create the tabs. This allows you to link directly to a tab, and allows you to progressively enhance the page, retaining default browser behavior like opening links in a new window. Note: You&#39;ll need to implement the logic for selecting the correct tab based on the current URL.</li>\n<li>Ensure the HTML markup includes the proper ARIA attributes:<ul>\n<li>For tabs: <code>role</code>, <code>aria-selected</code>, <code>aria-controls</code></li>\n<li>For the tabs list parent: <code>role</code>, <code>aria-label</code></li>\n<li>For a tab panel: <code>role</code>, <code>aria-labelledby</code></li>\n</ul>\n</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<h3 id=\"responsiveness\">Responsiveness</h3>\n<p>Hiding tabs on small screens is not a user-friendly solution. If the tabs can&#39;t fit on one row on small screens, consider using utility classes to apply additional responsive styles or use a different pattern.</p>\n<h3 id=\"general-guidance\">General guidance</h3>\n<ul>\n<li>The content within tab panels should be related.</li>\n<li>Each Tab label should be descriptive of its content and set the user&#39;s expectations. Labels shoud be no more than two words.</li>\n<li>A maximum of three tabs should be displayed. Consider using a different pattern if your content requries being split into more than three panels.</li>\n</ul>\n<h2 id=\"further-reading\">Further reading</h2>\n<ul>\n<li><a href=\"https://24ways.org/2015/how-tabs-should-work/\">How Tabs Should Work</a></li>\n<li><a href=\"http://heydonworks.com/practical_aria_examples/#tab-interface\">Simple ARIA tab interface</a></li>\n</ul>","reference":"components.tabs.guidance","referenceNumber":"3.8.1","referenceURI":"design-system/components/tabs/guidance","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.tabs"}],"status":"prototype","parentReference":"components"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Tabs","description":"<p>Tabs can be used as a navigation pattern, allowing a user to switch between panels of related content within the same context.</p>","reference":"components.tabs","referenceNumber":"3.8","referenceURI":"design-system/components/tabs","weight":0,"markup":"<div class=\"ds-c-tabs\" role=\"tablist\" aria-label=\"Settings\">\n  <a\n    class=\"ds-c-tabs__item\"\n    href=\"#panel-profile\"\n    role=\"tab\"\n    aria-selected=\"true\"\n    aria-controls=\"panel-profile\"\n    id=\"tab-profile\"\n  >\n    <svg class=\"ds-u-margin-right--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n      <use xlink:href=\"/design-system/public/images/symbols.svg#placeholder\"></use>\n    </svg>Profile\n  </a>\n  <a\n    class=\"ds-c-tabs__item\"\n    href=\"#panel-comms\"\n    role=\"tab\"\n    aria-selected=\"false\"\n    aria-controls=\"panel-comms\"\n    id=\"tab-comms\"\n  >\n    <svg class=\"ds-u-margin-right--1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n      <use xlink:href=\"/design-system/public/images/symbols.svg#placeholder\"></use>\n    </svg>Communication preferences\n  </a>\n</div>\n<div class=\"ds-c-tabs__panel\" id=\"panel-profile\" aria-labelledby=\"tab-profile\" role=\"tabpanel\">\n  Note: This is just an example of the HTML markup. See the React example for\n  a functioning example.\n</div>\n<div class=\"ds-c-tabs__panel\" id=\"panel-comms\" aria-hidden=\"true\" aria-labelledby=\"tab-comms\" aria-selected=\"false\" role=\"tabpanel\">\n  Communication preferences content\n</div>","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":2,"modifiers":[],"sections":[{"header":"<code>&#x3C;Tabs&#x3E;</code>","description":"","reference":"components.tabs.react-tabs","referenceNumber":"3.8.4","referenceURI":"design-system/components/tabs/react-tabs","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Tabs","parentReference":"components.tabs"},{"header":"<code>&#x3C;TabPanel&#x3E;</code>","description":"","reference":"components.tabs.react-tabpanel","referenceNumber":"3.8.3","referenceURI":"design-system/components/tabs/react-tabpanel","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"hideExample":true,"reactComponent":"TabPanel","parentReference":"components.tabs"},{"header":"<code>&#x3C;Tab&#x3E;</code>","description":"","reference":"components.tabs.react-tab","referenceNumber":"3.8.2","referenceURI":"design-system/components/tabs/react-tab","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"Tab","parentReference":"components.tabs"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>If you have 2-3 panels of related content that needs to be condensed.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>If you have more than three tabs. Consider using a different pattern if your content requires being split into more than three panels.</li>\n<li>If the panel contents aren&#39;t related.</li>\n<li>If the panel contents can be displayed at once. This will improve the scanability of your page&#39;s content and it&#39;s more likely the user will be able to find what they&#39;re looking for.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Don&#39;t hide tabs on small screens. If the tabs can&#39;t fit on one row on small screens, consider using utility classes to apply additional responsive styles or use a different pattern.</li>\n<li>Each Tab label should be descriptive of its content and set the user&#39;s expectations. Labels should be no more than two words.</li>\n</ul>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Use an anchor link (<code>a</code>) to create the tabs. This allows you to link directly to a tab, and allows you to progressively enhance the page, retaining default browser behavior like opening links in a new window. Note: You&#39;ll need to implement the logic for selecting the correct tab based on the current URL.</li>\n<li>Ensure the HTML markup includes the proper ARIA attributes:<ul>\n<li>For tabs: <code>role</code>, <code>aria-selected</code>, <code>aria-controls</code></li>\n<li>For the tabs list parent: <code>role</code>, <code>aria-label</code></li>\n<li>For a tab panel: <code>role</code>, <code>aria-labelledby</code></li>\n</ul>\n</li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"https://24ways.org/2015/how-tabs-should-work/\">How Tabs Should Work</a></li>\n<li><a href=\"http://heydonworks.com/practical_aria_examples/#tab-interface\">Simple ARIA tab interface</a></li>\n</ul>","reference":"components.tabs.guidance","referenceNumber":"3.8.1","referenceURI":"design-system/components/tabs/guidance","weight":0,"markup":"","source":{"filename":"components/Tabs/Tabs.scss","path":"packages/core/src/components/Tabs/Tabs.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.tabs"}],"status":"beta","parentReference":"components"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/components/text-field/index.html b/docs/components/text-field/index.html
index f69a3cf066..e4cdbf5422 100644
--- a/docs/components/text-field/index.html
+++ b/docs/components/text-field/index.html
@@ -2,14 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Text field - CMSgov Design System</title>
+  <title>Text field - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="188771004"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-u-fill--warn ds-u-color--base" data-reactid="12">prototype</span><h1 class="ds-display" id="components.text-field" data-reactid="13">Text field</h1><div class="ds-u-clearfix" data-reactid="14"></div><code class="ds-u-font-size--small" data-reactid="15">components/TextField/TextField.scss</code><p data-reactid="16"><a href="https://standards.usa.gov/components/form-controls/#text-input" data-reactid="17">US Web Design Standard</a></p></heading><div data-reactid="18"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="19"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="20">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="21">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="22"><article class="ds-u-margin-y--6 l-content" data-reactid="23"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="24"><p>A text field can be an <code>input</code> or <code>textarea</code> HTML element.</p></div><section class="ds-u-margin-top--3" data-reactid="25"><div class="markup markup--html" data-reactid="26"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="27"><label class="ds-c-label ds-u-margin-top--0" for="input-firstname">
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1000225226"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-c-badge--success" data-reactid="10">recommended</span><h1 class="ds-display" id="components.text-field" data-reactid="11">Text field</h1><div class="ds-u-clearfix" data-reactid="12"></div><code class="ds-u-font-size--small" data-reactid="13">components/TextField/TextField.scss</code><p data-reactid="14"><a href="https://standards.usa.gov/components/form-controls/#text-input" data-reactid="15">US Web Design Standard</a></p></heading><div data-reactid="16"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="17"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="18">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="19">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="20"><article class="ds-u-margin-y--6 l-content" data-reactid="21"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="22"><p>Text fields allow people to enter any combination of letters, numbers, or symbols of their choosing (unless otherwise restricted). Text fields can span single or multiple lines.</p></div><section class="ds-u-margin-top--3" data-reactid="23"><div class="markup markup--html" data-reactid="24"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="25"><label class="ds-c-label ds-u-margin-top--0" for="input-firstname">
   First name
   <span class="ds-c-field__hint">Helpful hint text</span>
 </label>
@@ -25,7 +25,7 @@
 <label class="ds-c-label" for="input-username">Username</label>
 <input class="ds-c-field ds-c-field--success" id="input-username" name="username" type="text">
 <label class="ds-c-label" for="input-bio">Bio</label>
-<textarea class="ds-c-field" id="input-bio" name="bio" rows="5"></textarea></div><details class="ds-u-margin-bottom--2" data-reactid="28"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="29">Code snippet</summary><pre class="language-markup" data-reactid="30"><code data-reactid="31"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label ds-u-margin-top--0<span class="token punctuation">"</span></span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>input-firstname<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+<textarea class="ds-c-field" id="input-bio" name="bio" rows="5"></textarea></div><details class="ds-u-margin-bottom--2" data-reactid="26"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="27">Code snippet</summary><pre class="language-markup" data-reactid="28"><code data-reactid="29"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label ds-u-margin-top--0<span class="token punctuation">"</span></span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>input-firstname<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   First name
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field__hint<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Helpful hint text<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
@@ -41,7 +41,7 @@
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label<span class="token punctuation">"</span></span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>input-username<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Username<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field ds-c-field--success<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>input-username<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>username<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label<span class="token punctuation">"</span></span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>input-bio<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Bio<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>textarea</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>input-bio<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>bio<span class="token punctuation">"</span></span> <span class="token attr-name">rows</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>5<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>textarea</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="32"><div data-reactid="33"><h1 class="ds-h1" id="components.text-field.inverse" data-reactid="34">Inverse theme</h1><code class="ds-u-font-size--small" data-reactid="35">components/TextField/TextField.scss</code></div><section class="ds-u-margin-top--3" data-reactid="36"><div class="markup markup--html" data-reactid="37"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="38"><div class="ds-base--inverse ds-u-padding--2">
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>textarea</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>input-bio<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>bio<span class="token punctuation">"</span></span> <span class="token attr-name">rows</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>5<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>textarea</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="30"><section class="ds-u-margin-top--3" data-reactid="31"><div class="markup markup--html" data-reactid="32"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="33"><div class="ds-base--inverse ds-u-padding--2">
   <label class="ds-c-label ds-u-margin-top--0" for="input-firstname-2">
     First name
     <span class="ds-c-field__hint ds-c-field__hint--inverse">Helpful hint text</span>
@@ -59,7 +59,7 @@
   <input class="ds-c-field ds-c-field--inverse ds-c-field--success" id="input-username-2" name="username" type="text">
   <label class="ds-c-label" for="input-bio-2">Bio</label>
   <textarea class="ds-c-field ds-c-field--inverse" id="input-bio-2" name="bio" rows="5"></textarea>
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="39"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="40">Code snippet</summary><pre class="language-markup" data-reactid="41"><code data-reactid="42"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-base--inverse ds-u-padding--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="34"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="35">Code snippet</summary><pre class="language-markup" data-reactid="36"><code data-reactid="37"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-base--inverse ds-u-padding--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label ds-u-margin-top--0<span class="token punctuation">"</span></span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>input-firstname-2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     First name
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field__hint ds-c-field__hint--inverse<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Helpful hint text<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
@@ -77,10 +77,10 @@
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field ds-c-field--inverse ds-c-field--success<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>input-username-2<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>username<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label<span class="token punctuation">"</span></span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>input-bio-2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Bio<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>textarea</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field ds-c-field--inverse<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>input-bio-2<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>bio<span class="token punctuation">"</span></span> <span class="token attr-name">rows</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>5<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>textarea</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="43"><div data-reactid="44"><h1 class="ds-h1" id="components.text-field.react" data-reactid="45">React - <code>&#x3C;TextField&#x3E;</code></h1><code class="ds-u-font-size--small" data-reactid="46">components/TextField/TextField</code></div><section data-reactid="47"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="48"><p>The <code>TextField</code> component affords a user to type text into a form.
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="38"><div data-reactid="39"><h2 class="ds-h2" id="components.text-field.react" data-reactid="40"><code>&#x3C;TextField&#x3E;</code></h2><code class="ds-u-font-size--small" data-reactid="41">components/TextField/TextField.jsx</code></div><section data-reactid="42"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="43"><p>The <code>TextField</code> component affords a user to type text into a form.
 By default it renders a field for capturing a single line of text,
 but can be configured to support multiline text.</p>
-</div><div class="markup markup--react" data-reactid="49"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="50"><div data-reactid="51"><div class="ds-u-clearfix" data-reactid="52"><label class="ds-c-label ds-u-margin-top--0" for="textfield_27" data-reactid="53"><span data-reactid="54">Single line</span></label><input type="text" class="ds-c-field" id="textfield_27" name="single_example" value="Example value" data-reactid="55"/></div><div class="ds-u-clearfix" data-reactid="56"><label class="ds-c-label" for="textfield_28" data-reactid="57"><span class="ds-u-font-weight--bold" data-reactid="58">Multiline</span><span class="ds-c-field__hint ds-u-color--error" id="textfield_28-message" role="alert" data-reactid="59">Error message example</span><span class="ds-c-field__hint" data-reactid="60">Example of a multiline field with an error</span></label><textarea class="ds-c-field ds-c-field--error" id="textfield_28" name="multiline_example" data-reactid="61"></textarea></div><div class="ds-u-clearfix" data-reactid="62"><label class="ds-c-label" for="textfield_29" data-reactid="63"><span data-reactid="64">Disabled field</span></label><input type="text" class="ds-c-field" disabled="" id="textfield_29" name="disabled_example" value="Example value" data-reactid="65"/></div><div class="ds-u-clearfix" data-reactid="66"><label class="ds-c-label" for="textfield_30" data-reactid="67"><span data-reactid="68">Password field</span></label><input type="password" class="ds-c-field" id="textfield_30" name="disabled_example" data-reactid="69"/></div><div class="ds-base--inverse ds-u-margin-top--3 ds-u-padding--2" data-reactid="70"><div class="ds-u-clearfix" data-reactid="71"><label class="ds-c-label ds-u-margin-top--0" for="textfield_31" data-reactid="72"><span data-reactid="73">Single line</span></label><input type="text" class="ds-c-field ds-c-field--inverse" id="textfield_31" name="inversed_single_example" data-reactid="74"/></div><div class="ds-u-clearfix" data-reactid="75"><label class="ds-c-label" for="textfield_32" data-reactid="76"><span data-reactid="77">Disabled field</span></label><input type="text" class="ds-c-field ds-c-field--inverse" disabled="" id="textfield_32" name="inversed_disabled_example" data-reactid="78"/></div></div></div></div><details class="ds-u-margin-bottom--2" data-reactid="79"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="80">Code snippet</summary><pre class="language-jsx" data-reactid="81"><code data-reactid="82"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">></span></span>
+</div><div class="markup markup--react" data-reactid="44"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="45"><div data-reactid="46"><div class="ds-u-clearfix" data-reactid="47"><label class="ds-c-label ds-u-margin-top--0" for="textfield_27" data-reactid="48"><span data-reactid="49">Single line</span></label><input type="text" class="ds-c-field" id="textfield_27" name="single_example" value="Example value" data-reactid="50"/></div><div class="ds-u-clearfix" data-reactid="51"><label class="ds-c-label" for="textfield_28" data-reactid="52"><span class="ds-u-font-weight--bold" data-reactid="53">Multiline</span><span class="ds-c-field__hint ds-u-color--error" id="textfield_28-message" role="alert" data-reactid="54">Error message example</span><span class="ds-c-field__hint" data-reactid="55">Example of a multiline field with an error</span></label><textarea class="ds-c-field ds-c-field--error" id="textfield_28" name="multiline_example" data-reactid="56"></textarea></div><div class="ds-u-clearfix" data-reactid="57"><label class="ds-c-label" for="textfield_29" data-reactid="58"><span data-reactid="59">Disabled field</span></label><input type="text" class="ds-c-field" disabled="" id="textfield_29" name="disabled_example" value="Example value" data-reactid="60"/></div><div class="ds-u-clearfix" data-reactid="61"><label class="ds-c-label" for="textfield_30" data-reactid="62"><span data-reactid="63">Password field</span></label><input type="password" class="ds-c-field" id="textfield_30" name="disabled_example" data-reactid="64"/></div><div class="ds-base--inverse ds-u-margin-top--3 ds-u-padding--2" data-reactid="65"><div class="ds-u-clearfix" data-reactid="66"><label class="ds-c-label ds-u-margin-top--0" for="textfield_31" data-reactid="67"><span data-reactid="68">Single line</span></label><input type="text" class="ds-c-field ds-c-field--inverse" id="textfield_31" name="inversed_single_example" data-reactid="69"/></div><div class="ds-u-clearfix" data-reactid="70"><label class="ds-c-label" for="textfield_32" data-reactid="71"><span data-reactid="72">Disabled field</span></label><input type="text" class="ds-c-field ds-c-field--inverse" disabled="" id="textfield_32" name="inversed_disabled_example" data-reactid="73"/></div></div></div></div><details class="ds-u-margin-bottom--2" data-reactid="74"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="75">Code snippet</summary><pre class="language-jsx" data-reactid="76"><code data-reactid="77"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>TextField</span>
     <span class="token attr-name">defaultValue</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Example</span> <span class="token attr-name">value"</span>
     <span class="token attr-name">label</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Single</span> <span class="token attr-name">line"</span>
@@ -119,47 +119,69 @@
       <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>inversed_disabled_example<span class="token punctuation">"</span></span>
     <span class="token punctuation">/></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="83">Props</h3><table class="ds-c-table" data-reactid="84"><thead data-reactid="85"><tr data-reactid="86"><td data-reactid="87">Name</td><td data-reactid="88">Type</td><td data-reactid="89">Default</td><td data-reactid="90">Description</td></tr></thead><tbody data-reactid="91"><tr data-reactid="92"><td data-reactid="93"><code class="ds-u-font-weight--bold" data-reactid="94">className</code></td><td data-reactid="95"><code data-reactid="96">string</code></td><td data-reactid="97"></td><td data-reactid="98"><div data-reactid="99"><p>Additional classes to be added to the root element</p>
-</div></td></tr><tr data-reactid="100"><td data-reactid="101"><code class="ds-u-font-weight--bold" data-reactid="102">defaultValue</code></td><td data-reactid="103"><code data-reactid="104">string</code></td><td data-reactid="105"></td><td data-reactid="106"><div data-reactid="107"><p>Default value of the text field, if any. Use this for an uncontrolled
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div><h3 data-reactid="78">Props</h3><table class="ds-c-table" data-reactid="79"><thead data-reactid="80"><tr data-reactid="81"><td data-reactid="82">Name</td><td data-reactid="83">Type</td><td data-reactid="84">Default</td><td data-reactid="85">Description</td></tr></thead><tbody data-reactid="86"><tr data-reactid="87"><td data-reactid="88"><code class="ds-u-font-weight--bold" data-reactid="89">className</code></td><td data-reactid="90"><code data-reactid="91">string</code></td><td data-reactid="92"></td><td data-reactid="93"><div data-reactid="94"><p>Additional classes to be added to the root element</p>
+</div></td></tr><tr data-reactid="95"><td data-reactid="96"><code class="ds-u-font-weight--bold" data-reactid="97">defaultValue</code></td><td data-reactid="98"><code data-reactid="99">string</code></td><td data-reactid="100"></td><td data-reactid="101"><div data-reactid="102"><p>Default value of the text field, if any. Use this for an uncontrolled
 component; otherwise, use the <code>value</code> property</p>
-</div></td></tr><tr data-reactid="108"><td data-reactid="109"><code class="ds-u-font-weight--bold" data-reactid="110">disabled</code></td><td data-reactid="111"><code data-reactid="112">bool</code></td><td data-reactid="113"></td><td data-reactid="114"></td></tr><tr data-reactid="115"><td data-reactid="116"><code class="ds-u-font-weight--bold" data-reactid="117">errorMessage</code></td><td data-reactid="118"><code data-reactid="119">string</code></td><td data-reactid="120"></td><td data-reactid="121"></td></tr><tr data-reactid="122"><td data-reactid="123"><code class="ds-u-font-weight--bold" data-reactid="124">fieldClassName</code></td><td data-reactid="125"><code data-reactid="126">string</code></td><td data-reactid="127"></td><td data-reactid="128"><div data-reactid="129"><p>Additional classes to be added to the field element</p>
-</div></td></tr><tr data-reactid="130"><td data-reactid="131"><code class="ds-u-font-weight--bold" data-reactid="132">hint</code></td><td data-reactid="133"><code data-reactid="134">node</code></td><td data-reactid="135"></td><td data-reactid="136"><div data-reactid="137"><p>Hint text</p>
-</div></td></tr><tr data-reactid="138"><td data-reactid="139"><code class="ds-u-font-weight--bold" data-reactid="140">inversed</code></td><td data-reactid="141"><code data-reactid="142">bool</code></td><td data-reactid="143"></td><td data-reactid="144"><div data-reactid="145"><p>Applies the &quot;inverse&quot; UI theme</p>
-</div></td></tr><tr data-reactid="146"><td data-reactid="147"><code class="ds-u-font-weight--bold" data-reactid="148">label</code><p data-reactid="149"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="150">Required</span></p></td><td data-reactid="151"><code data-reactid="152">node</code></td><td data-reactid="153"></td><td data-reactid="154"><div data-reactid="155"><p>The label for the entire list of choices</p>
-</div></td></tr><tr data-reactid="156"><td data-reactid="157"><code class="ds-u-font-weight--bold" data-reactid="158">labelClassName</code></td><td data-reactid="159"><code data-reactid="160">string</code></td><td data-reactid="161"></td><td data-reactid="162"><div data-reactid="163"><p>Additional classes to be added to the <code>FormLabel</code></p>
-</div></td></tr><tr data-reactid="164"><td data-reactid="165"><code class="ds-u-font-weight--bold" data-reactid="166">multiline</code></td><td data-reactid="167"><code data-reactid="168">bool</code></td><td data-reactid="169"></td><td data-reactid="170"><div data-reactid="171"><p>Whether or not the textfield is a multiline textfield</p>
-</div></td></tr><tr data-reactid="172"><td data-reactid="173"><code class="ds-u-font-weight--bold" data-reactid="174">name</code><p data-reactid="175"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="176">Required</span></p></td><td data-reactid="177"><code data-reactid="178">string</code></td><td data-reactid="179"></td><td data-reactid="180"></td></tr><tr data-reactid="181"><td data-reactid="182"><code class="ds-u-font-weight--bold" data-reactid="183">onBlur</code></td><td data-reactid="184"><code data-reactid="185">func</code></td><td data-reactid="186"></td><td data-reactid="187"></td></tr><tr data-reactid="188"><td data-reactid="189"><code class="ds-u-font-weight--bold" data-reactid="190">onChange</code></td><td data-reactid="191"><code data-reactid="192">func</code></td><td data-reactid="193"></td><td data-reactid="194"></td></tr><tr data-reactid="195"><td data-reactid="196"><code class="ds-u-font-weight--bold" data-reactid="197">rows</code></td><td data-reactid="198"><code data-reactid="199">number, string</code></td><td data-reactid="200"></td><td data-reactid="201"><div data-reactid="202"><p>Optionally specify the number of visible text lines for the control. Only
+</div></td></tr><tr data-reactid="103"><td data-reactid="104"><code class="ds-u-font-weight--bold" data-reactid="105">disabled</code></td><td data-reactid="106"><code data-reactid="107">bool</code></td><td data-reactid="108"></td><td data-reactid="109"></td></tr><tr data-reactid="110"><td data-reactid="111"><code class="ds-u-font-weight--bold" data-reactid="112">errorMessage</code></td><td data-reactid="113"><code data-reactid="114">string</code></td><td data-reactid="115"></td><td data-reactid="116"></td></tr><tr data-reactid="117"><td data-reactid="118"><code class="ds-u-font-weight--bold" data-reactid="119">fieldClassName</code></td><td data-reactid="120"><code data-reactid="121">string</code></td><td data-reactid="122"></td><td data-reactid="123"><div data-reactid="124"><p>Additional classes to be added to the field element</p>
+</div></td></tr><tr data-reactid="125"><td data-reactid="126"><code class="ds-u-font-weight--bold" data-reactid="127">hint</code></td><td data-reactid="128"><code data-reactid="129">node</code></td><td data-reactid="130"></td><td data-reactid="131"><div data-reactid="132"><p>Hint text</p>
+</div></td></tr><tr data-reactid="133"><td data-reactid="134"><code class="ds-u-font-weight--bold" data-reactid="135">inversed</code></td><td data-reactid="136"><code data-reactid="137">bool</code></td><td data-reactid="138"></td><td data-reactid="139"><div data-reactid="140"><p>Applies the &quot;inverse&quot; UI theme</p>
+</div></td></tr><tr data-reactid="141"><td data-reactid="142"><code class="ds-u-font-weight--bold" data-reactid="143">label</code><p data-reactid="144"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="145">Required</span></p></td><td data-reactid="146"><code data-reactid="147">node</code></td><td data-reactid="148"></td><td data-reactid="149"><div data-reactid="150"><p>The label for the entire list of choices</p>
+</div></td></tr><tr data-reactid="151"><td data-reactid="152"><code class="ds-u-font-weight--bold" data-reactid="153">labelClassName</code></td><td data-reactid="154"><code data-reactid="155">string</code></td><td data-reactid="156"></td><td data-reactid="157"><div data-reactid="158"><p>Additional classes to be added to the <code>FormLabel</code></p>
+</div></td></tr><tr data-reactid="159"><td data-reactid="160"><code class="ds-u-font-weight--bold" data-reactid="161">multiline</code></td><td data-reactid="162"><code data-reactid="163">bool</code></td><td data-reactid="164"></td><td data-reactid="165"><div data-reactid="166"><p>Whether or not the textfield is a multiline textfield</p>
+</div></td></tr><tr data-reactid="167"><td data-reactid="168"><code class="ds-u-font-weight--bold" data-reactid="169">name</code><p data-reactid="170"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="171">Required</span></p></td><td data-reactid="172"><code data-reactid="173">string</code></td><td data-reactid="174"></td><td data-reactid="175"></td></tr><tr data-reactid="176"><td data-reactid="177"><code class="ds-u-font-weight--bold" data-reactid="178">onBlur</code></td><td data-reactid="179"><code data-reactid="180">func</code></td><td data-reactid="181"></td><td data-reactid="182"></td></tr><tr data-reactid="183"><td data-reactid="184"><code class="ds-u-font-weight--bold" data-reactid="185">onChange</code></td><td data-reactid="186"><code data-reactid="187">func</code></td><td data-reactid="188"></td><td data-reactid="189"></td></tr><tr data-reactid="190"><td data-reactid="191"><code class="ds-u-font-weight--bold" data-reactid="192">rows</code></td><td data-reactid="193"><code data-reactid="194">number, string</code></td><td data-reactid="195"></td><td data-reactid="196"><div data-reactid="197"><p>Optionally specify the number of visible text lines for the control. Only
 applicable if this is a multiline field</p>
-</div></td></tr><tr data-reactid="203"><td data-reactid="204"><code class="ds-u-font-weight--bold" data-reactid="205">type</code></td><td data-reactid="206"><code data-reactid="207">string</code></td><td data-reactid="208"><code data-reactid="209">&#x27;text&#x27;</code></td><td data-reactid="210"><div data-reactid="211"><p>Any valid <code>input</code> <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input">type</a>.</p>
-</div></td></tr><tr data-reactid="212"><td data-reactid="213"><code class="ds-u-font-weight--bold" data-reactid="214">value</code></td><td data-reactid="215"><code data-reactid="216">string</code></td><td data-reactid="217"></td><td data-reactid="218"><div data-reactid="219"><p>Current value of the text field. Use this for a controlled component where
+</div></td></tr><tr data-reactid="198"><td data-reactid="199"><code class="ds-u-font-weight--bold" data-reactid="200">type</code></td><td data-reactid="201"><code data-reactid="202">string</code></td><td data-reactid="203"><code data-reactid="204">&#x27;text&#x27;</code></td><td data-reactid="205"><div data-reactid="206"><p>Any valid <code>input</code> <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input">type</a>.</p>
+</div></td></tr><tr data-reactid="207"><td data-reactid="208"><code class="ds-u-font-weight--bold" data-reactid="209">value</code></td><td data-reactid="210"><code data-reactid="211">string</code></td><td data-reactid="212"></td><td data-reactid="213"><div data-reactid="214"><p>Current value of the text field. Use this for a controlled component where
 you are maintaining its current state; otherwise, use the <code>defaultValue</code> property</p>
-</div></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="220"><article class="ds-u-margin-y--6 l-content" data-reactid="221"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="222"><h2 id="accessibility">Accessibility</h2>
+</div></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="215"><article class="ds-u-margin-y--6 l-content" data-reactid="216"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="217"><h2 id="when-to-use">When to use</h2>
 <ul>
-<li>Display form controls in the same order in HTML as they appear on screen. Do not use CSS to rearrange the form controls. Screen readers narrate forms in the order they appear in the HTML.</li>
-<li>Visually align validation messages with the input fields, so people using screen magnifiers can read them quickly.</li>
-<li>Group each set of thematically related controls in a fieldset element. Use the legend element to offer a label within each one. The fieldset and legend elements make it easier for screen reader users to navigate the form.</li>
-<li>Use a single legend for fieldset (this is required). One example of a common use of fieldset and legend is a question with radio button options for answers. The question text and radio buttons are wrapped in a fieldset, with the question itself being inside the legend tag.</li>
-<li>Embed multiple fieldsets and legends for more complex forms.x</li>
-<li>Keep your form blocks in a vertical pattern. This approach is ideal, from an accessibility standpoint, because of limited vision that makes it hard to scan from right to left.</li>
+<li>If you can’t reasonably predict a user’s answer to a prompt and there might be wide variability in users’ answers.</li>
+<li>When using another type of input will make answering more difficult. For example, birthdays and other known dates are easier to type in than they are to select from a calendar picker.</li>
+<li>When users want to paste in a response.</li>
 </ul>
-<h2 id="usability">Usability</h2>
-<h3 id="guidance">Guidance</h3>
+<h2 id="when-to-consider-alternatives">When to consider alternatives</h2>
 <ul>
-<li>The length of the text input provides a hint to users as to how much text to write. Do not require users to write paragraphs of text into a single-line <code>input</code> box; use a <code>textarea</code> instead.</li>
-<li>Text inputs are among the easiest type of input for desktop users but are more difficult for mobile users.</li>
-<li>Only show error messages or stylings after a user has interacted with a particular field.</li>
-<li>Avoid using placeholder text that appears within a text field before a user starts typing. If placeholder text is no longer visible after a user clicks into the field, users will no longer have that text available when they need to review their entries. (People who have cognitive or visual disabilities have additional problems with placeholder text.)</li>
+<li>When users are choosing from a specific set of options. Consider checkboxes, radio buttons, or a select menu in these cases.</li>
+</ul>
+<h2 id="guidance">Guidance</h2>
+<ul>
+<li>Don&#39;t use placeholder text in form fields. Use hint text instead, if you need to provide contextual information. Placeholder text disappears after a user types a value, therefore users will no longer have that text available when they need to review their entries. People who have cognitive or visual disabilities have additional problems with placeholder text.</li>
+<li>The length of the text field provides a hint to users as to how much text to write. Do not require users to write paragraphs of text into a single-line <code>input</code> box; use a <code>textarea</code> instead.</li>
+<li>Text fields are among the easiest type of input for desktop users but are more difficult for mobile users.</li>
+<li>Only show error messages or styling after a user has interacted with a particular field.</li>
+</ul>
+<p><strong><a href="/design-system/guidelines/forms/">View the &quot;Forms&quot; guidelines for additional guidance and best practices.</a></strong></p>
+<h2 id="accessibility">Accessibility</h2>
+<ul>
+<li>Group each set of thematically related controls in a <code>fieldset</code> element. Use the <code>legend</code> element to offer a label within each <code>fieldset</code>. The <code>fieldset</code> and <code>legend</code> elements make it easier for screen reader users to navigate the form.</li>
+<li>Keep your form blocks in a vertical pattern. This approach is ideal, from an accessibility standpoint, because of limited vision that makes it hard to scan from left to right.</li>
 </ul>
 <h2 id="theming">Theming</h2>
-<p>The following Sass variables can be overridden to theme a field: <code>$color-focus</code>, <code>$color-focus-inverse</code>, <code>$focus-shadow</code>, <code>$focus-shadow-inverse</code>, <code>$input-border-color</code>, <code>$input-border-color-inverse</code>, <code>$input-border-radius</code>, <code>$input-line-height</code>, <code>$input-border-width</code>, <code>$input-padding</code></p>
-<h2 id="further-reading">Further reading</h2>
+<p>The following Sass variables can be overridden to theme a field:</p>
+<ul>
+<li><code>$color-focus</code></li>
+<li><code>$color-focus-inverse</code></li>
+<li><code>$focus-shadow</code></li>
+<li><code>$focus-shadow-inverse</code></li>
+<li><code>$input-border-color</code></li>
+<li><code>$input-border-color-inverse</code></li>
+<li><code>$input-border-radius</code></li>
+<li><code>$input-line-height</code></li>
+<li><code>$input-border-width</code></li>
+<li><code>$input-padding</code></li>
+</ul>
+<h2 id="learn-more">Learn more</h2>
 <ul>
+<li><a href="/design-system/guidelines/forms/">Form Guidelines</a></li>
 <li><a href="https://www.nngroup.com/articles/form-design-placeholders/">&quot;Placeholders in Form Fields Are Harmful&quot;</a></li>
+<li><a href="https://designnotes.blog.gov.uk/2013/12/05/asking-for-a-date-of-birth/">Asking for a date of birth</a></li>
+<li><a href="https://paper.dropbox.com/doc/Text-boxes-8NLlgz9tjR8OzTz2N9wE3">GOV.UK text boxes discussion</a></li>
+<li><a href="http://www.formsthatwork.com/files/Articles/dropdown.pdf">Four steps for choosing form elements on the Web (PDF)</a></li>
 </ul></div></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Text field","description":"<p>A text field can be an <code>input</code> or <code>textarea</code> HTML element.</p>","reference":"components.text-field","referenceNumber":"3.9","referenceURI":"design-system/components/text-field","weight":0,"markup":"<label class=\"ds-c-label ds-u-margin-top--0\" for=\"input-firstname\">\n  First name\n  <span class=\"ds-c-field__hint\">Helpful hint text</span>\n</label>\n<input class=\"ds-c-field\" id=\"input-firstname\" name=\"firstname\" type=\"text\">\n<label class=\"ds-c-label\" for=\"input-lastname\">\n  <span class=\"ds-u-font-weight--bold\">Last name</span>\n  <span class=\"ds-c-field__hint ds-u-color--error\" role=\"alert\">\n    Please enter your last name\n  </span>\n  <span class=\"ds-c-field__hint\">Helpful hint text</span>\n</label>\n<input class=\"ds-c-field ds-c-field--error\" id=\"input-lastname\" name=\"lastname\" type=\"text\" />\n<label class=\"ds-c-label\" for=\"input-username\">Username</label>\n<input class=\"ds-c-field ds-c-field--success\" id=\"input-username\" name=\"username\" type=\"text\">\n<label class=\"ds-c-label\" for=\"input-bio\">Bio</label>\n<textarea class=\"ds-c-field\" id=\"input-bio\" name=\"bio\" rows=\"5\"></textarea>","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Inverse theme","description":"","reference":"components.text-field.inverse","referenceNumber":"3.9.2","referenceURI":"design-system/components/text-field/inverse","weight":0,"markup":"<div class=\"ds-base--inverse ds-u-padding--2\">\n  <label class=\"ds-c-label ds-u-margin-top--0\" for=\"input-firstname-2\">\n    First name\n    <span class=\"ds-c-field__hint ds-c-field__hint--inverse\">Helpful hint text</span>\n  </label>\n  <input class=\"ds-c-field ds-c-field--inverse\" id=\"input-firstname-2\" name=\"firstname\" type=\"text\">\n  <label class=\"ds-c-label\" for=\"input-lastname-2\">\n    <span class=\"ds-u-font-weight--bold\">Last name</span>\n    <span class=\"ds-c-field__hint ds-u-color--error-light\" role=\"alert\">\n      Please enter your last name\n    </span>\n    <span class=\"ds-c-field__hint ds-c-field__hint--inverse\">Helpful hint text</span>\n  </label>\n  <input class=\"ds-c-field ds-c-field--inverse ds-c-field--error\" id=\"input-lastname-2\" name=\"lastname\" type=\"text\">\n  <label class=\"ds-c-label\" for=\"input-username-2\">Username</label>\n  <input class=\"ds-c-field ds-c-field--inverse ds-c-field--success\" id=\"input-username-2\" name=\"username\" type=\"text\">\n  <label class=\"ds-c-label\" for=\"input-bio-2\">Bio</label>\n  <textarea class=\"ds-c-field ds-c-field--inverse\" id=\"input-bio-2\" name=\"bio\" rows=\"5\"></textarea>\n</div>","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.text-field"},{"header":"React - <code>&#x3C;TextField&#x3E;</code>","description":"","reference":"components.text-field.react","referenceNumber":"3.9.3","referenceURI":"design-system/components/text-field/react","weight":0,"markup":"","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"TextField","parentReference":"components.text-field"},{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Display form controls in the same order in HTML as they appear on screen. Do not use CSS to rearrange the form controls. Screen readers narrate forms in the order they appear in the HTML.</li>\n<li>Visually align validation messages with the input fields, so people using screen magnifiers can read them quickly.</li>\n<li>Group each set of thematically related controls in a fieldset element. Use the legend element to offer a label within each one. The fieldset and legend elements make it easier for screen reader users to navigate the form.</li>\n<li>Use a single legend for fieldset (this is required). One example of a common use of fieldset and legend is a question with radio button options for answers. The question text and radio buttons are wrapped in a fieldset, with the question itself being inside the legend tag.</li>\n<li>Embed multiple fieldsets and legends for more complex forms.x</li>\n<li>Keep your form blocks in a vertical pattern. This approach is ideal, from an accessibility standpoint, because of limited vision that makes it hard to scan from right to left.</li>\n</ul>\n<h2 id=\"usability\">Usability</h2>\n<h3 id=\"guidance\">Guidance</h3>\n<ul>\n<li>The length of the text input provides a hint to users as to how much text to write. Do not require users to write paragraphs of text into a single-line <code>input</code> box; use a <code>textarea</code> instead.</li>\n<li>Text inputs are among the easiest type of input for desktop users but are more difficult for mobile users.</li>\n<li>Only show error messages or stylings after a user has interacted with a particular field.</li>\n<li>Avoid using placeholder text that appears within a text field before a user starts typing. If placeholder text is no longer visible after a user clicks into the field, users will no longer have that text available when they need to review their entries. (People who have cognitive or visual disabilities have additional problems with placeholder text.)</li>\n</ul>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme a field: <code>$color-focus</code>, <code>$color-focus-inverse</code>, <code>$focus-shadow</code>, <code>$focus-shadow-inverse</code>, <code>$input-border-color</code>, <code>$input-border-color-inverse</code>, <code>$input-border-radius</code>, <code>$input-line-height</code>, <code>$input-border-width</code>, <code>$input-padding</code></p>\n<h2 id=\"further-reading\">Further reading</h2>\n<ul>\n<li><a href=\"https://www.nngroup.com/articles/form-design-placeholders/\">&quot;Placeholders in Form Fields Are Harmful&quot;</a></li>\n</ul>","reference":"components.text-field.guidance","referenceNumber":"3.9.1","referenceURI":"design-system/components/text-field/guidance","weight":0,"markup":"","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.text-field"}],"status":"prototype","uswdsUrl":"https://standards.usa.gov/components/form-controls/#text-input","parentReference":"components"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Text field","description":"<p>Text fields allow people to enter any combination of letters, numbers, or symbols of their choosing (unless otherwise restricted). Text fields can span single or multiple lines.</p>","reference":"components.text-field","referenceNumber":"3.9","referenceURI":"design-system/components/text-field","weight":0,"markup":"<label class=\"ds-c-label ds-u-margin-top--0\" for=\"input-firstname\">\n  First name\n  <span class=\"ds-c-field__hint\">Helpful hint text</span>\n</label>\n<input class=\"ds-c-field\" id=\"input-firstname\" name=\"firstname\" type=\"text\">\n<label class=\"ds-c-label\" for=\"input-lastname\">\n  <span class=\"ds-u-font-weight--bold\">Last name</span>\n  <span class=\"ds-c-field__hint ds-u-color--error\" role=\"alert\">\n    Please enter your last name\n  </span>\n  <span class=\"ds-c-field__hint\">Helpful hint text</span>\n</label>\n<input class=\"ds-c-field ds-c-field--error\" id=\"input-lastname\" name=\"lastname\" type=\"text\" />\n<label class=\"ds-c-label\" for=\"input-username\">Username</label>\n<input class=\"ds-c-field ds-c-field--success\" id=\"input-username\" name=\"username\" type=\"text\">\n<label class=\"ds-c-label\" for=\"input-bio\">Bio</label>\n<textarea class=\"ds-c-field\" id=\"input-bio\" name=\"bio\" rows=\"5\"></textarea>","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"","reference":"components.text-field.inverse","referenceNumber":"3.9.2","referenceURI":"design-system/components/text-field/inverse","weight":0,"markup":"<div class=\"ds-base--inverse ds-u-padding--2\">\n  <label class=\"ds-c-label ds-u-margin-top--0\" for=\"input-firstname-2\">\n    First name\n    <span class=\"ds-c-field__hint ds-c-field__hint--inverse\">Helpful hint text</span>\n  </label>\n  <input class=\"ds-c-field ds-c-field--inverse\" id=\"input-firstname-2\" name=\"firstname\" type=\"text\">\n  <label class=\"ds-c-label\" for=\"input-lastname-2\">\n    <span class=\"ds-u-font-weight--bold\">Last name</span>\n    <span class=\"ds-c-field__hint ds-u-color--error-light\" role=\"alert\">\n      Please enter your last name\n    </span>\n    <span class=\"ds-c-field__hint ds-c-field__hint--inverse\">Helpful hint text</span>\n  </label>\n  <input class=\"ds-c-field ds-c-field--inverse ds-c-field--error\" id=\"input-lastname-2\" name=\"lastname\" type=\"text\">\n  <label class=\"ds-c-label\" for=\"input-username-2\">Username</label>\n  <input class=\"ds-c-field ds-c-field--inverse ds-c-field--success\" id=\"input-username-2\" name=\"username\" type=\"text\">\n  <label class=\"ds-c-label\" for=\"input-bio-2\">Bio</label>\n  <textarea class=\"ds-c-field ds-c-field--inverse\" id=\"input-bio-2\" name=\"bio\" rows=\"5\"></textarea>\n</div>","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.text-field"},{"header":"<code>&#x3C;TextField&#x3E;</code>","description":"","reference":"components.text-field.react","referenceNumber":"3.9.3","referenceURI":"design-system/components/text-field/react","weight":0,"markup":"","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"TextField","parentReference":"components.text-field"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>If you can’t reasonably predict a user’s answer to a prompt and there might be wide variability in users’ answers.</li>\n<li>When using another type of input will make answering more difficult. For example, birthdays and other known dates are easier to type in than they are to select from a calendar picker.</li>\n<li>When users want to paste in a response.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>When users are choosing from a specific set of options. Consider checkboxes, radio buttons, or a select menu in these cases.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Don&#39;t use placeholder text in form fields. Use hint text instead, if you need to provide contextual information. Placeholder text disappears after a user types a value, therefore users will no longer have that text available when they need to review their entries. People who have cognitive or visual disabilities have additional problems with placeholder text.</li>\n<li>The length of the text field provides a hint to users as to how much text to write. Do not require users to write paragraphs of text into a single-line <code>input</code> box; use a <code>textarea</code> instead.</li>\n<li>Text fields are among the easiest type of input for desktop users but are more difficult for mobile users.</li>\n<li>Only show error messages or styling after a user has interacted with a particular field.</li>\n</ul>\n<p><strong><a href=\"/design-system/guidelines/forms/\">View the &quot;Forms&quot; guidelines for additional guidance and best practices.</a></strong></p>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Group each set of thematically related controls in a <code>fieldset</code> element. Use the <code>legend</code> element to offer a label within each <code>fieldset</code>. The <code>fieldset</code> and <code>legend</code> elements make it easier for screen reader users to navigate the form.</li>\n<li>Keep your form blocks in a vertical pattern. This approach is ideal, from an accessibility standpoint, because of limited vision that makes it hard to scan from left to right.</li>\n</ul>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme a field:</p>\n<ul>\n<li><code>$color-focus</code></li>\n<li><code>$color-focus-inverse</code></li>\n<li><code>$focus-shadow</code></li>\n<li><code>$focus-shadow-inverse</code></li>\n<li><code>$input-border-color</code></li>\n<li><code>$input-border-color-inverse</code></li>\n<li><code>$input-border-radius</code></li>\n<li><code>$input-line-height</code></li>\n<li><code>$input-border-width</code></li>\n<li><code>$input-padding</code></li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"/design-system/guidelines/forms/\">Form Guidelines</a></li>\n<li><a href=\"https://www.nngroup.com/articles/form-design-placeholders/\">&quot;Placeholders in Form Fields Are Harmful&quot;</a></li>\n<li><a href=\"https://designnotes.blog.gov.uk/2013/12/05/asking-for-a-date-of-birth/\">Asking for a date of birth</a></li>\n<li><a href=\"https://paper.dropbox.com/doc/Text-boxes-8NLlgz9tjR8OzTz2N9wE3\">GOV.UK text boxes discussion</a></li>\n<li><a href=\"http://www.formsthatwork.com/files/Articles/dropdown.pdf\">Four steps for choosing form elements on the Web (PDF)</a></li>\n</ul>","reference":"components.text-field.guidance","referenceNumber":"3.9.1","referenceURI":"design-system/components/text-field/guidance","weight":0,"markup":"","source":{"filename":"components/TextField/TextField.scss","path":"packages/core/src/components/TextField/TextField.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.text-field"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/form-controls/#text-input","parentReference":"components"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/components/vertical-nav/index.html b/docs/components/vertical-nav/index.html
index 1247b2ccde..3ae56b0896 100644
--- a/docs/components/vertical-nav/index.html
+++ b/docs/components/vertical-nav/index.html
@@ -2,34 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Vertical navigation - CMSgov Design System</title>
+  <title>Vertical navigation - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1832222022"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-u-fill--warn ds-u-color--base" data-reactid="12">beta</span><h1 class="ds-display" id="components.vertical-nav" data-reactid="13">Vertical navigation</h1><div class="ds-u-clearfix" data-reactid="14"></div><code class="ds-u-font-size--small" data-reactid="15">components/VerticalNav/VerticalNav.scss</code><p data-reactid="16"><a href="https://standards.usa.gov/components/sidenav/" data-reactid="17">US Web Design Standard</a></p></heading><div data-reactid="18"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="19"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="20">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="21">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="22"><article class="ds-u-margin-y--6 l-content" data-reactid="23"><section class="ds-u-margin-top--3" data-reactid="24"><div class="markup markup--html" data-reactid="25"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="26"><ul class="ds-c-vertical-nav">
-  <li class="ds-c-vertical-nav__item">
-    <a class="ds-c-vertical-nav__link ds-c-vertical-nav__link--current" href="http://example.com">Current page</a>
-  </li>
-  <li class="ds-c-vertical-nav__item">
-    <a class="ds-c-vertical-nav__link" href="http://example.com">Parent link</a>
-  </li>
-  <li class="ds-c-vertical-nav__item">
-    <a class="ds-c-vertical-nav__link" href="http://example.com">Parent link</a>
-  </li>
-</ul></div><details class="ds-u-margin-bottom--2" data-reactid="27"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="28">Code snippet</summary><pre class="language-markup" data-reactid="29"><code data-reactid="30"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ul</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-vertical-nav<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>li</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-vertical-nav__item<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
-    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-vertical-nav__link ds-c-vertical-nav__link--current<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>http://example.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Current page<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>li</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-vertical-nav__item<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
-    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-vertical-nav__link<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>http://example.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Parent link<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>li</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-vertical-nav__item<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
-    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-vertical-nav__link<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>http://example.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Parent link<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">></span></span>
-  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>ul</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="31"><div data-reactid="32"><h1 class="ds-h1" id="components.vertical-nav.nested" data-reactid="33">Nested menus</h1><code class="ds-u-font-size--small" data-reactid="34">components/VerticalNav/VerticalNav.scss</code></div><section class="ds-u-margin-top--3" data-reactid="35"><div class="markup markup--html" data-reactid="36"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="37"><ul class="ds-c-vertical-nav">
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1159329026"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><span class="ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-c-badge--success" data-reactid="10">recommended</span><h1 class="ds-display" id="components.vertical-nav" data-reactid="11">Vertical navigation</h1><div class="ds-u-clearfix" data-reactid="12"></div><code class="ds-u-font-size--small" data-reactid="13">components/VerticalNav/VerticalNav.scss</code><p data-reactid="14"><a href="https://standards.usa.gov/components/sidenav/" data-reactid="15">US Web Design Standard</a></p></heading><div data-reactid="16"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="17"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="18">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="19">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="20"><article class="ds-u-margin-y--6 l-content" data-reactid="21"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="22"><p>Hierarchical, vertical navigation.</p></div><section class="ds-u-margin-top--3" data-reactid="23"><div class="markup markup--html" data-reactid="24"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="25"><ul class="ds-c-vertical-nav">
   <li class="ds-c-vertical-nav__item">
     <a class="ds-c-vertical-nav__link" href="http://example.com">Parent link</a>
   </li>
@@ -58,7 +38,7 @@
   <li class="ds-c-vertical-nav__item">
     <a class="ds-c-vertical-nav__link" href="http://example.com">Parent link</a>
   </li>
-</ul></div><details class="ds-u-margin-bottom--2" data-reactid="38"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="39">Code snippet</summary><pre class="language-markup" data-reactid="40"><code data-reactid="41"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ul</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-vertical-nav<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</ul></div><details class="ds-u-margin-bottom--2" data-reactid="26"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="27">Code snippet</summary><pre class="language-markup" data-reactid="28"><code data-reactid="29"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ul</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-vertical-nav<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>li</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-vertical-nav__item<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-vertical-nav__link<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>http://example.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Parent link<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
@@ -87,9 +67,9 @@
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>li</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-vertical-nav__item<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-vertical-nav__link<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>http://example.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Parent link<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>li</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>ul</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="42"><div data-reactid="43"><h1 class="ds-h1" id="components.vertical-nav.VerticalNav" data-reactid="44">React - <code>&#x3C;VerticalNav&#x3E;</code></h1><code class="ds-u-font-size--small" data-reactid="45">components/VerticalNav/VerticalNav</code></div><section data-reactid="46"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="47"><p>The <code>VerticalNav</code> React component accepts list items as a JSON object and
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>ul</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="30"><div data-reactid="31"><h2 class="ds-h2" id="components.vertical-nav.VerticalNav" data-reactid="32"><code>&#x3C;VerticalNav&#x3E;</code></h2><code class="ds-u-font-size--small" data-reactid="33">components/VerticalNav/VerticalNav.jsx</code></div><section data-reactid="34"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="35"><p>The <code>VerticalNav</code> React component accepts list items as a JSON object and
 includes additional functionality like collapsible nested menus.</p>
-</div><div class="markup markup--react" data-reactid="48"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="49"><ul class="ds-c-vertical-nav" data-reactid="50"><li class="ds-c-vertical-nav__item" data-reactid="51"><a class="ds-c-vertical-nav__link" href="http://example.com" data-reactid="52">Home</a></li><li class="ds-c-vertical-nav__item" data-reactid="53"><div class="ds-c-vertical-nav__link ds-c-vertical-nav__link--current ds-c-vertical-nav__link--parent" data-reactid="54">About</div><button aria-controls="VerticalNavItem_34__subnav" aria-expanded="true" class="ds-c-vertical-nav__subnav-toggle" data-reactid="55">Collapse sub-navigation</button><ul class="ds-c-vertical-nav__subnav" id="VerticalNavItem_34__subnav" data-reactid="56"><li class="ds-c-vertical-nav__item" data-reactid="57"><a class="ds-c-vertical-nav__link ds-c-vertical-nav__link--current" href="http://example.com#team" data-reactid="58">Team</a></li><li class="ds-c-vertical-nav__item" data-reactid="59"><a class="ds-c-vertical-nav__link" href="http://example.com#company" data-reactid="60">Company</a></li></ul></li><li class="ds-c-vertical-nav__item" data-reactid="61"><a class="ds-c-vertical-nav__link" href="http://example.com#contact" data-reactid="62">Contact</a></li></ul></div><details class="ds-u-margin-bottom--2" data-reactid="63"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="64">Code snippet</summary><pre class="language-jsx" data-reactid="65"><code data-reactid="66"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>VerticalNav</span>
+</div><div class="markup markup--react" data-reactid="36"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="37"><ul class="ds-c-vertical-nav" data-reactid="38"><li class="ds-c-vertical-nav__item" data-reactid="39"><a class="ds-c-vertical-nav__link" href="http://example.com" data-reactid="40">Home</a></li><li class="ds-c-vertical-nav__item" data-reactid="41"><div class="ds-c-vertical-nav__link ds-c-vertical-nav__link--current ds-c-vertical-nav__link--parent" data-reactid="42">About</div><button aria-controls="VerticalNavItem_34__subnav" aria-expanded="true" class="ds-c-vertical-nav__subnav-toggle" data-reactid="43">Collapse sub-navigation</button><ul class="ds-c-vertical-nav__subnav" id="VerticalNavItem_34__subnav" data-reactid="44"><li class="ds-c-vertical-nav__item" data-reactid="45"><a class="ds-c-vertical-nav__link ds-c-vertical-nav__link--current" href="http://example.com#team" data-reactid="46">Team</a></li><li class="ds-c-vertical-nav__item" data-reactid="47"><a class="ds-c-vertical-nav__link" href="http://example.com#company" data-reactid="48">Company</a></li></ul></li><li class="ds-c-vertical-nav__item" data-reactid="49"><a class="ds-c-vertical-nav__link" href="http://example.com#contact" data-reactid="50">Contact</a></li></ul></div><details class="ds-u-margin-bottom--2" data-reactid="51"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="52">Code snippet</summary><pre class="language-jsx" data-reactid="53"><code data-reactid="54"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>VerticalNav</span>
   <span class="token attr-name">items</span><span class="token script language-javascript"><span class="token punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">[</span>
     <span class="token punctuation">{</span>
       label<span class="token punctuation">:</span> <span class="token string">'Home'</span><span class="token punctuation">,</span>
@@ -116,45 +96,38 @@
     <span class="token attr-name">}</span>
   <span class="token attr-name">]}</span>
   <span class="token attr-name">selectedId</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>team<span class="token punctuation">"</span></span>
-<span class="token punctuation">/></span></span></code></pre></details></div><h3 data-reactid="67">Props</h3><table class="ds-c-table" data-reactid="68"><thead data-reactid="69"><tr data-reactid="70"><td data-reactid="71">Name</td><td data-reactid="72">Type</td><td data-reactid="73">Default</td><td data-reactid="74">Description</td></tr></thead><tbody data-reactid="75"><tr data-reactid="76"><td data-reactid="77"><code class="ds-u-font-weight--bold" data-reactid="78">className</code></td><td data-reactid="79"><code data-reactid="80">string</code></td><td data-reactid="81"></td><td data-reactid="82"><div data-reactid="83"><p>Additional classes to be added to the root element</p>
-</div></td></tr><tr data-reactid="84"><td data-reactid="85"><code class="ds-u-font-weight--bold" data-reactid="86">collapsed</code></td><td data-reactid="87"><code data-reactid="88">bool</code></td><td data-reactid="89"><code data-reactid="90">false</code></td><td data-reactid="91"><div data-reactid="92"><p>Whether or not the menu is in a collapsed state</p>
-</div></td></tr><tr data-reactid="93"><td data-reactid="94"><code class="ds-u-font-weight--bold" data-reactid="95">selectedId</code></td><td data-reactid="96"><code data-reactid="97">string</code></td><td data-reactid="98"></td><td data-reactid="99"><div data-reactid="100"><p>The <code>id</code> of the selected <code>VerticalNavItem</code>. This will also set the
+<span class="token punctuation">/></span></span></code></pre></details></div><h3 data-reactid="55">Props</h3><table class="ds-c-table" data-reactid="56"><thead data-reactid="57"><tr data-reactid="58"><td data-reactid="59">Name</td><td data-reactid="60">Type</td><td data-reactid="61">Default</td><td data-reactid="62">Description</td></tr></thead><tbody data-reactid="63"><tr data-reactid="64"><td data-reactid="65"><code class="ds-u-font-weight--bold" data-reactid="66">className</code></td><td data-reactid="67"><code data-reactid="68">string</code></td><td data-reactid="69"></td><td data-reactid="70"><div data-reactid="71"><p>Additional classes to be added to the root element</p>
+</div></td></tr><tr data-reactid="72"><td data-reactid="73"><code class="ds-u-font-weight--bold" data-reactid="74">collapsed</code></td><td data-reactid="75"><code data-reactid="76">bool</code></td><td data-reactid="77"><code data-reactid="78">false</code></td><td data-reactid="79"><div data-reactid="80"><p>Whether or not the menu is in a collapsed state</p>
+</div></td></tr><tr data-reactid="81"><td data-reactid="82"><code class="ds-u-font-weight--bold" data-reactid="83">selectedId</code></td><td data-reactid="84"><code data-reactid="85">string</code></td><td data-reactid="86"></td><td data-reactid="87"><div data-reactid="88"><p>The <code>id</code> of the selected <code>VerticalNavItem</code>. This will also set the
 <code>selected</code> prop on the item&#39;s parents.</p>
-</div></td></tr><tr data-reactid="101"><td data-reactid="102"><code class="ds-u-font-weight--bold" data-reactid="103">id</code></td><td data-reactid="104"><code data-reactid="105">string</code></td><td data-reactid="106"></td><td data-reactid="107"></td></tr><tr data-reactid="108"><td data-reactid="109"><code class="ds-u-font-weight--bold" data-reactid="110">items</code><p data-reactid="111"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="112">Required</span></p></td><td data-reactid="113"><code data-reactid="114">arrayOf[object]</code></td><td data-reactid="115"></td><td data-reactid="116"><div data-reactid="117"><p>An array of <code>VerticalNavItem</code> data objects</p>
-</div></td></tr><tr data-reactid="118"><td data-reactid="119"><code class="ds-u-font-weight--bold" data-reactid="120">nested</code></td><td data-reactid="121"><code data-reactid="122">bool</code></td><td data-reactid="123"></td><td data-reactid="124"><div data-reactid="125"><p>Indicates this list is nested within another nav item.</p>
-</div></td></tr><tr data-reactid="126"><td data-reactid="127"><code class="ds-u-font-weight--bold" data-reactid="128">onLinkClick</code></td><td data-reactid="129"><code data-reactid="130">func</code></td><td data-reactid="131"></td><td data-reactid="132"><div data-reactid="133"><p>Called when one of the nav links is clicked, with the following arguments:
+</div></td></tr><tr data-reactid="89"><td data-reactid="90"><code class="ds-u-font-weight--bold" data-reactid="91">id</code></td><td data-reactid="92"><code data-reactid="93">string</code></td><td data-reactid="94"></td><td data-reactid="95"></td></tr><tr data-reactid="96"><td data-reactid="97"><code class="ds-u-font-weight--bold" data-reactid="98">items</code><p data-reactid="99"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="100">Required</span></p></td><td data-reactid="101"><code data-reactid="102">arrayOf[object]</code></td><td data-reactid="103"></td><td data-reactid="104"><div data-reactid="105"><p>An array of <code>VerticalNavItem</code> data objects</p>
+</div></td></tr><tr data-reactid="106"><td data-reactid="107"><code class="ds-u-font-weight--bold" data-reactid="108">nested</code></td><td data-reactid="109"><code data-reactid="110">bool</code></td><td data-reactid="111"></td><td data-reactid="112"><div data-reactid="113"><p>Indicates this list is nested within another nav item.</p>
+</div></td></tr><tr data-reactid="114"><td data-reactid="115"><code class="ds-u-font-weight--bold" data-reactid="116">onLinkClick</code></td><td data-reactid="117"><code data-reactid="118">func</code></td><td data-reactid="119"></td><td data-reactid="120"><div data-reactid="121"><p>Called when one of the nav links is clicked, with the following arguments:
 <a href="https://facebook.github.io/react/docs/events.html"><code>SyntheticEvent</code></a>,
 <code>id</code>, <code>url</code></p>
-</div></td></tr></tbody></table></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="134"><div data-reactid="135"><h1 class="ds-h1" id="components.vertical-nav.VerticalNavItem" data-reactid="136">React - <code>&#x3C;VerticalNavItem&#x3E;</code></h1><code class="ds-u-font-size--small" data-reactid="137">components/VerticalNav/VerticalNavItem</code></div><section data-reactid="138"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="139"></div><h3 data-reactid="140">Props</h3><table class="ds-c-table" data-reactid="141"><thead data-reactid="142"><tr data-reactid="143"><td data-reactid="144">Name</td><td data-reactid="145">Type</td><td data-reactid="146">Default</td><td data-reactid="147">Description</td></tr></thead><tbody data-reactid="148"><tr data-reactid="149"><td data-reactid="150"><code class="ds-u-font-weight--bold" data-reactid="151">ariaCollapsedStateButtonLabel</code></td><td data-reactid="152"><code data-reactid="153">string</code></td><td data-reactid="154"><code data-reactid="155">&#x27;Expand sub-navigation&#x27;</code></td><td data-reactid="156"><div data-reactid="157"><p>Aria label for the toggle button when the sub-navigation is collapsed</p>
-</div></td></tr><tr data-reactid="158"><td data-reactid="159"><code class="ds-u-font-weight--bold" data-reactid="160">ariaExpandedStateButtonLabel</code></td><td data-reactid="161"><code data-reactid="162">string</code></td><td data-reactid="163"><code data-reactid="164">&#x27;Collapse sub-navigation&#x27;</code></td><td data-reactid="165"><div data-reactid="166"><p>Aria label for the toggle button when the sub-navigation is expanded</p>
-</div></td></tr><tr data-reactid="167"><td data-reactid="168"><code class="ds-u-font-weight--bold" data-reactid="169">className</code></td><td data-reactid="170"><code data-reactid="171">string</code></td><td data-reactid="172"></td><td data-reactid="173"><div data-reactid="174"><p>Additional classes to be added to the root element</p>
-</div></td></tr><tr data-reactid="175"><td data-reactid="176"><code class="ds-u-font-weight--bold" data-reactid="177">defaultCollapsed</code></td><td data-reactid="178"><code data-reactid="179">bool</code></td><td data-reactid="180"><code data-reactid="181">false</code></td><td data-reactid="182"><div data-reactid="183"><p>Whether or not the item&#39;s sub-navigation is in a collapsed state by default</p>
-</div></td></tr><tr data-reactid="184"><td data-reactid="185"><code class="ds-u-font-weight--bold" data-reactid="186">onClick</code></td><td data-reactid="187"><code data-reactid="188">func</code></td><td data-reactid="189"></td><td data-reactid="190"><div data-reactid="191"><p>Called when the item is clicked, with the following arguments:
+</div></td></tr></tbody></table></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="122"><div data-reactid="123"><h2 class="ds-h2" id="components.vertical-nav.VerticalNavItem" data-reactid="124"><code>&#x3C;VerticalNavItem&#x3E;</code></h2><code class="ds-u-font-size--small" data-reactid="125">components/VerticalNav/VerticalNavItem.jsx</code></div><section data-reactid="126"><div class="c-details ds-u-margin-y--2 ds-u-measure--wide" data-reactid="127"></div><h3 data-reactid="128">Props</h3><table class="ds-c-table" data-reactid="129"><thead data-reactid="130"><tr data-reactid="131"><td data-reactid="132">Name</td><td data-reactid="133">Type</td><td data-reactid="134">Default</td><td data-reactid="135">Description</td></tr></thead><tbody data-reactid="136"><tr data-reactid="137"><td data-reactid="138"><code class="ds-u-font-weight--bold" data-reactid="139">ariaCollapsedStateButtonLabel</code></td><td data-reactid="140"><code data-reactid="141">string</code></td><td data-reactid="142"><code data-reactid="143">&#x27;Expand sub-navigation&#x27;</code></td><td data-reactid="144"><div data-reactid="145"><p>Aria label for the toggle button when the sub-navigation is collapsed</p>
+</div></td></tr><tr data-reactid="146"><td data-reactid="147"><code class="ds-u-font-weight--bold" data-reactid="148">ariaExpandedStateButtonLabel</code></td><td data-reactid="149"><code data-reactid="150">string</code></td><td data-reactid="151"><code data-reactid="152">&#x27;Collapse sub-navigation&#x27;</code></td><td data-reactid="153"><div data-reactid="154"><p>Aria label for the toggle button when the sub-navigation is expanded</p>
+</div></td></tr><tr data-reactid="155"><td data-reactid="156"><code class="ds-u-font-weight--bold" data-reactid="157">className</code></td><td data-reactid="158"><code data-reactid="159">string</code></td><td data-reactid="160"></td><td data-reactid="161"><div data-reactid="162"><p>Additional classes to be added to the root element</p>
+</div></td></tr><tr data-reactid="163"><td data-reactid="164"><code class="ds-u-font-weight--bold" data-reactid="165">defaultCollapsed</code></td><td data-reactid="166"><code data-reactid="167">bool</code></td><td data-reactid="168"><code data-reactid="169">false</code></td><td data-reactid="170"><div data-reactid="171"><p>Whether or not the item&#39;s sub-navigation is in a collapsed state by default</p>
+</div></td></tr><tr data-reactid="172"><td data-reactid="173"><code class="ds-u-font-weight--bold" data-reactid="174">onClick</code></td><td data-reactid="175"><code data-reactid="176">func</code></td><td data-reactid="177"></td><td data-reactid="178"><div data-reactid="179"><p>Called when the item is clicked, with the following arguments:
 <a href="https://facebook.github.io/react/docs/events.html"><code>SyntheticEvent</code></a>,
 <code>id</code>, <code>url</code>.</p>
 <p>This takes precedence over the <code>VerticalNav</code> <code>onLinkClick</code> prop</p>
-</div></td></tr><tr data-reactid="192"><td data-reactid="193"><code class="ds-u-font-weight--bold" data-reactid="194">onSubnavToggle</code></td><td data-reactid="195"><code data-reactid="196">func</code></td><td data-reactid="197"></td><td data-reactid="198"><div data-reactid="199"><p>Called when this item&#39;s subnav is collapsed or expanded, with the
+</div></td></tr><tr data-reactid="180"><td data-reactid="181"><code class="ds-u-font-weight--bold" data-reactid="182">onSubnavToggle</code></td><td data-reactid="183"><code data-reactid="184">func</code></td><td data-reactid="185"></td><td data-reactid="186"><div data-reactid="187"><p>Called when this item&#39;s subnav is collapsed or expanded, with the
 following arguments: <code>id</code>, <code>collapsed</code></p>
-</div></td></tr><tr data-reactid="200"><td data-reactid="201"><code class="ds-u-font-weight--bold" data-reactid="202">id</code></td><td data-reactid="203"><code data-reactid="204">string</code></td><td data-reactid="205"></td><td data-reactid="206"><div data-reactid="207"><p>Optional identifier. This can be handy if you&#39;re passing in an
+</div></td></tr><tr data-reactid="188"><td data-reactid="189"><code class="ds-u-font-weight--bold" data-reactid="190">id</code></td><td data-reactid="191"><code data-reactid="192">string</code></td><td data-reactid="193"></td><td data-reactid="194"><div data-reactid="195"><p>Optional identifier. This can be handy if you&#39;re passing in an
 <code>onClick</code> handler. A unique ID will be generated if one isn&#39;t provided.</p>
-</div></td></tr><tr data-reactid="208"><td data-reactid="209"><code class="ds-u-font-weight--bold" data-reactid="210">items</code></td><td data-reactid="211"><code data-reactid="212">arrayOf[VerticalNavItem.propTypes]</code></td><td data-reactid="213"></td><td data-reactid="214"><div data-reactid="215"><p>An array of nested <code>VerticalNavItem</code> data objects to be rendered in a
+</div></td></tr><tr data-reactid="196"><td data-reactid="197"><code class="ds-u-font-weight--bold" data-reactid="198">items</code></td><td data-reactid="199"><code data-reactid="200">arrayOf[VerticalNavItem.propTypes]</code></td><td data-reactid="201"></td><td data-reactid="202"><div data-reactid="203"><p>An array of nested <code>VerticalNavItem</code> data objects to be rendered in a
 sub-navigation list.</p>
-</div></td></tr><tr data-reactid="216"><td data-reactid="217"><code class="ds-u-font-weight--bold" data-reactid="218">label</code><p data-reactid="219"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="220">Required</span></p></td><td data-reactid="221"><code data-reactid="222">node</code></td><td data-reactid="223"></td><td data-reactid="224"><div data-reactid="225"><p>Text to render for this nav item</p>
-</div></td></tr><tr data-reactid="226"><td data-reactid="227"><code class="ds-u-font-weight--bold" data-reactid="228">url</code></td><td data-reactid="229"><code data-reactid="230">string</code></td><td data-reactid="231"></td><td data-reactid="232"><div data-reactid="233"><p>A URL to navigate to if this item is a link</p>
-</div></td></tr><tr data-reactid="234"><td data-reactid="235"><code class="ds-u-font-weight--bold" data-reactid="236">selected</code></td><td data-reactid="237"><code data-reactid="238">bool</code></td><td data-reactid="239"></td><td data-reactid="240"><div data-reactid="241"><p>If this item is currently selected</p>
-</div></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="242"><article class="ds-u-margin-y--6 l-content" data-reactid="243"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="244"><h2 id="accessibility">Accessibility</h2>
-<ul>
-<li>Users should be able to tab through each link.</li>
-<li>If you have nested menus that are collapsible, ensure the toggle button has its <code>aria-controls</code> and <code>aria-expanded</code> attributes set. This is done automatically for you
-if you&#39;re using the React components.</li>
-</ul>
-<h2 id="usability">Usability</h2>
-<h3 id="when-to-use">When to use</h3>
+</div></td></tr><tr data-reactid="204"><td data-reactid="205"><code class="ds-u-font-weight--bold" data-reactid="206">label</code><p data-reactid="207"><span class="ds-c-badge ds-u-bg-gray-dark" data-reactid="208">Required</span></p></td><td data-reactid="209"><code data-reactid="210">node</code></td><td data-reactid="211"></td><td data-reactid="212"><div data-reactid="213"><p>Text to render for this nav item</p>
+</div></td></tr><tr data-reactid="214"><td data-reactid="215"><code class="ds-u-font-weight--bold" data-reactid="216">url</code></td><td data-reactid="217"><code data-reactid="218">string</code></td><td data-reactid="219"></td><td data-reactid="220"><div data-reactid="221"><p>A URL to navigate to if this item is a link</p>
+</div></td></tr><tr data-reactid="222"><td data-reactid="223"><code class="ds-u-font-weight--bold" data-reactid="224">selected</code></td><td data-reactid="225"><code data-reactid="226">bool</code></td><td data-reactid="227"></td><td data-reactid="228"><div data-reactid="229"><p>If this item is currently selected</p>
+</div></td></tr></tbody></table></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="230"><article class="ds-u-margin-y--6 l-content" data-reactid="231"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="232"><h2 id="when-to-use">When to use</h2>
 <ul>
 <li>To display a navigational hierarchy with one to three levels.</li>
 <li>To display the “sub-navigation” within a section of the website.</li>
 </ul>
-<h3 id="when-to-consider-something-else">When to consider something else</h3>
+<h2 id="when-to-consider-alternatives">When to consider alternatives</h2>
 <ul>
 <li>If the site has fewer than five pages, consider organizing the page without a navigational hierarchy.</li>
 <li>If your page already has a horizontal and vertical navigation bar, consider ways to simplify your navigation system.</li>
@@ -163,13 +136,24 @@ <h3 id="when-to-consider-something-else">When to consider something else</h3>
 <h2 id="guidance">Guidance</h2>
 <ul>
 <li>Indicate where a user is within the navigational hierarchy. Use the <code>ds-c-vertical-nav__link--current</code> modifier to show users which page they have navigated to.</li>
-<li>Keep the navigation links short. They can be shorter derivatives of page titles themselves.</li>
+<li>Keep the navigation links short and follow sentence case. They can be shorter derivatives of page titles themselves.</li>
 <li>If the navigation hierarchy is too long, users may miss items at the bottom. If it’s too deep, users may miss items that require too many clicks. Usability test to find the right balance between breadth and depth.</li>
+</ul>
+<h2 id="accessibility">Accessibility</h2>
+<ul>
+<li>Users should be able to tab through each link.</li>
+<li>If you have nested menus that are collapsible, ensure the toggle button has its <code>aria-controls</code> and <code>aria-expanded</code> attributes set. This is done automatically for you
+if you&#39;re using the React components.</li>
+</ul>
+<h2 id="learn-more">Learn more</h2>
+<ul>
+<li><a href="https://content-guide.18f.gov/capitalization/#headings">18F Content Guide - Heading capitalization</a></li>
+<li><a href="https://content-guide.18f.gov/headings-and-titles/">18F Content Guide - Headings and titles</a></li>
 </ul></div></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Vertical navigation","description":"","reference":"components.vertical-nav","referenceNumber":"3.10","referenceURI":"design-system/components/vertical-nav","weight":0,"markup":"<ul class=\"ds-c-vertical-nav\">\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link ds-c-vertical-nav__link--current\" href=\"http://example.com\">Current page</a>\n  </li>\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Parent link</a>\n  </li>\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Parent link</a>\n  </li>\n</ul>","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Nested menus","description":"","reference":"components.vertical-nav.nested","referenceNumber":"3.10.2","referenceURI":"design-system/components/vertical-nav/nested","weight":0,"markup":"<ul class=\"ds-c-vertical-nav\">\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Parent link</a>\n  </li>\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link ds-c-vertical-nav__link--current\" href=\"http://example.com\">Current page</a>\n    <ul class=\"ds-c-vertical-nav__subnav\">\n      <li class=\"ds-c-vertical-nav__item\">\n        <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Child link</a>\n      </li>\n      <li class=\"ds-c-vertical-nav__item\">\n        <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Child link</a>\n        <ul class=\"ds-c-vertical-nav__subnav\">\n          <li class=\"ds-c-vertical-nav__item\">\n            <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Grandchild link</a>\n          </li>\n          <li class=\"ds-c-vertical-nav__item\">\n            <a class=\"ds-c-vertical-nav__link ds-c-vertical-nav__link--current\" href=\"http://example.com\">Grandchild link</a>\n          </li>\n        </ul>\n      </li>\n      <li class=\"ds-c-vertical-nav__item\">\n        <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Child link</a>\n      </li>\n    </ul>\n  </li>\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Parent link</a>\n  </li>\n</ul>","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.vertical-nav"},{"header":"React - <code>&#x3C;VerticalNav&#x3E;</code>","description":"","reference":"components.vertical-nav.VerticalNav","referenceNumber":"3.10.3","referenceURI":"design-system/components/vertical-nav/VerticalNav","weight":0,"markup":"","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"VerticalNav","parentReference":"components.vertical-nav"},{"header":"React - <code>&#x3C;VerticalNavItem&#x3E;</code>","description":"","reference":"components.vertical-nav.VerticalNavItem","referenceNumber":"3.10.4","referenceURI":"design-system/components/vertical-nav/VerticalNavItem","weight":0,"markup":"","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"hideExample":true,"reactComponent":"VerticalNavItem","parentReference":"components.vertical-nav"},{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Users should be able to tab through each link.</li>\n<li>If you have nested menus that are collapsible, ensure the toggle button has its <code>aria-controls</code> and <code>aria-expanded</code> attributes set. This is done automatically for you\nif you&#39;re using the React components.</li>\n</ul>\n<h2 id=\"usability\">Usability</h2>\n<h3 id=\"when-to-use\">When to use</h3>\n<ul>\n<li>To display a navigational hierarchy with one to three levels.</li>\n<li>To display the “sub-navigation” within a section of the website.</li>\n</ul>\n<h3 id=\"when-to-consider-something-else\">When to consider something else</h3>\n<ul>\n<li>If the site has fewer than five pages, consider organizing the page without a navigational hierarchy.</li>\n<li>If your page already has a horizontal and vertical navigation bar, consider ways to simplify your navigation system.</li>\n<li>If your content is within a frame or sub-area of a page, consider ways to simplify your navigation system.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Indicate where a user is within the navigational hierarchy. Use the <code>ds-c-vertical-nav__link--current</code> modifier to show users which page they have navigated to.</li>\n<li>Keep the navigation links short. They can be shorter derivatives of page titles themselves.</li>\n<li>If the navigation hierarchy is too long, users may miss items at the bottom. If it’s too deep, users may miss items that require too many clicks. Usability test to find the right balance between breadth and depth.</li>\n</ul>","reference":"components.vertical-nav.guidance","referenceNumber":"3.10.1","referenceURI":"design-system/components/vertical-nav/guidance","weight":0,"markup":"","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.vertical-nav"}],"status":"beta","uswdsUrl":"https://standards.usa.gov/components/sidenav/","parentReference":"components"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Vertical navigation","description":"<p>Hierarchical, vertical navigation.</p>","reference":"components.vertical-nav","referenceNumber":"3.10","referenceURI":"design-system/components/vertical-nav","weight":0,"markup":"<ul class=\"ds-c-vertical-nav\">\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Parent link</a>\n  </li>\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link ds-c-vertical-nav__link--current\" href=\"http://example.com\">Current page</a>\n    <ul class=\"ds-c-vertical-nav__subnav\">\n      <li class=\"ds-c-vertical-nav__item\">\n        <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Child link</a>\n      </li>\n      <li class=\"ds-c-vertical-nav__item\">\n        <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Child link</a>\n        <ul class=\"ds-c-vertical-nav__subnav\">\n          <li class=\"ds-c-vertical-nav__item\">\n            <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Grandchild link</a>\n          </li>\n          <li class=\"ds-c-vertical-nav__item\">\n            <a class=\"ds-c-vertical-nav__link ds-c-vertical-nav__link--current\" href=\"http://example.com\">Grandchild link</a>\n          </li>\n        </ul>\n      </li>\n      <li class=\"ds-c-vertical-nav__item\">\n        <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Child link</a>\n      </li>\n    </ul>\n  </li>\n  <li class=\"ds-c-vertical-nav__item\">\n    <a class=\"ds-c-vertical-nav__link\" href=\"http://example.com\">Parent link</a>\n  </li>\n</ul>","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":2,"modifiers":[],"sections":[{"header":"<code>&#x3C;VerticalNav&#x3E;</code>","description":"","reference":"components.vertical-nav.VerticalNav","referenceNumber":"3.10.2","referenceURI":"design-system/components/vertical-nav/VerticalNav","weight":0,"markup":"","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"reactComponent":"VerticalNav","parentReference":"components.vertical-nav"},{"header":"<code>&#x3C;VerticalNavItem&#x3E;</code>","description":"","reference":"components.vertical-nav.VerticalNavItem","referenceNumber":"3.10.3","referenceURI":"design-system/components/vertical-nav/VerticalNavItem","weight":0,"markup":"","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"hideExample":true,"reactComponent":"VerticalNavItem","parentReference":"components.vertical-nav"},{"header":"---","description":"<h2 id=\"when-to-use\">When to use</h2>\n<ul>\n<li>To display a navigational hierarchy with one to three levels.</li>\n<li>To display the “sub-navigation” within a section of the website.</li>\n</ul>\n<h2 id=\"when-to-consider-alternatives\">When to consider alternatives</h2>\n<ul>\n<li>If the site has fewer than five pages, consider organizing the page without a navigational hierarchy.</li>\n<li>If your page already has a horizontal and vertical navigation bar, consider ways to simplify your navigation system.</li>\n<li>If your content is within a frame or sub-area of a page, consider ways to simplify your navigation system.</li>\n</ul>\n<h2 id=\"guidance\">Guidance</h2>\n<ul>\n<li>Indicate where a user is within the navigational hierarchy. Use the <code>ds-c-vertical-nav__link--current</code> modifier to show users which page they have navigated to.</li>\n<li>Keep the navigation links short and follow sentence case. They can be shorter derivatives of page titles themselves.</li>\n<li>If the navigation hierarchy is too long, users may miss items at the bottom. If it’s too deep, users may miss items that require too many clicks. Usability test to find the right balance between breadth and depth.</li>\n</ul>\n<h2 id=\"accessibility\">Accessibility</h2>\n<ul>\n<li>Users should be able to tab through each link.</li>\n<li>If you have nested menus that are collapsible, ensure the toggle button has its <code>aria-controls</code> and <code>aria-expanded</code> attributes set. This is done automatically for you\nif you&#39;re using the React components.</li>\n</ul>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"https://content-guide.18f.gov/capitalization/#headings\">18F Content Guide - Heading capitalization</a></li>\n<li><a href=\"https://content-guide.18f.gov/headings-and-titles/\">18F Content Guide - Headings and titles</a></li>\n</ul>","reference":"components.vertical-nav.guidance","referenceNumber":"3.10.1","referenceURI":"design-system/components/vertical-nav/guidance","weight":0,"markup":"","source":{"filename":"components/VerticalNav/VerticalNav.scss","path":"packages/core/src/components/VerticalNav/VerticalNav.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"components.vertical-nav"}],"status":"recommended","uswdsUrl":"https://standards.usa.gov/components/sidenav/","parentReference":"components"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/guidelines/code-conventions/index.html b/docs/guidelines/code-conventions/index.html
index 6f844a292e..da334e4675 100644
--- a/docs/guidelines/code-conventions/index.html
+++ b/docs/guidelines/code-conventions/index.html
@@ -2,14 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Code conventions - CMSgov Design System</title>
+  <title>Code conventions - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1664114666"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" data-reactid="12">Code conventions</h1><div class="ds-u-clearfix" data-reactid="13"></div><!-- react-empty: 14 --></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p class="ds-text--lead">
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1900670070"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" data-reactid="10">Code conventions</h1><div class="ds-u-clearfix" data-reactid="11"></div><!-- react-empty: 12 --></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p class="ds-text--lead">
   The design system favors clarity over succinctness. This means the design system may be verbose, but it should deliver clarity and resilience in exchange. Keeping CSS legible and scalable means sacrificing a shorter syntax.
 </p>
 
@@ -65,7 +65,7 @@ <h2 id="credits">Credits</h2>
   </div>
   <script type="text/javascript">
     var page = {"header":"Code conventions","description":"<p class=\"ds-text--lead\">\n  The design system favors clarity over succinctness. This means the design system may be verbose, but it should deliver clarity and resilience in exchange. Keeping CSS legible and scalable means sacrificing a shorter syntax.\n</p>\n\n<h2 id=\"css-naming-convention\">CSS naming convention</h2>\n<p><img src=\"/design-system/public/images/naming-convention.svg\" class=\"ds-u-border--1\" /></p>\n<h3 id=\"namespace\">Namespace</h3>\n<p>To avoid conflicting with other libraries and existing code, the design system namespaces its CSS class names with <code>ds-</code>.</p>\n<h3 id=\"prefix\">Prefix</h3>\n<p>Prefixes are added to class names to make it more apparent what job the class is doing.</p>\n<table class=\"ds-c-table\">\n<thead>\n<tr>\n<th>Prefix</th>\n<th>Description</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td><code>l-</code></td>\n<td>Indicates layout-related styles. These classes may be used in any number of unrelated contexts. Example: <code>.ds-l-container</code></td>\n</tr>\n<tr>\n<td><code>c-</code></td>\n<td>Indicates a component. Example: <code>.ds-c-button</code></td>\n</tr>\n<tr>\n<td><code>u-</code></td>\n<td>Indicates a utility. Example: <code>.ds-u-color--base</code></td>\n</tr>\n<tr>\n<td><code>is-</code>, <code>has-</code></td>\n<td>Indicates state.</td>\n</tr>\n</tbody>\n</table>\n<h3 id=\"bem-syntax\">BEM syntax</h3>\n<p>Following the namespace and prefix is a name conforming to <a href=\"http://getbem.com/introduction/\">BEM syntax</a>.</p>\n<p>Put all together, a CSS class can be broken down to these key parts: <code>[NAMESPACE]-[PREFIX]-[BLOCK]__[ELEMENT]--[MODIFIER]</code></p>\n<ul>\n<li><strong>Block</strong> is a standalone entity that is meaningful on its own. For example: <code>.ds-c-card</code>, <code>.ds-c-button</code></li>\n<li><strong>Element</strong> is a part of a block that has no standalone meaning and is semantically tied to its block, such as <code>.ds-c-card__title</code></li>\n<li><strong>Modifier</strong> is a flag on a block or element and is used to change appearance or behavior. For example: <code>.ds-c-button--primary</code>, <code>ds-u-color--primary</code>, <code>ds-u-margin--3</code></li>\n</ul>\n<p><a href=\"http://getbem.com/naming/\">BEM’s strict naming rules can be found here</a>.</p>\n<h2 id=\"credits\">Credits</h2>\n<p>The CSS naming convention outlined here was heavily influenced by:</p>\n<ul>\n<li><a href=\"http://bradfrost.com/blog/post/css-architecture-for-design-systems/\">CSS Architecture for Design Systems</a>, by Brad Frost</li>\n<li><a href=\"https://seesparkbox.com/foundry/thoughtful_css_architecture\">Thoughtful CSS Architecture</a>, by Nathan Rambeck</li>\n<li><a href=\"https://csswizardry.com/2015/03/more-transparent-ui-code-with-namespaces/\">More Transparent UI Code with Namespaces</a>, by Harry Roberts</li>\n</ul>\n","referenceURI":"design-system/guidelines/code-conventions","weight":0};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/guidelines/forms/index.html b/docs/guidelines/forms/index.html
new file mode 100644
index 0000000000..0015c94a5f
--- /dev/null
+++ b/docs/guidelines/forms/index.html
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <title>Forms - CMS.gov Design System</title>
+
+  <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
+  <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
+</head>
+<body class="ds-base">
+  <div id="js-root">
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1503059589"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" data-reactid="10">Forms</h1><div class="ds-u-clearfix" data-reactid="11"></div><!-- react-empty: 12 --></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>The design system includes components for the standard HTML form elements: <a href="/design-system/components/choice">checkboxes and radio buttons</a>, <a href="/design-system/components/text-field">text fields</a>, <a href="/design-system/components/select">select menus</a>, fieldsets, labels, and so on.</p>
+<p>Below are some best practices your project should aim to follow in order to provide the most accessible and usable experience for your users. Additional guidance, specific to each form field, is provided in each component&#39;s guidance tab.</p>
+<h2 id="best-practices">Best practices</h2>
+<ul>
+<li>Keep forms as simple as possible – only ask for what&#39;s absolutely needed.</li>
+<li>Display form fields in the same order in HTML as they appear on screen. Do not use CSS to rearrange the form fields. Screen readers narrate, and keyboard navigate, forms in the order they appear in the HTML.</li>
+<li>Ensure there&#39;s sufficient spacing between form fields. Your fields shouldn&#39;t feel cramped and users shouldn&#39;t confuse which labels and hint text belong to which fields. Use the <a href="/design-system/utilities/margin">margin</a> or <a href="/design-system/utilities/padding">padding</a> utility classes, if necessary, to add extra spacing.</li>
+</ul>
+<h3 id="labels">Labels</h3>
+<ul>
+<li>Apply the <code>ds-c-label</code> class to <code>&lt;label&gt;</code> elements.</li>
+<li>Each field should have a <code>&lt;label&gt;</code>. Never use a field&#39;s <code>placeholder</code> attribute as the primary way to label the field.</li>
+<li>Labels should have a <code>for</code> attribute, referencing the corresponding input&#39;s unique <code>id</code> attribute. Only one label can be associated to each unique form element.</li>
+<li>Labels should be placed above their fields.</li>
+<li>Label text should be short and in sentence case.</li>
+<li>Avoid colons at the end of labels.</li>
+</ul>
+<h4 id="hint-text">Hint text</h4>
+<ul>
+<li>Place hint text within the field&#39;s <code>&lt;label&gt;</code> element.</li>
+<li>Apply the <code>ds-c-field__hint</code> class to hint text.</li>
+<li>Use hint text for supporting contextual help, this will always be shown.</li>
+<li>Hint text should sit above a form field, and below the label text.</li>
+</ul>
+<h4 id="validation">Validation</h4>
+<ul>
+<li>Place inline validation messages within the field&#39;s <code>&lt;label&gt;</code> element.</li>
+<li>Visually align inline validation messages with the input fields, so people using screen magnifiers can read them quickly.</li>
+</ul>
+<h5 id="example">Example</h5>
+<pre class="language-markup"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>label</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-label<span class="token punctuation">"</span></span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>lastname<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+  ID Number
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field__hint ds-u-color--error<span class="token punctuation">"</span></span> <span class="token attr-name">role</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>alert<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+    Please enter your ID Number
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-c-field__hint<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+    It's on your benefit card and benefit letter. For example, ‘12 34 56B’.
+  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>label</span><span class="token punctuation">></span></span></code></pre><h3 id="required-and-optional-fields">Required and Optional fields</h3>
+<p>If most of the fields in a form are required, indicate the few that are optional. If most of the fields in a form are optional, indicate the few that are required. When indicating what form fields are either required or optional, always use text.</p>
+<p>Whichever choice you choose, ensure the pattern is consistent when the form is split across multiple pages.</p>
+<h2 id="learn-more">Learn more</h2>
+<ul>
+<li><a href="https://www.nngroup.com/articles/web-form-design/">Website Forms Usability: Top 10 Recommendations</a></li>
+<li><a href="https://www.nngroup.com/articles/form-design-white-space/">Form Design Quick Fix: Group Form Elements Effectively Using White Space</a></li>
+</ul>
+</div></article></div></div></main></div></div></div>
+  </div>
+  <script type="text/javascript">
+    var page = {"header":"Forms","description":"<p>The design system includes components for the standard HTML form elements: <a href=\"/design-system/components/choice\">checkboxes and radio buttons</a>, <a href=\"/design-system/components/text-field\">text fields</a>, <a href=\"/design-system/components/select\">select menus</a>, fieldsets, labels, and so on.</p>\n<p>Below are some best practices your project should aim to follow in order to provide the most accessible and usable experience for your users. Additional guidance, specific to each form field, is provided in each component&#39;s guidance tab.</p>\n<h2 id=\"best-practices\">Best practices</h2>\n<ul>\n<li>Keep forms as simple as possible – only ask for what&#39;s absolutely needed.</li>\n<li>Display form fields in the same order in HTML as they appear on screen. Do not use CSS to rearrange the form fields. Screen readers narrate, and keyboard navigate, forms in the order they appear in the HTML.</li>\n<li>Ensure there&#39;s sufficient spacing between form fields. Your fields shouldn&#39;t feel cramped and users shouldn&#39;t confuse which labels and hint text belong to which fields. Use the <a href=\"/design-system/utilities/margin\">margin</a> or <a href=\"/design-system/utilities/padding\">padding</a> utility classes, if necessary, to add extra spacing.</li>\n</ul>\n<h3 id=\"labels\">Labels</h3>\n<ul>\n<li>Apply the <code>ds-c-label</code> class to <code>&lt;label&gt;</code> elements.</li>\n<li>Each field should have a <code>&lt;label&gt;</code>. Never use a field&#39;s <code>placeholder</code> attribute as the primary way to label the field.</li>\n<li>Labels should have a <code>for</code> attribute, referencing the corresponding input&#39;s unique <code>id</code> attribute. Only one label can be associated to each unique form element.</li>\n<li>Labels should be placed above their fields.</li>\n<li>Label text should be short and in sentence case.</li>\n<li>Avoid colons at the end of labels.</li>\n</ul>\n<h4 id=\"hint-text\">Hint text</h4>\n<ul>\n<li>Place hint text within the field&#39;s <code>&lt;label&gt;</code> element.</li>\n<li>Apply the <code>ds-c-field__hint</code> class to hint text.</li>\n<li>Use hint text for supporting contextual help, this will always be shown.</li>\n<li>Hint text should sit above a form field, and below the label text.</li>\n</ul>\n<h4 id=\"validation\">Validation</h4>\n<ul>\n<li>Place inline validation messages within the field&#39;s <code>&lt;label&gt;</code> element.</li>\n<li>Visually align inline validation messages with the input fields, so people using screen magnifiers can read them quickly.</li>\n</ul>\n<h5 id=\"example\">Example</h5>\n<pre class=\"language-markup\"><code><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ds-c-label<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">for</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>lastname<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">></span></span>\n  ID Number\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ds-c-field__hint ds-u-color--error<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">></span></span>\n    Please enter your ID Number\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">></span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ds-c-field__hint<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">></span></span>\n    It's on your benefit card and benefit letter. For example, ‘12 34 56B’.\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">></span></span></code></pre><h3 id=\"required-and-optional-fields\">Required and Optional fields</h3>\n<p>If most of the fields in a form are required, indicate the few that are optional. If most of the fields in a form are optional, indicate the few that are required. When indicating what form fields are either required or optional, always use text.</p>\n<p>Whichever choice you choose, ensure the pattern is consistent when the form is split across multiple pages.</p>\n<h2 id=\"learn-more\">Learn more</h2>\n<ul>\n<li><a href=\"https://www.nngroup.com/articles/web-form-design/\">Website Forms Usability: Top 10 Recommendations</a></li>\n<li><a href=\"https://www.nngroup.com/articles/form-design-white-space/\">Form Design Quick Fix: Group Form Elements Effectively Using White Space</a></li>\n</ul>\n","referenceURI":"design-system/guidelines/forms","weight":0};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+  </script>
+  <script src="/design-system/public/scripts/index.js"></script>
+</body>
+</html>
\ No newline at end of file
diff --git a/docs/guidelines/grid/index.html b/docs/guidelines/grid/index.html
index a951fe6860..193e002ec8 100644
--- a/docs/guidelines/grid/index.html
+++ b/docs/guidelines/grid/index.html
@@ -2,17 +2,18 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Grid layout - CMSgov Design System</title>
+  <title>Grid layout - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1927945340"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" data-reactid="12">Grid layout</h1><div class="ds-u-clearfix" data-reactid="13"></div><!-- react-empty: 14 --></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>Choosing a suitable grid framework is dependent on several factors. Some of these factors are browser support, if and which CSS preprocessor is being used, degree of customizability, and <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Layout_mode">layout mode</a> preference.</p>
-<p>As a result, the design system doesn&#39;t currently include its own grid framework and instead suggests that you pick from existing solutions, based on what works best for your project and preferences.</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1909638248"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" data-reactid="10">Grid layout</h1><div class="ds-u-clearfix" data-reactid="11"></div><!-- react-empty: 12 --></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>Choosing a suitable grid solution is dependent on several factors. Some of these factors are browser support, if and which CSS preprocessor is being used, degree of customizability, and <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Layout_mode">layout mode</a> preference.</p>
+<p>As a result, the design system doesn&#39;t currently include its own grid framework and instead suggests that you create your own simple grid solution, or pick from existing solutions, based on what works best for your project and preferences.</p>
 <p>Below is a non-exhaustive list of existing grid solutions:</p>
 <ul>
+<li><a href="https://css-tricks.com/snippets/css/a-guide-to-flexbox/">Flexbox</a></li>
 <li><a href="http://neat.bourbon.io/">Neat</a></li>
 <li><a href="http://flexboxgrid.com/">Flexbox Grid</a></li>
 <li><a href="http://susy.oddbird.net/">Susy</a></li>
@@ -23,8 +24,8 @@
 </div></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Grid layout","description":"<p>Choosing a suitable grid framework is dependent on several factors. Some of these factors are browser support, if and which CSS preprocessor is being used, degree of customizability, and <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/Layout_mode\">layout mode</a> preference.</p>\n<p>As a result, the design system doesn&#39;t currently include its own grid framework and instead suggests that you pick from existing solutions, based on what works best for your project and preferences.</p>\n<p>Below is a non-exhaustive list of existing grid solutions:</p>\n<ul>\n<li><a href=\"http://neat.bourbon.io/\">Neat</a></li>\n<li><a href=\"http://flexboxgrid.com/\">Flexbox Grid</a></li>\n<li><a href=\"http://susy.oddbird.net/\">Susy</a></li>\n<li><a href=\"https://unsemantic.com/\">Unsemantic</a></li>\n<li><a href=\"http://getbootstrap.com/css/#grid\">Bootstrap grid</a></li>\n</ul>\n<p>If you have more suggestions, feel free to <a href=\"https://github.com/CMSgov/design-system/issues/new\">open a ticket</a>.</p>\n","referenceURI":"design-system/guidelines/grid","weight":0};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Grid layout","description":"<p>Choosing a suitable grid solution is dependent on several factors. Some of these factors are browser support, if and which CSS preprocessor is being used, degree of customizability, and <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/Layout_mode\">layout mode</a> preference.</p>\n<p>As a result, the design system doesn&#39;t currently include its own grid framework and instead suggests that you create your own simple grid solution, or pick from existing solutions, based on what works best for your project and preferences.</p>\n<p>Below is a non-exhaustive list of existing grid solutions:</p>\n<ul>\n<li><a href=\"https://css-tricks.com/snippets/css/a-guide-to-flexbox/\">Flexbox</a></li>\n<li><a href=\"http://neat.bourbon.io/\">Neat</a></li>\n<li><a href=\"http://flexboxgrid.com/\">Flexbox Grid</a></li>\n<li><a href=\"http://susy.oddbird.net/\">Susy</a></li>\n<li><a href=\"https://unsemantic.com/\">Unsemantic</a></li>\n<li><a href=\"http://getbootstrap.com/css/#grid\">Bootstrap grid</a></li>\n</ul>\n<p>If you have more suggestions, feel free to <a href=\"https://github.com/CMSgov/design-system/issues/new\">open a ticket</a>.</p>\n","referenceURI":"design-system/guidelines/grid","weight":0};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/guidelines/i18n/index.html b/docs/guidelines/i18n/index.html
index e6d23deef5..19fa2273a3 100644
--- a/docs/guidelines/i18n/index.html
+++ b/docs/guidelines/i18n/index.html
@@ -2,14 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Internationalization - CMSgov Design System</title>
+  <title>Internationalization - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1447848790"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" data-reactid="12">Internationalization</h1><div class="ds-u-clearfix" data-reactid="13"></div><!-- react-empty: 14 --></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>The design system&#39;s React components accepts all text as <code>props</code>, and it is the app&#39;s responsibility to provide the internationalized strings.</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1705304330"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" data-reactid="10">Internationalization</h1><div class="ds-u-clearfix" data-reactid="11"></div><!-- react-empty: 12 --></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>The design system&#39;s React components accepts all text as <code>props</code>, and it is the app&#39;s responsibility to provide the internationalized strings.</p>
 <p>For example:</p>
 <pre class="language-jsx"><code><span class="token keyword">import</span> <span class="token punctuation">{</span>Alert<span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'@cmsgov/design-system-core'</span><span class="token punctuation">;</span>
 <span class="token keyword">import</span> i18n <span class="token keyword">from</span> <span class="token string">'i18n'</span><span class="token punctuation">;</span>
@@ -24,7 +24,7 @@
   </div>
   <script type="text/javascript">
     var page = {"header":"Internationalization","description":"<p>The design system&#39;s React components accepts all text as <code>props</code>, and it is the app&#39;s responsibility to provide the internationalized strings.</p>\n<p>For example:</p>\n<pre class=\"language-jsx\"><code><span class=\"token keyword\">import</span> <span class=\"token punctuation\">{</span>Alert<span class=\"token punctuation\">}</span> <span class=\"token keyword\">from</span> <span class=\"token string\">'@cmsgov/design-system-core'</span><span class=\"token punctuation\">;</span>\n<span class=\"token keyword\">import</span> i18n <span class=\"token keyword\">from</span> <span class=\"token string\">'i18n'</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token keyword\">export</span> <span class=\"token keyword\">default</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n  <span class=\"token keyword\">return</span> <span class=\"token punctuation\">(</span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>Alert</span> <span class=\"token attr-name\">heading</span><span class=\"token script language-javascript\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">{</span><span class=\"token function\">i18n</span><span class=\"token punctuation\">(</span><span class=\"token string\">'success'</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">}</span></span><span class=\"token punctuation\">></span></span>\n      <span class=\"token punctuation\">{</span><span class=\"token function\">i18n</span><span class=\"token punctuation\">(</span><span class=\"token string\">'account.created'</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">}</span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>Alert</span><span class=\"token punctuation\">></span></span>\n  <span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n<span class=\"token punctuation\">}</span></code></pre>","referenceURI":"design-system/guidelines/i18n","weight":0};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/guidelines/responsive/index.html b/docs/guidelines/responsive/index.html
index b878d000e7..5f6ffbd52e 100644
--- a/docs/guidelines/responsive/index.html
+++ b/docs/guidelines/responsive/index.html
@@ -2,14 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Responsive design - CMSgov Design System</title>
+  <title>Responsive design - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="2007518814"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" data-reactid="12">Responsive design</h1><div class="ds-u-clearfix" data-reactid="13"></div><!-- react-empty: 14 --></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p><img src="/design-system/public/images/responsive-demo.gif" alt="Responsive demo"></p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1802567170"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" data-reactid="10">Responsive design</h1><div class="ds-u-clearfix" data-reactid="11"></div><!-- react-empty: 12 --></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p><img src="/design-system/public/images/responsive-demo.gif" alt="Responsive demo"></p>
 <p>The design system&#39;s utility and typography classes are built with reponsive web design in mind and is built to be <strong>mobile first</strong>. Use the prefixes <code>sm</code>, <code>md</code>, <code>lg</code>, and <code>xl</code> to quickly and easily adjust your layout and content for different screen sizes and devices. Further info and usage examples are available on the individual documentation pages.</p>
 <table class="ds-c-table">
 <thead>
@@ -58,7 +58,7 @@ <h2 id="what-supports-a-responsive-prefix">What supports a responsive prefix</h2
   </div>
   <script type="text/javascript">
     var page = {"header":"Responsive design","description":"<p><img src=\"/design-system/public/images/responsive-demo.gif\" alt=\"Responsive demo\"></p>\n<p>The design system&#39;s utility and typography classes are built with reponsive web design in mind and is built to be <strong>mobile first</strong>. Use the prefixes <code>sm</code>, <code>md</code>, <code>lg</code>, and <code>xl</code> to quickly and easily adjust your layout and content for different screen sizes and devices. Further info and usage examples are available on the individual documentation pages.</p>\n<table class=\"ds-c-table\">\n<thead>\n<tr>\n<th>Prefix</th>\n<th>Breakpoint</th>\n<th>Description</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td><code>sm</code></td>\n<td><code>min-width(544px)</code></td>\n<td>Viewports 544px and wider</td>\n</tr>\n<tr>\n<td><code>md</code></td>\n<td><code>min-width(768px)</code></td>\n<td>Viewports 768px and wider</td>\n</tr>\n<tr>\n<td><code>lg</code></td>\n<td><code>min-width(1024px)</code></td>\n<td>Viewports 1024px and wider</td>\n</tr>\n<tr>\n<td><code>xl</code></td>\n<td><code>min-width(1280px)</code></td>\n<td>Viewports 1280px and wider</td>\n</tr>\n</tbody>\n</table>\n<p>For example: <code>ds-u-lg-display--none</code> sets an element&#39;s <code>display</code> property to <code>none</code> when the viewport is <code>1024px</code> or wider.</p>\n<h2 id=\"what-supports-a-responsive-prefix\">What supports a responsive prefix</h2>\n<p>In order to reduce code bloat, not all utilities support a responsive prefix. Only the items in the following list support responsive prefixes.</p>\n<ul>\n<li><a href=\"/design-system/base/typography#responsive\">Typography</a></li>\n<li><a href=\"/design-system/utilities/float#responsive\">Float</a></li>\n<li><a href=\"/design-system/utilities/font-size#responsive\">Font size</a></li>\n<li><a href=\"/design-system/utilities/margin#responsive\">Margin</a></li>\n<li><a href=\"/design-system/utilities/padding#responsive\">Padding</a></li>\n<li><a href=\"/design-system/utilities/text-align#responsive\">Text align</a></li>\n<li><a href=\"/design-system/utilities/visibility#responsive\">Visibility</a></li>\n</ul>\n","referenceURI":"design-system/guidelines/responsive","weight":10};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/index.html b/docs/index.html
index f9fd95cbaa..47a90de048 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -2,14 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Getting started - CMSgov Design System</title>
+  <title>Getting started - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-260487051"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" data-reactid="12">Getting started</h1><div class="ds-u-clearfix" data-reactid="13"></div><!-- react-empty: 14 --></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p class="ds-text--lead">The design system is a shared set of design and development resources for creating accessible and consistent websites. The design system includes things like principles, high-level guidelines (UX conventions, UI code conventions, etc), UI components, documentation, tools, resources, and more.</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1983422494"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" data-reactid="10">Getting started</h1><div class="ds-u-clearfix" data-reactid="11"></div><!-- react-empty: 12 --></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p class="ds-text--lead">The design system is a shared set of design and development resources for creating accessible and consistent websites. The design system includes things like principles, high-level guidelines (UX conventions, UI code conventions, etc), UI components, documentation, tools, resources, and more.</p>
 
 <h2 id="installation">Installation</h2>
 <p> We suggest using a package manager like NPM or Yarn to install the design system package if you&#39;re working on a real world project. This way you can easily update the package when there&#39;s a new release.</p>
@@ -84,11 +84,13 @@ <h2 id="file-structure">File Structure</h2>
     ├── utilities       Functional CSS classes to apply individual traits
     └── vendor          Third-party libraries</code></pre><h2 id="examples">Examples</h2>
 <p><a href="https://github.com/CMSgov/design-system/tree/master/examples/"><strong>View example projects</strong></a> to see ways you can use the design system and incorporate it into your development process.</p>
+<h2 id="credits">Credits</h2>
+<p>Our design system is a variation and extension of the <a href="https://standards.usa.gov">U.S. Web Design Standards</a>. Thank you to 18F and GSA for the hard work they put into the Standards. We&#39;re excited to contribute our learnings and progress.</p>
 </div></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Getting started","description":"<p class=\"ds-text--lead\">The design system is a shared set of design and development resources for creating accessible and consistent websites. The design system includes things like principles, high-level guidelines (UX conventions, UI code conventions, etc), UI components, documentation, tools, resources, and more.</p>\n\n<h2 id=\"installation\">Installation</h2>\n<p> We suggest using a package manager like NPM or Yarn to install the design system package if you&#39;re working on a real world project. This way you can easily update the package when there&#39;s a new release.</p>\n<pre ><code>npm install --save @cmsgov/design-system-core</code></pre><p>or if you&#39;re using Yarn:</p>\n<pre ><code>yarn add @cmsgov/design-system-core</code></pre><p>You can also download a .zip of the design system directly from our <a href=\"https://github.com/CMSgov/design-system/releases\">GitHub repo</a>.</p>\n<h3 id=\"fonts-and-images\">Fonts and images</h3>\n<p>Copy the design system&#39;s <code>fonts</code> and <code>images</code> directories into the same directory as your site&#39;s CSS.</p>\n<p>By default, the design system expects a file structure like this:</p>\n<pre ><code>├── Your site's public assets directory/\n    ├── bundle.css\n    ├── fonts/\n    └── images/</code></pre><p>You can manually copy these directories, or you could integrate this step into your build process. <a href=\"https://github.com/CMSgov/design-system/blob/master/examples/react-app/Gulpfile.js\">Here&#39;s an example of how this step could be accomplished using a Gulp task</a>.</p>\n<p>You can change the default paths by overriding the following Sass variables:</p>\n<ul>\n<li><code>$font-path</code></li>\n<li><code>$image-path</code></li>\n</ul>\n<h2 id=\"usage\">Usage</h2>\n<p>Below are examples of the various ways you can reference the design system&#39;s styles and React components:</p>\n<h3 id=\"styles\">Styles</h3>\n<h4 id=\"using-the-bundled-css-file\">Using the bundled CSS file</h4>\n<p>The easiest way to add the design system&#39;s styles to your site is by referencing its bundled CSS file.</p>\n<ol>\n<li>Copy the design system&#39;s <code>dist/css</code> folder into a relevant place in your code base — likely a directory where you keep third-party libraries. In the example below, our directory is <code>css/vendor</code>.</li>\n<li>Add a <code>&lt;link&gt;</code> to the stylesheet in your site&#39;s <code>&lt;head&gt;</code></li>\n</ol>\n<p>For example:</p>\n<pre class=\"language-markup\"><code><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>link</span> <span class=\"token attr-name\">rel</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>stylesheet<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>css/vendor/design-system-core/index.css<span class=\"token punctuation\">\"</span></span> <span class=\"token punctuation\">/></span></span></code></pre><p><a href=\"https://github.com/CMSgov/design-system/blob/master/examples/article/index.html\">View an example</a></p>\n<h4 id=\"using-sass\">Using Sass</h4>\n<p>If you&#39;re already using Sass to style your site, another way to include the design system&#39;s styles is by importing its main Sass file.</p>\n<pre class=\"language-scss\"><code><span class=\"token keyword\">@import</span> <span class=\"token string\">'node_modules/@cmsgov/design-system-core/src/index'</span><span class=\"token punctuation\">;</span></code></pre><p>To override any of the design system&#39;s Sass variables, include the variable definitions <em>before</em> the line where the design system is imported.</p>\n<p><a href=\"https://github.com/CMSgov/design-system/tree/master/examples/react-app\">View an example</a></p>\n<h4 id=\"applying-styling\">Applying styling</h4>\n<p>Once your page is loading the design system&#39;s CSS, you can then begin adding its CSS class names to utilize the system. Below is an example of a project applying the base-level of styles and a utility class.</p>\n<pre class=\"language-markup\"><code><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>html</span><span class=\"token punctuation\">></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>head</span><span class=\"token punctuation\">></span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>link</span> <span class=\"token attr-name\">rel</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>stylesheet<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>node_modules/@cmsgov/design-system-core/dist/index.css<span class=\"token punctuation\">\"</span></span> <span class=\"token punctuation\">/></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>head</span><span class=\"token punctuation\">></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>body</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ds-base<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">></span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ds-u-font-size--title<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">></span></span>Hello world<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>body</span><span class=\"token punctuation\">></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>html</span><span class=\"token punctuation\">></span></span></code></pre><h3 id=\"react\">React</h3>\n<h4 id=\"importing-defaults\">Importing defaults</h4>\n<p>Individual components can be imported from their individual export file.</p>\n<pre class=\"language-jsx\"><code><span class=\"token keyword\">import</span> Button <span class=\"token keyword\">from</span> <span class=\"token string\">'@cmsgov/design-system-core/dist/components/Button/Button'</span><span class=\"token punctuation\">;</span></code></pre><h4 id=\"named-imports\">Named imports</h4>\n<p>Components can also be imported using the shorter syntax below.</p>\n<div class=\"ds-c-alert ds-c-alert--warn ds-u-margin-bottom--2\">\n  <div class=\"ds-c-alert__body\">\n    <h3 class=\"ds-c-alert__heading\">A note on performance</h3>\n    <p class=\"ds-c-alert__text\">\n      This approach may result in a much larger file than you intend. Depending on what module bundler you use, all of the design system&#39;s React components may be included in the bundled file even if you didn&#39;t specifically import them. This can be avoided by enabling features like <a href=\"https://webpack.js.org/guides/tree-shaking/\">tree shaking in Webpack</a>.\n    </p>\n  </div>\n</div>\n\n<pre class=\"language-jsx\"><code><span class=\"token keyword\">import</span> <span class=\"token punctuation\">{</span>Button<span class=\"token punctuation\">}</span> <span class=\"token keyword\">from</span> <span class=\"token string\">'@cmsgov/design-system-core'</span><span class=\"token punctuation\">;</span></code></pre><p><a href=\"https://github.com/CMSgov/design-system/tree/master/examples/react-app\">View an example</a></p>\n<h2 id=\"file-structure\">File Structure</h2>\n<p>The design system follows a variation of <a href=\"http://thomasbyttebier.be/blog/less-css-mess\">ITCSS</a> (Inverted Triangle architecture for CSS). The goal is to write CSS in <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity\">specificity</a> order.</p>\n<!-- You can regenerate the tree by running tree -d -I \"node_modules\" -->\n<pre ><code>├── dist                Transpiled CSS and fonts\n└── src                 Sass and JSX\n    ├── base            Base HTML styles\n    ├── components      Sass and React components\n    │   ├── Button\n    │   └── etc...\n    ├── fonts\n    ├── generics        Far reaching selectors\n    ├── images\n    ├── layouts         Structural patterns; No cosmetics.\n    ├── settings        Globally-available settings and config options\n    ├── tools           Helper functions and public mixins\n    ├── utilities       Functional CSS classes to apply individual traits\n    └── vendor          Third-party libraries</code></pre><h2 id=\"examples\">Examples</h2>\n<p><a href=\"https://github.com/CMSgov/design-system/tree/master/examples/\"><strong>View example projects</strong></a> to see ways you can use the design system and incorporate it into your development process.</p>\n","referenceURI":"design-system/","weight":-100};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Getting started","description":"<p class=\"ds-text--lead\">The design system is a shared set of design and development resources for creating accessible and consistent websites. The design system includes things like principles, high-level guidelines (UX conventions, UI code conventions, etc), UI components, documentation, tools, resources, and more.</p>\n\n<h2 id=\"installation\">Installation</h2>\n<p> We suggest using a package manager like NPM or Yarn to install the design system package if you&#39;re working on a real world project. This way you can easily update the package when there&#39;s a new release.</p>\n<pre ><code>npm install --save @cmsgov/design-system-core</code></pre><p>or if you&#39;re using Yarn:</p>\n<pre ><code>yarn add @cmsgov/design-system-core</code></pre><p>You can also download a .zip of the design system directly from our <a href=\"https://github.com/CMSgov/design-system/releases\">GitHub repo</a>.</p>\n<h3 id=\"fonts-and-images\">Fonts and images</h3>\n<p>Copy the design system&#39;s <code>fonts</code> and <code>images</code> directories into the same directory as your site&#39;s CSS.</p>\n<p>By default, the design system expects a file structure like this:</p>\n<pre ><code>├── Your site's public assets directory/\n    ├── bundle.css\n    ├── fonts/\n    └── images/</code></pre><p>You can manually copy these directories, or you could integrate this step into your build process. <a href=\"https://github.com/CMSgov/design-system/blob/master/examples/react-app/Gulpfile.js\">Here&#39;s an example of how this step could be accomplished using a Gulp task</a>.</p>\n<p>You can change the default paths by overriding the following Sass variables:</p>\n<ul>\n<li><code>$font-path</code></li>\n<li><code>$image-path</code></li>\n</ul>\n<h2 id=\"usage\">Usage</h2>\n<p>Below are examples of the various ways you can reference the design system&#39;s styles and React components:</p>\n<h3 id=\"styles\">Styles</h3>\n<h4 id=\"using-the-bundled-css-file\">Using the bundled CSS file</h4>\n<p>The easiest way to add the design system&#39;s styles to your site is by referencing its bundled CSS file.</p>\n<ol>\n<li>Copy the design system&#39;s <code>dist/css</code> folder into a relevant place in your code base — likely a directory where you keep third-party libraries. In the example below, our directory is <code>css/vendor</code>.</li>\n<li>Add a <code>&lt;link&gt;</code> to the stylesheet in your site&#39;s <code>&lt;head&gt;</code></li>\n</ol>\n<p>For example:</p>\n<pre class=\"language-markup\"><code><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>link</span> <span class=\"token attr-name\">rel</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>stylesheet<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>css/vendor/design-system-core/index.css<span class=\"token punctuation\">\"</span></span> <span class=\"token punctuation\">/></span></span></code></pre><p><a href=\"https://github.com/CMSgov/design-system/blob/master/examples/article/index.html\">View an example</a></p>\n<h4 id=\"using-sass\">Using Sass</h4>\n<p>If you&#39;re already using Sass to style your site, another way to include the design system&#39;s styles is by importing its main Sass file.</p>\n<pre class=\"language-scss\"><code><span class=\"token keyword\">@import</span> <span class=\"token string\">'node_modules/@cmsgov/design-system-core/src/index'</span><span class=\"token punctuation\">;</span></code></pre><p>To override any of the design system&#39;s Sass variables, include the variable definitions <em>before</em> the line where the design system is imported.</p>\n<p><a href=\"https://github.com/CMSgov/design-system/tree/master/examples/react-app\">View an example</a></p>\n<h4 id=\"applying-styling\">Applying styling</h4>\n<p>Once your page is loading the design system&#39;s CSS, you can then begin adding its CSS class names to utilize the system. Below is an example of a project applying the base-level of styles and a utility class.</p>\n<pre class=\"language-markup\"><code><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>html</span><span class=\"token punctuation\">></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>head</span><span class=\"token punctuation\">></span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>link</span> <span class=\"token attr-name\">rel</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>stylesheet<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>node_modules/@cmsgov/design-system-core/dist/index.css<span class=\"token punctuation\">\"</span></span> <span class=\"token punctuation\">/></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>head</span><span class=\"token punctuation\">></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>body</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ds-base<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">></span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ds-u-font-size--title<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">></span></span>Hello world<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>body</span><span class=\"token punctuation\">></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>html</span><span class=\"token punctuation\">></span></span></code></pre><h3 id=\"react\">React</h3>\n<h4 id=\"importing-defaults\">Importing defaults</h4>\n<p>Individual components can be imported from their individual export file.</p>\n<pre class=\"language-jsx\"><code><span class=\"token keyword\">import</span> Button <span class=\"token keyword\">from</span> <span class=\"token string\">'@cmsgov/design-system-core/dist/components/Button/Button'</span><span class=\"token punctuation\">;</span></code></pre><h4 id=\"named-imports\">Named imports</h4>\n<p>Components can also be imported using the shorter syntax below.</p>\n<div class=\"ds-c-alert ds-c-alert--warn ds-u-margin-bottom--2\">\n  <div class=\"ds-c-alert__body\">\n    <h3 class=\"ds-c-alert__heading\">A note on performance</h3>\n    <p class=\"ds-c-alert__text\">\n      This approach may result in a much larger file than you intend. Depending on what module bundler you use, all of the design system&#39;s React components may be included in the bundled file even if you didn&#39;t specifically import them. This can be avoided by enabling features like <a href=\"https://webpack.js.org/guides/tree-shaking/\">tree shaking in Webpack</a>.\n    </p>\n  </div>\n</div>\n\n<pre class=\"language-jsx\"><code><span class=\"token keyword\">import</span> <span class=\"token punctuation\">{</span>Button<span class=\"token punctuation\">}</span> <span class=\"token keyword\">from</span> <span class=\"token string\">'@cmsgov/design-system-core'</span><span class=\"token punctuation\">;</span></code></pre><p><a href=\"https://github.com/CMSgov/design-system/tree/master/examples/react-app\">View an example</a></p>\n<h2 id=\"file-structure\">File Structure</h2>\n<p>The design system follows a variation of <a href=\"http://thomasbyttebier.be/blog/less-css-mess\">ITCSS</a> (Inverted Triangle architecture for CSS). The goal is to write CSS in <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity\">specificity</a> order.</p>\n<!-- You can regenerate the tree by running tree -d -I \"node_modules\" -->\n<pre ><code>├── dist                Transpiled CSS and fonts\n└── src                 Sass and JSX\n    ├── base            Base HTML styles\n    ├── components      Sass and React components\n    │   ├── Button\n    │   └── etc...\n    ├── fonts\n    ├── generics        Far reaching selectors\n    ├── images\n    ├── layouts         Structural patterns; No cosmetics.\n    ├── settings        Globally-available settings and config options\n    ├── tools           Helper functions and public mixins\n    ├── utilities       Functional CSS classes to apply individual traits\n    └── vendor          Third-party libraries</code></pre><h2 id=\"examples\">Examples</h2>\n<p><a href=\"https://github.com/CMSgov/design-system/tree/master/examples/\"><strong>View example projects</strong></a> to see ways you can use the design system and incorporate it into your development process.</p>\n<h2 id=\"credits\">Credits</h2>\n<p>Our design system is a variation and extension of the <a href=\"https://standards.usa.gov\">U.S. Web Design Standards</a>. Thank you to 18F and GSA for the hard work they put into the Standards. We&#39;re excited to contribute our learnings and progress.</p>\n","referenceURI":"design-system/","weight":-100};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/public/scripts/index.js b/docs/public/scripts/index.js
index 77385b6c12..eeb42f4694 100644
--- a/docs/public/scripts/index.js
+++ b/docs/public/scripts/index.js
@@ -1,4 +1,4 @@
-!function(modules){function __webpack_require__(moduleId){if(installedModules[moduleId])return installedModules[moduleId].exports;var module=installedModules[moduleId]={i:moduleId,l:!1,exports:{}};return modules[moduleId].call(module.exports,module,module.exports,__webpack_require__),module.l=!0,module.exports}var installedModules={};__webpack_require__.m=modules,__webpack_require__.c=installedModules,__webpack_require__.i=function(value){return value},__webpack_require__.d=function(exports,name,getter){__webpack_require__.o(exports,name)||Object.defineProperty(exports,name,{configurable:!1,enumerable:!0,get:getter})},__webpack_require__.n=function(module){var getter=module&&module.__esModule?function(){return module.default}:function(){return module};return __webpack_require__.d(getter,"a",getter),getter},__webpack_require__.o=function(object,property){return Object.prototype.hasOwnProperty.call(object,property)},__webpack_require__.p="/",__webpack_require__(__webpack_require__.s=314)}([function(module,exports){function defaultSetTimout(){throw new Error("setTimeout has not been defined")}function defaultClearTimeout(){throw new Error("clearTimeout has not been defined")}function runTimeout(fun){if(cachedSetTimeout===setTimeout)return setTimeout(fun,0);if((cachedSetTimeout===defaultSetTimout||!cachedSetTimeout)&&setTimeout)return cachedSetTimeout=setTimeout,setTimeout(fun,0);try{return cachedSetTimeout(fun,0)}catch(e){try{return cachedSetTimeout.call(null,fun,0)}catch(e){return cachedSetTimeout.call(this,fun,0)}}}function runClearTimeout(marker){if(cachedClearTimeout===clearTimeout)return clearTimeout(marker);if((cachedClearTimeout===defaultClearTimeout||!cachedClearTimeout)&&clearTimeout)return cachedClearTimeout=clearTimeout,clearTimeout(marker);try{return cachedClearTimeout(marker)}catch(e){try{return cachedClearTimeout.call(null,marker)}catch(e){return cachedClearTimeout.call(this,marker)}}}function cleanUpNextTick(){draining&&currentQueue&&(draining=!1,currentQueue.length?queue=currentQueue.concat(queue):queueIndex=-1,queue.length&&drainQueue())}function drainQueue(){if(!draining){var timeout=runTimeout(cleanUpNextTick);draining=!0;for(var len=queue.length;len;){for(currentQueue=queue,queue=[];++queueIndex<len;)currentQueue&&currentQueue[queueIndex].run();queueIndex=-1,len=queue.length}currentQueue=null,draining=!1,runClearTimeout(timeout)}}function Item(fun,array){this.fun=fun,this.array=array}function noop(){}var cachedSetTimeout,cachedClearTimeout,process=module.exports={};!function(){try{cachedSetTimeout="function"==typeof setTimeout?setTimeout:defaultSetTimout}catch(e){cachedSetTimeout=defaultSetTimout}try{cachedClearTimeout="function"==typeof clearTimeout?clearTimeout:defaultClearTimeout}catch(e){cachedClearTimeout=defaultClearTimeout}}();var currentQueue,queue=[],draining=!1,queueIndex=-1;process.nextTick=function(fun){var args=new Array(arguments.length-1);if(arguments.length>1)for(var i=1;i<arguments.length;i++)args[i-1]=arguments[i];queue.push(new Item(fun,args)),1!==queue.length||draining||runTimeout(drainQueue)},Item.prototype.run=function(){this.fun.apply(null,this.array)},process.title="browser",process.browser=!0,process.env={},process.argv=[],process.version="",process.versions={},process.on=noop,process.addListener=noop,process.once=noop,process.off=noop,process.removeListener=noop,process.removeAllListeners=noop,process.emit=noop,process.binding=function(name){throw new Error("process.binding is not supported")},process.cwd=function(){return"/"},process.chdir=function(dir){throw new Error("process.chdir is not supported")},process.umask=function(){return 0}},function(module,exports,__webpack_require__){"use strict";(function(process){function invariant(condition,format,a,b,c,d,e,f){if(validateFormat(format),!condition){var error;if(void 0===format)error=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var args=[a,b,c,d,e,f],argIndex=0;error=new Error(format.replace(/%s/g,function(){return args[argIndex++]})),error.name="Invariant Violation"}throw error.framesToPop=1,error}}var validateFormat=function(format){};"production"!==process.env.NODE_ENV&&(validateFormat=function(format){if(void 0===format)throw new Error("invariant requires an error message argument")}),module.exports=invariant}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyFunction=__webpack_require__(12),warning=emptyFunction;"production"!==process.env.NODE_ENV&&function(){var printWarning=function(format){for(var _len=arguments.length,args=Array(_len>1?_len-1:0),_key=1;_key<_len;_key++)args[_key-1]=arguments[_key];var argIndex=0,message="Warning: "+format.replace(/%s/g,function(){return args[argIndex++]});try{throw new Error(message)}catch(x){}};warning=function(condition,format){if(void 0===format)throw new Error("`warning(condition, format, ...args)` requires a warning message argument");if(0!==format.indexOf("Failed Composite propType: ")&&!condition){for(var _len2=arguments.length,args=Array(_len2>2?_len2-2:0),_key2=2;_key2<_len2;_key2++)args[_key2-2]=arguments[_key2];printWarning.apply(void 0,[format].concat(args))}}}(),module.exports=warning}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";module.exports=__webpack_require__(173)},function(module,exports,__webpack_require__){"use strict";function reactProdInvariant(code){for(var argCount=arguments.length-1,message="Minified React error #"+code+"; visit http://facebook.github.io/react/docs/error-decoder.html?invariant="+code,argIdx=0;argIdx<argCount;argIdx++)message+="&args[]="+encodeURIComponent(arguments[argIdx+1]);message+=" for the full message or use the non-minified dev environment for full errors and additional helpful warnings.";var error=new Error(message);throw error.name="Invariant Violation",error.framesToPop=1,error}module.exports=reactProdInvariant},function(module,exports,__webpack_require__){(function(process){if("production"!==process.env.NODE_ENV){var REACT_ELEMENT_TYPE="function"==typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103,isValidElement=function(object){return"object"==typeof object&&null!==object&&object.$$typeof===REACT_ELEMENT_TYPE};module.exports=__webpack_require__(87)(isValidElement,!0)}else module.exports=__webpack_require__(170)()}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;/*!
+!function(modules){function __webpack_require__(moduleId){if(installedModules[moduleId])return installedModules[moduleId].exports;var module=installedModules[moduleId]={i:moduleId,l:!1,exports:{}};return modules[moduleId].call(module.exports,module,module.exports,__webpack_require__),module.l=!0,module.exports}var installedModules={};__webpack_require__.m=modules,__webpack_require__.c=installedModules,__webpack_require__.i=function(value){return value},__webpack_require__.d=function(exports,name,getter){__webpack_require__.o(exports,name)||Object.defineProperty(exports,name,{configurable:!1,enumerable:!0,get:getter})},__webpack_require__.n=function(module){var getter=module&&module.__esModule?function(){return module.default}:function(){return module};return __webpack_require__.d(getter,"a",getter),getter},__webpack_require__.o=function(object,property){return Object.prototype.hasOwnProperty.call(object,property)},__webpack_require__.p="/",__webpack_require__(__webpack_require__.s=315)}([function(module,exports){function defaultSetTimout(){throw new Error("setTimeout has not been defined")}function defaultClearTimeout(){throw new Error("clearTimeout has not been defined")}function runTimeout(fun){if(cachedSetTimeout===setTimeout)return setTimeout(fun,0);if((cachedSetTimeout===defaultSetTimout||!cachedSetTimeout)&&setTimeout)return cachedSetTimeout=setTimeout,setTimeout(fun,0);try{return cachedSetTimeout(fun,0)}catch(e){try{return cachedSetTimeout.call(null,fun,0)}catch(e){return cachedSetTimeout.call(this,fun,0)}}}function runClearTimeout(marker){if(cachedClearTimeout===clearTimeout)return clearTimeout(marker);if((cachedClearTimeout===defaultClearTimeout||!cachedClearTimeout)&&clearTimeout)return cachedClearTimeout=clearTimeout,clearTimeout(marker);try{return cachedClearTimeout(marker)}catch(e){try{return cachedClearTimeout.call(null,marker)}catch(e){return cachedClearTimeout.call(this,marker)}}}function cleanUpNextTick(){draining&&currentQueue&&(draining=!1,currentQueue.length?queue=currentQueue.concat(queue):queueIndex=-1,queue.length&&drainQueue())}function drainQueue(){if(!draining){var timeout=runTimeout(cleanUpNextTick);draining=!0;for(var len=queue.length;len;){for(currentQueue=queue,queue=[];++queueIndex<len;)currentQueue&&currentQueue[queueIndex].run();queueIndex=-1,len=queue.length}currentQueue=null,draining=!1,runClearTimeout(timeout)}}function Item(fun,array){this.fun=fun,this.array=array}function noop(){}var cachedSetTimeout,cachedClearTimeout,process=module.exports={};!function(){try{cachedSetTimeout="function"==typeof setTimeout?setTimeout:defaultSetTimout}catch(e){cachedSetTimeout=defaultSetTimout}try{cachedClearTimeout="function"==typeof clearTimeout?clearTimeout:defaultClearTimeout}catch(e){cachedClearTimeout=defaultClearTimeout}}();var currentQueue,queue=[],draining=!1,queueIndex=-1;process.nextTick=function(fun){var args=new Array(arguments.length-1);if(arguments.length>1)for(var i=1;i<arguments.length;i++)args[i-1]=arguments[i];queue.push(new Item(fun,args)),1!==queue.length||draining||runTimeout(drainQueue)},Item.prototype.run=function(){this.fun.apply(null,this.array)},process.title="browser",process.browser=!0,process.env={},process.argv=[],process.version="",process.versions={},process.on=noop,process.addListener=noop,process.once=noop,process.off=noop,process.removeListener=noop,process.removeAllListeners=noop,process.emit=noop,process.binding=function(name){throw new Error("process.binding is not supported")},process.cwd=function(){return"/"},process.chdir=function(dir){throw new Error("process.chdir is not supported")},process.umask=function(){return 0}},function(module,exports,__webpack_require__){"use strict";(function(process){function invariant(condition,format,a,b,c,d,e,f){if(validateFormat(format),!condition){var error;if(void 0===format)error=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var args=[a,b,c,d,e,f],argIndex=0;error=new Error(format.replace(/%s/g,function(){return args[argIndex++]})),error.name="Invariant Violation"}throw error.framesToPop=1,error}}var validateFormat=function(format){};"production"!==process.env.NODE_ENV&&(validateFormat=function(format){if(void 0===format)throw new Error("invariant requires an error message argument")}),module.exports=invariant}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyFunction=__webpack_require__(12),warning=emptyFunction;"production"!==process.env.NODE_ENV&&function(){var printWarning=function(format){for(var _len=arguments.length,args=Array(_len>1?_len-1:0),_key=1;_key<_len;_key++)args[_key-1]=arguments[_key];var argIndex=0,message="Warning: "+format.replace(/%s/g,function(){return args[argIndex++]});try{throw new Error(message)}catch(x){}};warning=function(condition,format){if(void 0===format)throw new Error("`warning(condition, format, ...args)` requires a warning message argument");if(0!==format.indexOf("Failed Composite propType: ")&&!condition){for(var _len2=arguments.length,args=Array(_len2>2?_len2-2:0),_key2=2;_key2<_len2;_key2++)args[_key2-2]=arguments[_key2];printWarning.apply(void 0,[format].concat(args))}}}(),module.exports=warning}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";module.exports=__webpack_require__(173)},function(module,exports,__webpack_require__){"use strict";function reactProdInvariant(code){for(var argCount=arguments.length-1,message="Minified React error #"+code+"; visit http://facebook.github.io/react/docs/error-decoder.html?invariant="+code,argIdx=0;argIdx<argCount;argIdx++)message+="&args[]="+encodeURIComponent(arguments[argIdx+1]);message+=" for the full message or use the non-minified dev environment for full errors and additional helpful warnings.";var error=new Error(message);throw error.name="Invariant Violation",error.framesToPop=1,error}module.exports=reactProdInvariant},function(module,exports,__webpack_require__){(function(process){if("production"!==process.env.NODE_ENV){var REACT_ELEMENT_TYPE="function"==typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103,isValidElement=function(object){return"object"==typeof object&&null!==object&&object.$$typeof===REACT_ELEMENT_TYPE};module.exports=__webpack_require__(87)(isValidElement,!0)}else module.exports=__webpack_require__(170)()}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;/*!
   Copyright (c) 2016 Jed Watson.
   Licensed under the MIT License (MIT), see
   http://jedwatson.github.io/classnames
@@ -8,12 +8,12 @@ object-assign
 (c) Sindre Sorhus
 @license MIT
 */
-var getOwnPropertySymbols=Object.getOwnPropertySymbols,hasOwnProperty=Object.prototype.hasOwnProperty,propIsEnumerable=Object.prototype.propertyIsEnumerable;module.exports=function(){try{if(!Object.assign)return!1;var test1=new String("abc");if(test1[5]="de","5"===Object.getOwnPropertyNames(test1)[0])return!1;for(var test2={},i=0;i<10;i++)test2["_"+String.fromCharCode(i)]=i;if("0123456789"!==Object.getOwnPropertyNames(test2).map(function(n){return test2[n]}).join(""))return!1;var test3={};return"abcdefghijklmnopqrst".split("").forEach(function(letter){test3[letter]=letter}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},test3)).join("")}catch(err){return!1}}()?Object.assign:function(target,source){for(var from,symbols,to=toObject(target),s=1;s<arguments.length;s++){from=Object(arguments[s]);for(var key in from)hasOwnProperty.call(from,key)&&(to[key]=from[key]);if(getOwnPropertySymbols){symbols=getOwnPropertySymbols(from);for(var i=0;i<symbols.length;i++)propIsEnumerable.call(from,symbols[i])&&(to[symbols[i]]=from[symbols[i]])}}return to}},function(module,exports,__webpack_require__){"use strict";(function(process){function shouldPrecacheNode(node,nodeID){return 1===node.nodeType&&node.getAttribute(ATTR_NAME)===String(nodeID)||8===node.nodeType&&node.nodeValue===" react-text: "+nodeID+" "||8===node.nodeType&&node.nodeValue===" react-empty: "+nodeID+" "}function getRenderedHostOrTextFromComponent(component){for(var rendered;rendered=component._renderedComponent;)component=rendered;return component}function precacheNode(inst,node){var hostInst=getRenderedHostOrTextFromComponent(inst);hostInst._hostNode=node,node[internalInstanceKey]=hostInst}function uncacheNode(inst){var node=inst._hostNode;node&&(delete node[internalInstanceKey],inst._hostNode=null)}function precacheChildNodes(inst,node){if(!(inst._flags&Flags.hasCachedChildNodes)){var children=inst._renderedChildren,childNode=node.firstChild;outer:for(var name in children)if(children.hasOwnProperty(name)){var childInst=children[name],childID=getRenderedHostOrTextFromComponent(childInst)._domID;if(0!==childID){for(;null!==childNode;childNode=childNode.nextSibling)if(shouldPrecacheNode(childNode,childID)){precacheNode(childInst,childNode);continue outer}"production"!==process.env.NODE_ENV?invariant(!1,"Unable to find element with ID %s.",childID):_prodInvariant("32",childID)}}inst._flags|=Flags.hasCachedChildNodes}}function getClosestInstanceFromNode(node){if(node[internalInstanceKey])return node[internalInstanceKey];for(var parents=[];!node[internalInstanceKey];){if(parents.push(node),!node.parentNode)return null;node=node.parentNode}for(var closest,inst;node&&(inst=node[internalInstanceKey]);node=parents.pop())closest=inst,parents.length&&precacheChildNodes(inst,node);return closest}function getInstanceFromNode(node){var inst=getClosestInstanceFromNode(node);return null!=inst&&inst._hostNode===node?inst:null}function getNodeFromInstance(inst){if(void 0===inst._hostNode&&("production"!==process.env.NODE_ENV?invariant(!1,"getNodeFromInstance: Invalid argument."):_prodInvariant("33")),inst._hostNode)return inst._hostNode;for(var parents=[];!inst._hostNode;)parents.push(inst),inst._hostParent||("production"!==process.env.NODE_ENV?invariant(!1,"React DOM tree root should always have a node reference."):_prodInvariant("34")),inst=inst._hostParent;for(;parents.length;inst=parents.pop())precacheChildNodes(inst,inst._hostNode);return inst._hostNode}var _prodInvariant=__webpack_require__(4),DOMProperty=__webpack_require__(21),ReactDOMComponentFlags=__webpack_require__(105),invariant=__webpack_require__(1),ATTR_NAME=DOMProperty.ID_ATTRIBUTE_NAME,Flags=ReactDOMComponentFlags,internalInstanceKey="__reactInternalInstance$"+Math.random().toString(36).slice(2),ReactDOMComponentTree={getClosestInstanceFromNode:getClosestInstanceFromNode,getInstanceFromNode:getInstanceFromNode,getNodeFromInstance:getNodeFromInstance,precacheChildNodes:precacheChildNodes,precacheNode:precacheNode,uncacheNode:uncacheNode};module.exports=ReactDOMComponentTree}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var canUseDOM=!("undefined"==typeof window||!window.document||!window.document.createElement),ExecutionEnvironment={canUseDOM:canUseDOM,canUseWorkers:"undefined"!=typeof Worker,canUseEventListeners:canUseDOM&&!(!window.addEventListener&&!window.attachEvent),canUseViewport:canUseDOM&&!!window.screen,isInWorker:!canUseDOM};module.exports=ExecutionEnvironment},function(module,exports,__webpack_require__){"use strict";module.exports=__webpack_require__(28)},function(module,exports,__webpack_require__){"use strict";(function(process){function isNative(fn){var funcToString=Function.prototype.toString,hasOwnProperty=Object.prototype.hasOwnProperty,reIsNative=RegExp("^"+funcToString.call(hasOwnProperty).replace(/[\\^$.*+?()[\]{}|]/g,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$");try{var source=funcToString.call(fn);return reIsNative.test(source)}catch(err){return!1}}function purgeDeep(id){var item=getItem(id);if(item){var childIDs=item.childIDs;removeItem(id),childIDs.forEach(purgeDeep)}}function describeComponentFrame(name,source,ownerName){return"\n    in "+(name||"Unknown")+(source?" (at "+source.fileName.replace(/^.*[\\\/]/,"")+":"+source.lineNumber+")":ownerName?" (created by "+ownerName+")":"")}function getDisplayName(element){return null==element?"#empty":"string"==typeof element||"number"==typeof element?"#text":"string"==typeof element.type?element.type:element.type.displayName||element.type.name||"Unknown"}function describeID(id){var ownerName,name=ReactComponentTreeHook.getDisplayName(id),element=ReactComponentTreeHook.getElement(id),ownerID=ReactComponentTreeHook.getOwnerID(id);return ownerID&&(ownerName=ReactComponentTreeHook.getDisplayName(ownerID)),"production"!==process.env.NODE_ENV&&warning(element,"ReactComponentTreeHook: Missing React element for debugID %s when building stack",id),describeComponentFrame(name,element&&element._source,ownerName)}var setItem,getItem,removeItem,getItemIDs,addRoot,removeRoot,getRootIDs,_prodInvariant=__webpack_require__(29),ReactCurrentOwner=__webpack_require__(18),invariant=__webpack_require__(1),warning=__webpack_require__(2),canUseCollections="function"==typeof Array.from&&"function"==typeof Map&&isNative(Map)&&null!=Map.prototype&&"function"==typeof Map.prototype.keys&&isNative(Map.prototype.keys)&&"function"==typeof Set&&isNative(Set)&&null!=Set.prototype&&"function"==typeof Set.prototype.keys&&isNative(Set.prototype.keys);if(canUseCollections){var itemMap=new Map,rootIDSet=new Set;setItem=function(id,item){itemMap.set(id,item)},getItem=function(id){return itemMap.get(id)},removeItem=function(id){itemMap.delete(id)},getItemIDs=function(){return Array.from(itemMap.keys())},addRoot=function(id){rootIDSet.add(id)},removeRoot=function(id){rootIDSet.delete(id)},getRootIDs=function(){return Array.from(rootIDSet.keys())}}else{var itemByKey={},rootByKey={},getKeyFromID=function(id){return"."+id},getIDFromKey=function(key){return parseInt(key.substr(1),10)};setItem=function(id,item){var key=getKeyFromID(id);itemByKey[key]=item},getItem=function(id){var key=getKeyFromID(id);return itemByKey[key]},removeItem=function(id){var key=getKeyFromID(id);delete itemByKey[key]},getItemIDs=function(){return Object.keys(itemByKey).map(getIDFromKey)},addRoot=function(id){var key=getKeyFromID(id);rootByKey[key]=!0},removeRoot=function(id){var key=getKeyFromID(id);delete rootByKey[key]},getRootIDs=function(){return Object.keys(rootByKey).map(getIDFromKey)}}var unmountedIDs=[],ReactComponentTreeHook={onSetChildren:function(id,nextChildIDs){var item=getItem(id);item||("production"!==process.env.NODE_ENV?invariant(!1,"Item must have been set"):_prodInvariant("144")),item.childIDs=nextChildIDs;for(var i=0;i<nextChildIDs.length;i++){var nextChildID=nextChildIDs[i],nextChild=getItem(nextChildID);nextChild||("production"!==process.env.NODE_ENV?invariant(!1,"Expected hook events to fire for the child before its parent includes it in onSetChildren()."):_prodInvariant("140")),null==nextChild.childIDs&&"object"==typeof nextChild.element&&null!=nextChild.element&&("production"!==process.env.NODE_ENV?invariant(!1,"Expected onSetChildren() to fire for a container child before its parent includes it in onSetChildren()."):_prodInvariant("141")),nextChild.isMounted||("production"!==process.env.NODE_ENV?invariant(!1,"Expected onMountComponent() to fire for the child before its parent includes it in onSetChildren()."):_prodInvariant("71")),null==nextChild.parentID&&(nextChild.parentID=id),nextChild.parentID!==id&&("production"!==process.env.NODE_ENV?invariant(!1,"Expected onBeforeMountComponent() parent and onSetChildren() to be consistent (%s has parents %s and %s).",nextChildID,nextChild.parentID,id):_prodInvariant("142",nextChildID,nextChild.parentID,id))}},onBeforeMountComponent:function(id,element,parentID){setItem(id,{element:element,parentID:parentID,text:null,childIDs:[],isMounted:!1,updateCount:0})},onBeforeUpdateComponent:function(id,element){var item=getItem(id);item&&item.isMounted&&(item.element=element)},onMountComponent:function(id){var item=getItem(id);item||("production"!==process.env.NODE_ENV?invariant(!1,"Item must have been set"):_prodInvariant("144")),item.isMounted=!0,0===item.parentID&&addRoot(id)},onUpdateComponent:function(id){var item=getItem(id);item&&item.isMounted&&item.updateCount++},onUnmountComponent:function(id){var item=getItem(id);if(item){item.isMounted=!1;0===item.parentID&&removeRoot(id)}unmountedIDs.push(id)},purgeUnmountedComponents:function(){if(!ReactComponentTreeHook._preventPurging){for(var i=0;i<unmountedIDs.length;i++){purgeDeep(unmountedIDs[i])}unmountedIDs.length=0}},isMounted:function(id){var item=getItem(id);return!!item&&item.isMounted},getCurrentStackAddendum:function(topElement){var info="";if(topElement){var name=getDisplayName(topElement),owner=topElement._owner;info+=describeComponentFrame(name,topElement._source,owner&&owner.getName())}var currentOwner=ReactCurrentOwner.current,id=currentOwner&&currentOwner._debugID;return info+=ReactComponentTreeHook.getStackAddendumByID(id)},getStackAddendumByID:function(id){for(var info="";id;)info+=describeID(id),id=ReactComponentTreeHook.getParentID(id);return info},getChildIDs:function(id){var item=getItem(id);return item?item.childIDs:[]},getDisplayName:function(id){var element=ReactComponentTreeHook.getElement(id);return element?getDisplayName(element):null},getElement:function(id){var item=getItem(id);return item?item.element:null},getOwnerID:function(id){var element=ReactComponentTreeHook.getElement(id);return element&&element._owner?element._owner._debugID:null},getParentID:function(id){var item=getItem(id);return item?item.parentID:null},getSource:function(id){var item=getItem(id),element=item?item.element:null;return null!=element?element._source:null},getText:function(id){var element=ReactComponentTreeHook.getElement(id);return"string"==typeof element?element:"number"==typeof element?""+element:null},getUpdateCount:function(id){var item=getItem(id);return item?item.updateCount:0},getRootIDs:getRootIDs,getRegisteredIDs:getItemIDs,pushNonStandardWarningStack:function(isCreatingElement,currentSource){if("function"==typeof console.reactStack){var stack=[],currentOwner=ReactCurrentOwner.current,id=currentOwner&&currentOwner._debugID;try{for(isCreatingElement&&stack.push({name:id?ReactComponentTreeHook.getDisplayName(id):null,fileName:currentSource?currentSource.fileName:null,lineNumber:currentSource?currentSource.lineNumber:null});id;){var element=ReactComponentTreeHook.getElement(id),parentID=ReactComponentTreeHook.getParentID(id),ownerID=ReactComponentTreeHook.getOwnerID(id),ownerName=ownerID?ReactComponentTreeHook.getDisplayName(ownerID):null,source=element&&element._source;stack.push({name:ownerName,fileName:source?source.fileName:null,lineNumber:source?source.lineNumber:null}),id=parentID}}catch(err){}}},popNonStandardWarningStack:function(){console.reactStackEnd}};module.exports=ReactComponentTreeHook}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function makeEmptyFunction(arg){return function(){return arg}}var emptyFunction=function(){};emptyFunction.thatReturns=makeEmptyFunction,emptyFunction.thatReturnsFalse=makeEmptyFunction(!1),emptyFunction.thatReturnsTrue=makeEmptyFunction(!0),emptyFunction.thatReturnsNull=makeEmptyFunction(null),emptyFunction.thatReturnsThis=function(){return this},emptyFunction.thatReturnsArgument=function(arg){return arg},module.exports=emptyFunction},function(module,exports,__webpack_require__){(function(process){if("production"!==process.env.NODE_ENV){var REACT_ELEMENT_TYPE="function"==typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103,isValidElement=function(object){return"object"==typeof object&&null!==object&&object.$$typeof===REACT_ELEMENT_TYPE};module.exports=__webpack_require__(101)(isValidElement,!0)}else module.exports=__webpack_require__(225)()}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var debugTool=null;if("production"!==process.env.NODE_ENV){debugTool=__webpack_require__(255)}module.exports={debugTool:debugTool}}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function invariant(condition,format,a,b,c,d,e,f){if(validateFormat(format),!condition){var error;if(void 0===format)error=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var args=[a,b,c,d,e,f],argIndex=0;error=new Error(format.replace(/%s/g,function(){return args[argIndex++]})),error.name="Invariant Violation"}throw error.framesToPop=1,error}}var validateFormat=function(format){};"production"!==process.env.NODE_ENV&&(validateFormat=function(format){if(void 0===format)throw new Error("invariant requires an error message argument")}),module.exports=invariant}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){(function(global){function baseToString(value){if("string"==typeof value)return value;if(isSymbol(value))return symbolToString?symbolToString.call(value):"";var result=value+"";return"0"==result&&1/value==-INFINITY?"-0":result}function isObjectLike(value){return!!value&&"object"==typeof value}function isSymbol(value){return"symbol"==typeof value||isObjectLike(value)&&objectToString.call(value)==symbolTag}function toString(value){return null==value?"":baseToString(value)}function uniqueId(prefix){var id=++idCounter;return toString(prefix)+id}var INFINITY=1/0,symbolTag="[object Symbol]",freeGlobal="object"==typeof global&&global&&global.Object===Object&&global,freeSelf="object"==typeof self&&self&&self.Object===Object&&self,root=freeGlobal||freeSelf||Function("return this")(),objectProto=Object.prototype,idCounter=0,objectToString=objectProto.toString,Symbol=root.Symbol,symbolProto=Symbol?Symbol.prototype:void 0,symbolToString=symbolProto?symbolProto.toString:void 0;module.exports=uniqueId}).call(exports,__webpack_require__(46))},function(module,exports,__webpack_require__){"use strict";(function(process){function ensureInjected(){ReactUpdates.ReactReconcileTransaction&&batchingStrategy||("production"!==process.env.NODE_ENV?invariant(!1,"ReactUpdates: must inject a reconcile transaction class and batching strategy"):_prodInvariant("123"))}function ReactUpdatesFlushTransaction(){this.reinitializeTransaction(),this.dirtyComponentsLength=null,this.callbackQueue=CallbackQueue.getPooled(),this.reconcileTransaction=ReactUpdates.ReactReconcileTransaction.getPooled(!0)}function batchedUpdates(callback,a,b,c,d,e){return ensureInjected(),batchingStrategy.batchedUpdates(callback,a,b,c,d,e)}function mountOrderComparator(c1,c2){return c1._mountOrder-c2._mountOrder}function runBatchedUpdates(transaction){var len=transaction.dirtyComponentsLength;len!==dirtyComponents.length&&("production"!==process.env.NODE_ENV?invariant(!1,"Expected flush transaction's stored dirty-components length (%s) to match dirty-components array length (%s).",len,dirtyComponents.length):_prodInvariant("124",len,dirtyComponents.length)),dirtyComponents.sort(mountOrderComparator),updateBatchNumber++;for(var i=0;i<len;i++){var component=dirtyComponents[i],callbacks=component._pendingCallbacks;component._pendingCallbacks=null;if(ReactFeatureFlags.logTopLevelRenders){var namedComponent=component;component._currentElement.type.isReactTopLevelWrapper&&(namedComponent=component._renderedComponent),"React update: "+namedComponent.getName()}if(ReactReconciler.performUpdateIfNecessary(component,transaction.reconcileTransaction,updateBatchNumber),callbacks)for(var j=0;j<callbacks.length;j++)transaction.callbackQueue.enqueue(callbacks[j],component.getPublicInstance())}}function enqueueUpdate(component){if(ensureInjected(),!batchingStrategy.isBatchingUpdates)return void batchingStrategy.batchedUpdates(enqueueUpdate,component);dirtyComponents.push(component),null==component._updateBatchNumber&&(component._updateBatchNumber=updateBatchNumber+1)}function asap(callback,context){batchingStrategy.isBatchingUpdates||("production"!==process.env.NODE_ENV?invariant(!1,"ReactUpdates.asap: Can't enqueue an asap callback in a context whereupdates are not being batched."):_prodInvariant("125")),asapCallbackQueue.enqueue(callback,context),asapEnqueued=!0}var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),CallbackQueue=__webpack_require__(103),PooledClass=__webpack_require__(23),ReactFeatureFlags=__webpack_require__(108),ReactReconciler=__webpack_require__(27),Transaction=__webpack_require__(42),invariant=__webpack_require__(1),dirtyComponents=[],updateBatchNumber=0,asapCallbackQueue=CallbackQueue.getPooled(),asapEnqueued=!1,batchingStrategy=null,NESTED_UPDATES={initialize:function(){this.dirtyComponentsLength=dirtyComponents.length},close:function(){this.dirtyComponentsLength!==dirtyComponents.length?(dirtyComponents.splice(0,this.dirtyComponentsLength),flushBatchedUpdates()):dirtyComponents.length=0}},UPDATE_QUEUEING={initialize:function(){this.callbackQueue.reset()},close:function(){this.callbackQueue.notifyAll()}},TRANSACTION_WRAPPERS=[NESTED_UPDATES,UPDATE_QUEUEING];_assign(ReactUpdatesFlushTransaction.prototype,Transaction,{getTransactionWrappers:function(){return TRANSACTION_WRAPPERS},destructor:function(){this.dirtyComponentsLength=null,CallbackQueue.release(this.callbackQueue),this.callbackQueue=null,ReactUpdates.ReactReconcileTransaction.release(this.reconcileTransaction),this.reconcileTransaction=null},perform:function(method,scope,a){return Transaction.perform.call(this,this.reconcileTransaction.perform,this.reconcileTransaction,method,scope,a)}}),PooledClass.addPoolingTo(ReactUpdatesFlushTransaction);var flushBatchedUpdates=function(){for(;dirtyComponents.length||asapEnqueued;){if(dirtyComponents.length){var transaction=ReactUpdatesFlushTransaction.getPooled();transaction.perform(runBatchedUpdates,null,transaction),ReactUpdatesFlushTransaction.release(transaction)}if(asapEnqueued){asapEnqueued=!1;var queue=asapCallbackQueue;asapCallbackQueue=CallbackQueue.getPooled(),queue.notifyAll(),CallbackQueue.release(queue)}}},ReactUpdatesInjection={injectReconcileTransaction:function(ReconcileTransaction){ReconcileTransaction||("production"!==process.env.NODE_ENV?invariant(!1,"ReactUpdates: must provide a reconcile transaction class"):_prodInvariant("126")),ReactUpdates.ReactReconcileTransaction=ReconcileTransaction},injectBatchingStrategy:function(_batchingStrategy){_batchingStrategy||("production"!==process.env.NODE_ENV?invariant(!1,"ReactUpdates: must provide a batching strategy"):_prodInvariant("127")),"function"!=typeof _batchingStrategy.batchedUpdates&&("production"!==process.env.NODE_ENV?invariant(!1,"ReactUpdates: must provide a batchedUpdates() function"):_prodInvariant("128")),"boolean"!=typeof _batchingStrategy.isBatchingUpdates&&("production"!==process.env.NODE_ENV?invariant(!1,"ReactUpdates: must provide an isBatchingUpdates boolean attribute"):_prodInvariant("129")),batchingStrategy=_batchingStrategy}},ReactUpdates={ReactReconcileTransaction:null,batchedUpdates:batchedUpdates,enqueueUpdate:enqueueUpdate,flushBatchedUpdates:flushBatchedUpdates,injection:ReactUpdatesInjection,asap:asap};module.exports=ReactUpdates}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var ReactCurrentOwner={current:null};module.exports=ReactCurrentOwner},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyFunction=__webpack_require__(34),warning=emptyFunction;"production"!==process.env.NODE_ENV&&function(){var printWarning=function(format){for(var _len=arguments.length,args=Array(_len>1?_len-1:0),_key=1;_key<_len;_key++)args[_key-1]=arguments[_key];var argIndex=0,message="Warning: "+format.replace(/%s/g,function(){return args[argIndex++]});try{throw new Error(message)}catch(x){}};warning=function(condition,format){if(void 0===format)throw new Error("`warning(condition, format, ...args)` requires a warning message argument");if(0!==format.indexOf("Failed Composite propType: ")&&!condition){for(var _len2=arguments.length,args=Array(_len2>2?_len2-2:0),_key2=2;_key2<_len2;_key2++)args[_key2-2]=arguments[_key2];printWarning.apply(void 0,[format].concat(args))}}}(),module.exports=warning}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function SyntheticEvent(dispatchConfig,targetInst,nativeEvent,nativeEventTarget){"production"!==process.env.NODE_ENV&&(delete this.nativeEvent,delete this.preventDefault,delete this.stopPropagation),this.dispatchConfig=dispatchConfig,this._targetInst=targetInst,this.nativeEvent=nativeEvent;var Interface=this.constructor.Interface;for(var propName in Interface)if(Interface.hasOwnProperty(propName)){"production"!==process.env.NODE_ENV&&delete this[propName];var normalize=Interface[propName];normalize?this[propName]=normalize(nativeEvent):"target"===propName?this.target=nativeEventTarget:this[propName]=nativeEvent[propName]}var defaultPrevented=null!=nativeEvent.defaultPrevented?nativeEvent.defaultPrevented:!1===nativeEvent.returnValue;return this.isDefaultPrevented=defaultPrevented?emptyFunction.thatReturnsTrue:emptyFunction.thatReturnsFalse,this.isPropagationStopped=emptyFunction.thatReturnsFalse,this}function getPooledWarningPropertyDefinition(propName,getVal){function set(val){return warn(isFunction?"setting the method":"setting the property","This is effectively a no-op"),val}function get(){return warn(isFunction?"accessing the method":"accessing the property",isFunction?"This is a no-op function":"This is set to null"),getVal}function warn(action,result){"production"!==process.env.NODE_ENV&&warning(!1,"This synthetic event is reused for performance reasons. If you're seeing this, you're %s `%s` on a released/nullified synthetic event. %s. If you must keep the original synthetic event around, use event.persist(). See https://fb.me/react-event-pooling for more information.",action,propName,result)}var isFunction="function"==typeof getVal;return{configurable:!0,set:set,get:get}}var _assign=__webpack_require__(7),PooledClass=__webpack_require__(23),emptyFunction=__webpack_require__(12),warning=__webpack_require__(2),didWarnForAddedNewProperty=!1,isProxySupported="function"==typeof Proxy,shouldBeReleasedProperties=["dispatchConfig","_targetInst","nativeEvent","isDefaultPrevented","isPropagationStopped","_dispatchListeners","_dispatchInstances"],EventInterface={type:null,target:null,currentTarget:emptyFunction.thatReturnsNull,eventPhase:null,bubbles:null,cancelable:null,timeStamp:function(event){return event.timeStamp||Date.now()},defaultPrevented:null,isTrusted:null};_assign(SyntheticEvent.prototype,{preventDefault:function(){this.defaultPrevented=!0;var event=this.nativeEvent;event&&(event.preventDefault?event.preventDefault():"unknown"!=typeof event.returnValue&&(event.returnValue=!1),this.isDefaultPrevented=emptyFunction.thatReturnsTrue)},stopPropagation:function(){var event=this.nativeEvent;event&&(event.stopPropagation?event.stopPropagation():"unknown"!=typeof event.cancelBubble&&(event.cancelBubble=!0),this.isPropagationStopped=emptyFunction.thatReturnsTrue)},persist:function(){this.isPersistent=emptyFunction.thatReturnsTrue},isPersistent:emptyFunction.thatReturnsFalse,destructor:function(){var Interface=this.constructor.Interface;for(var propName in Interface)"production"!==process.env.NODE_ENV?Object.defineProperty(this,propName,getPooledWarningPropertyDefinition(propName,Interface[propName])):this[propName]=null;for(var i=0;i<shouldBeReleasedProperties.length;i++)this[shouldBeReleasedProperties[i]]=null;"production"!==process.env.NODE_ENV&&(Object.defineProperty(this,"nativeEvent",getPooledWarningPropertyDefinition("nativeEvent",null)),Object.defineProperty(this,"preventDefault",getPooledWarningPropertyDefinition("preventDefault",emptyFunction)),Object.defineProperty(this,"stopPropagation",getPooledWarningPropertyDefinition("stopPropagation",emptyFunction)))}}),SyntheticEvent.Interface=EventInterface,"production"!==process.env.NODE_ENV&&isProxySupported&&(SyntheticEvent=new Proxy(SyntheticEvent,{construct:function(target,args){return this.apply(target,Object.create(target.prototype),args)},apply:function(constructor,that,args){return new Proxy(constructor.apply(that,args),{set:function(target,prop,value){return"isPersistent"===prop||target.constructor.Interface.hasOwnProperty(prop)||-1!==shouldBeReleasedProperties.indexOf(prop)||("production"!==process.env.NODE_ENV&&warning(didWarnForAddedNewProperty||target.isPersistent(),"This synthetic event is reused for performance reasons. If you're seeing this, you're adding a new property in the synthetic event object. The property is never released. See https://fb.me/react-event-pooling for more information."),didWarnForAddedNewProperty=!0),target[prop]=value,!0}})}})),SyntheticEvent.augmentClass=function(Class,Interface){var Super=this,E=function(){};E.prototype=Super.prototype;var prototype=new E;_assign(prototype,Class.prototype),Class.prototype=prototype,Class.prototype.constructor=Class,Class.Interface=_assign({},Super.Interface,Interface),Class.augmentClass=Super.augmentClass,PooledClass.addPoolingTo(Class,PooledClass.fourArgumentPooler)},PooledClass.addPoolingTo(SyntheticEvent,PooledClass.fourArgumentPooler),module.exports=SyntheticEvent}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function checkMask(value,bitmask){return(value&bitmask)===bitmask}var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),DOMPropertyInjection={MUST_USE_PROPERTY:1,HAS_BOOLEAN_VALUE:4,HAS_NUMERIC_VALUE:8,HAS_POSITIVE_NUMERIC_VALUE:24,HAS_OVERLOADED_BOOLEAN_VALUE:32,injectDOMPropertyConfig:function(domPropertyConfig){var Injection=DOMPropertyInjection,Properties=domPropertyConfig.Properties||{},DOMAttributeNamespaces=domPropertyConfig.DOMAttributeNamespaces||{},DOMAttributeNames=domPropertyConfig.DOMAttributeNames||{},DOMPropertyNames=domPropertyConfig.DOMPropertyNames||{},DOMMutationMethods=domPropertyConfig.DOMMutationMethods||{};domPropertyConfig.isCustomAttribute&&DOMProperty._isCustomAttributeFunctions.push(domPropertyConfig.isCustomAttribute);for(var propName in Properties){DOMProperty.properties.hasOwnProperty(propName)&&("production"!==process.env.NODE_ENV?invariant(!1,"injectDOMPropertyConfig(...): You're trying to inject DOM property '%s' which has already been injected. You may be accidentally injecting the same DOM property config twice, or you may be injecting two configs that have conflicting property names.",propName):_prodInvariant("48",propName));var lowerCased=propName.toLowerCase(),propConfig=Properties[propName],propertyInfo={attributeName:lowerCased,attributeNamespace:null,propertyName:propName,mutationMethod:null,mustUseProperty:checkMask(propConfig,Injection.MUST_USE_PROPERTY),hasBooleanValue:checkMask(propConfig,Injection.HAS_BOOLEAN_VALUE),hasNumericValue:checkMask(propConfig,Injection.HAS_NUMERIC_VALUE),hasPositiveNumericValue:checkMask(propConfig,Injection.HAS_POSITIVE_NUMERIC_VALUE),hasOverloadedBooleanValue:checkMask(propConfig,Injection.HAS_OVERLOADED_BOOLEAN_VALUE)};if(propertyInfo.hasBooleanValue+propertyInfo.hasNumericValue+propertyInfo.hasOverloadedBooleanValue<=1||("production"!==process.env.NODE_ENV?invariant(!1,"DOMProperty: Value can be one of boolean, overloaded boolean, or numeric value, but not a combination: %s",propName):_prodInvariant("50",propName)),"production"!==process.env.NODE_ENV&&(DOMProperty.getPossibleStandardName[lowerCased]=propName),DOMAttributeNames.hasOwnProperty(propName)){var attributeName=DOMAttributeNames[propName];propertyInfo.attributeName=attributeName,"production"!==process.env.NODE_ENV&&(DOMProperty.getPossibleStandardName[attributeName]=propName)}DOMAttributeNamespaces.hasOwnProperty(propName)&&(propertyInfo.attributeNamespace=DOMAttributeNamespaces[propName]),DOMPropertyNames.hasOwnProperty(propName)&&(propertyInfo.propertyName=DOMPropertyNames[propName]),DOMMutationMethods.hasOwnProperty(propName)&&(propertyInfo.mutationMethod=DOMMutationMethods[propName]),DOMProperty.properties[propName]=propertyInfo}}},ATTRIBUTE_NAME_START_CHAR=":A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD",DOMProperty={ID_ATTRIBUTE_NAME:"data-reactid",ROOT_ATTRIBUTE_NAME:"data-reactroot",ATTRIBUTE_NAME_START_CHAR:ATTRIBUTE_NAME_START_CHAR,ATTRIBUTE_NAME_CHAR:ATTRIBUTE_NAME_START_CHAR+"\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040",properties:{},getPossibleStandardName:"production"!==process.env.NODE_ENV?{autofocus:"autoFocus"}:null,_isCustomAttributeFunctions:[],isCustomAttribute:function(attributeName){for(var i=0;i<DOMProperty._isCustomAttributeFunctions.length;i++){if((0,DOMProperty._isCustomAttributeFunctions[i])(attributeName))return!0}return!1},injection:DOMPropertyInjection};module.exports=DOMProperty}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function hasValidRef(config){if("production"!==process.env.NODE_ENV&&hasOwnProperty.call(config,"ref")){var getter=Object.getOwnPropertyDescriptor(config,"ref").get;if(getter&&getter.isReactWarning)return!1}return void 0!==config.ref}function hasValidKey(config){if("production"!==process.env.NODE_ENV&&hasOwnProperty.call(config,"key")){var getter=Object.getOwnPropertyDescriptor(config,"key").get;if(getter&&getter.isReactWarning)return!1}return void 0!==config.key}function defineKeyPropWarningGetter(props,displayName){var warnAboutAccessingKey=function(){specialPropKeyWarningShown||(specialPropKeyWarningShown=!0,"production"!==process.env.NODE_ENV&&warning(!1,"%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://fb.me/react-special-props)",displayName))};warnAboutAccessingKey.isReactWarning=!0,Object.defineProperty(props,"key",{get:warnAboutAccessingKey,configurable:!0})}function defineRefPropWarningGetter(props,displayName){var warnAboutAccessingRef=function(){specialPropRefWarningShown||(specialPropRefWarningShown=!0,"production"!==process.env.NODE_ENV&&warning(!1,"%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://fb.me/react-special-props)",displayName))};warnAboutAccessingRef.isReactWarning=!0,Object.defineProperty(props,"ref",{get:warnAboutAccessingRef,configurable:!0})}var specialPropKeyWarningShown,specialPropRefWarningShown,_assign=__webpack_require__(35),ReactCurrentOwner=__webpack_require__(36),warning=__webpack_require__(19),canDefineProperty=__webpack_require__(37),hasOwnProperty=Object.prototype.hasOwnProperty,REACT_ELEMENT_TYPE=__webpack_require__(89),RESERVED_PROPS={key:!0,ref:!0,__self:!0,__source:!0},ReactElement=function(type,key,ref,self,source,owner,props){var element={$$typeof:REACT_ELEMENT_TYPE,type:type,key:key,ref:ref,props:props,_owner:owner};return"production"!==process.env.NODE_ENV&&(element._store={},canDefineProperty?(Object.defineProperty(element._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(element,"_self",{configurable:!1,enumerable:!1,writable:!1,value:self}),Object.defineProperty(element,"_source",{configurable:!1,enumerable:!1,writable:!1,value:source})):(element._store.validated=!1,element._self=self,element._source=source),Object.freeze&&(Object.freeze(element.props),Object.freeze(element))),element};ReactElement.createElement=function(type,config,children){var propName,props={},key=null,ref=null,self=null,source=null;if(null!=config){hasValidRef(config)&&(ref=config.ref),hasValidKey(config)&&(key=""+config.key),self=void 0===config.__self?null:config.__self,source=void 0===config.__source?null:config.__source;for(propName in config)hasOwnProperty.call(config,propName)&&!RESERVED_PROPS.hasOwnProperty(propName)&&(props[propName]=config[propName])}var childrenLength=arguments.length-2;if(1===childrenLength)props.children=children;else if(childrenLength>1){for(var childArray=Array(childrenLength),i=0;i<childrenLength;i++)childArray[i]=arguments[i+2];"production"!==process.env.NODE_ENV&&Object.freeze&&Object.freeze(childArray),props.children=childArray}if(type&&type.defaultProps){var defaultProps=type.defaultProps;for(propName in defaultProps)void 0===props[propName]&&(props[propName]=defaultProps[propName])}if("production"!==process.env.NODE_ENV&&(key||ref)&&(void 0===props.$$typeof||props.$$typeof!==REACT_ELEMENT_TYPE)){var displayName="function"==typeof type?type.displayName||type.name||"Unknown":type;key&&defineKeyPropWarningGetter(props,displayName),ref&&defineRefPropWarningGetter(props,displayName)}return ReactElement(type,key,ref,self,source,ReactCurrentOwner.current,props)},ReactElement.createFactory=function(type){var factory=ReactElement.createElement.bind(null,type);return factory.type=type,factory},ReactElement.cloneAndReplaceKey=function(oldElement,newKey){return ReactElement(oldElement.type,newKey,oldElement.ref,oldElement._self,oldElement._source,oldElement._owner,oldElement.props)},ReactElement.cloneElement=function(element,config,children){var propName,props=_assign({},element.props),key=element.key,ref=element.ref,self=element._self,source=element._source,owner=element._owner;if(null!=config){hasValidRef(config)&&(ref=config.ref,owner=ReactCurrentOwner.current),hasValidKey(config)&&(key=""+config.key);var defaultProps;element.type&&element.type.defaultProps&&(defaultProps=element.type.defaultProps);for(propName in config)hasOwnProperty.call(config,propName)&&!RESERVED_PROPS.hasOwnProperty(propName)&&(void 0===config[propName]&&void 0!==defaultProps?props[propName]=defaultProps[propName]:props[propName]=config[propName])}var childrenLength=arguments.length-2;if(1===childrenLength)props.children=children;else if(childrenLength>1){for(var childArray=Array(childrenLength),i=0;i<childrenLength;i++)childArray[i]=arguments[i+2];props.children=childArray}return ReactElement(element.type,key,ref,self,source,owner,props)},ReactElement.isValidElement=function(object){return"object"==typeof object&&null!==object&&object.$$typeof===REACT_ELEMENT_TYPE},module.exports=ReactElement}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),oneArgumentPooler=function(copyFieldsFrom){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,copyFieldsFrom),instance}return new Klass(copyFieldsFrom)},twoArgumentPooler=function(a1,a2){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2),instance}return new Klass(a1,a2)},threeArgumentPooler=function(a1,a2,a3){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2,a3),instance}return new Klass(a1,a2,a3)},fourArgumentPooler=function(a1,a2,a3,a4){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2,a3,a4),instance}return new Klass(a1,a2,a3,a4)},standardReleaser=function(instance){var Klass=this;instance instanceof Klass||("production"!==process.env.NODE_ENV?invariant(!1,"Trying to release an instance into a pool of a different type."):_prodInvariant("25")),instance.destructor(),Klass.instancePool.length<Klass.poolSize&&Klass.instancePool.push(instance)},DEFAULT_POOLER=oneArgumentPooler,addPoolingTo=function(CopyConstructor,pooler){var NewKlass=CopyConstructor;return NewKlass.instancePool=[],NewKlass.getPooled=pooler||DEFAULT_POOLER,NewKlass.poolSize||(NewKlass.poolSize=10),NewKlass.release=standardReleaser,NewKlass},PooledClass={addPoolingTo:addPoolingTo,oneArgumentPooler:oneArgumentPooler,twoArgumentPooler:twoArgumentPooler,threeArgumentPooler:threeArgumentPooler,fourArgumentPooler:fourArgumentPooler};module.exports=PooledClass}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function hasValidRef(config){if("production"!==process.env.NODE_ENV&&hasOwnProperty.call(config,"ref")){var getter=Object.getOwnPropertyDescriptor(config,"ref").get;if(getter&&getter.isReactWarning)return!1}return void 0!==config.ref}function hasValidKey(config){if("production"!==process.env.NODE_ENV&&hasOwnProperty.call(config,"key")){var getter=Object.getOwnPropertyDescriptor(config,"key").get;if(getter&&getter.isReactWarning)return!1}return void 0!==config.key}function defineKeyPropWarningGetter(props,displayName){var warnAboutAccessingKey=function(){specialPropKeyWarningShown||(specialPropKeyWarningShown=!0,"production"!==process.env.NODE_ENV&&warning(!1,"%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://fb.me/react-special-props)",displayName))};warnAboutAccessingKey.isReactWarning=!0,Object.defineProperty(props,"key",{get:warnAboutAccessingKey,configurable:!0})}function defineRefPropWarningGetter(props,displayName){var warnAboutAccessingRef=function(){specialPropRefWarningShown||(specialPropRefWarningShown=!0,"production"!==process.env.NODE_ENV&&warning(!1,"%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://fb.me/react-special-props)",displayName))};warnAboutAccessingRef.isReactWarning=!0,Object.defineProperty(props,"ref",{get:warnAboutAccessingRef,configurable:!0})}var specialPropKeyWarningShown,specialPropRefWarningShown,_assign=__webpack_require__(7),ReactCurrentOwner=__webpack_require__(18),warning=__webpack_require__(2),canDefineProperty=__webpack_require__(45),hasOwnProperty=Object.prototype.hasOwnProperty,REACT_ELEMENT_TYPE=__webpack_require__(125),RESERVED_PROPS={key:!0,ref:!0,__self:!0,__source:!0},ReactElement=function(type,key,ref,self,source,owner,props){var element={$$typeof:REACT_ELEMENT_TYPE,type:type,key:key,ref:ref,props:props,_owner:owner};return"production"!==process.env.NODE_ENV&&(element._store={},canDefineProperty?(Object.defineProperty(element._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(element,"_self",{configurable:!1,enumerable:!1,writable:!1,value:self}),Object.defineProperty(element,"_source",{configurable:!1,enumerable:!1,writable:!1,value:source})):(element._store.validated=!1,element._self=self,element._source=source),Object.freeze&&(Object.freeze(element.props),Object.freeze(element))),element};ReactElement.createElement=function(type,config,children){var propName,props={},key=null,ref=null,self=null,source=null;if(null!=config){hasValidRef(config)&&(ref=config.ref),hasValidKey(config)&&(key=""+config.key),self=void 0===config.__self?null:config.__self,source=void 0===config.__source?null:config.__source;for(propName in config)hasOwnProperty.call(config,propName)&&!RESERVED_PROPS.hasOwnProperty(propName)&&(props[propName]=config[propName])}var childrenLength=arguments.length-2;if(1===childrenLength)props.children=children;else if(childrenLength>1){for(var childArray=Array(childrenLength),i=0;i<childrenLength;i++)childArray[i]=arguments[i+2];"production"!==process.env.NODE_ENV&&Object.freeze&&Object.freeze(childArray),props.children=childArray}if(type&&type.defaultProps){var defaultProps=type.defaultProps;for(propName in defaultProps)void 0===props[propName]&&(props[propName]=defaultProps[propName])}if("production"!==process.env.NODE_ENV&&(key||ref)&&(void 0===props.$$typeof||props.$$typeof!==REACT_ELEMENT_TYPE)){var displayName="function"==typeof type?type.displayName||type.name||"Unknown":type;key&&defineKeyPropWarningGetter(props,displayName),ref&&defineRefPropWarningGetter(props,displayName)}return ReactElement(type,key,ref,self,source,ReactCurrentOwner.current,props)},ReactElement.createFactory=function(type){var factory=ReactElement.createElement.bind(null,type);return factory.type=type,factory},ReactElement.cloneAndReplaceKey=function(oldElement,newKey){return ReactElement(oldElement.type,newKey,oldElement.ref,oldElement._self,oldElement._source,oldElement._owner,oldElement.props)},ReactElement.cloneElement=function(element,config,children){var propName,props=_assign({},element.props),key=element.key,ref=element.ref,self=element._self,source=element._source,owner=element._owner;if(null!=config){hasValidRef(config)&&(ref=config.ref,owner=ReactCurrentOwner.current),hasValidKey(config)&&(key=""+config.key);var defaultProps;element.type&&element.type.defaultProps&&(defaultProps=element.type.defaultProps);for(propName in config)hasOwnProperty.call(config,propName)&&!RESERVED_PROPS.hasOwnProperty(propName)&&(void 0===config[propName]&&void 0!==defaultProps?props[propName]=defaultProps[propName]:props[propName]=config[propName])}var childrenLength=arguments.length-2;if(1===childrenLength)props.children=children;else if(childrenLength>1){for(var childArray=Array(childrenLength),i=0;i<childrenLength;i++)childArray[i]=arguments[i+2];props.children=childArray}return ReactElement(element.type,key,ref,self,source,owner,props)},ReactElement.isValidElement=function(object){return"object"==typeof object&&null!==object&&object.$$typeof===REACT_ELEMENT_TYPE},module.exports=ReactElement}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function reactProdInvariant(code){for(var argCount=arguments.length-1,message="Minified React error #"+code+"; visit http://facebook.github.io/react/docs/error-decoder.html?invariant="+code,argIdx=0;argIdx<argCount;argIdx++)message+="&args[]="+encodeURIComponent(arguments[argIdx+1]);message+=" for the full message or use the non-minified dev environment for full errors and additional helpful warnings.";var error=new Error(message);throw error.name="Invariant Violation",error.framesToPop=1,error}module.exports=reactProdInvariant},function(module,exports,__webpack_require__){"use strict";function insertTreeChildren(tree){if(enableLazy){var node=tree.node,children=tree.children;if(children.length)for(var i=0;i<children.length;i++)insertTreeBefore(node,children[i],null);else null!=tree.html?setInnerHTML(node,tree.html):null!=tree.text&&setTextContent(node,tree.text)}}function replaceChildWithTree(oldNode,newTree){oldNode.parentNode.replaceChild(newTree.node,oldNode),insertTreeChildren(newTree)}function queueChild(parentTree,childTree){enableLazy?parentTree.children.push(childTree):parentTree.node.appendChild(childTree.node)}function queueHTML(tree,html){enableLazy?tree.html=html:setInnerHTML(tree.node,html)}function queueText(tree,text){enableLazy?tree.text=text:setTextContent(tree.node,text)}function toString(){return this.node.nodeName}function DOMLazyTree(node){return{node:node,children:[],html:null,text:null,toString:toString}}var DOMNamespaces=__webpack_require__(55),setInnerHTML=__webpack_require__(44),createMicrosoftUnsafeLocalFunction=__webpack_require__(62),setTextContent=__webpack_require__(122),enableLazy="undefined"!=typeof document&&"number"==typeof document.documentMode||"undefined"!=typeof navigator&&"string"==typeof navigator.userAgent&&/\bEdge\/\d/.test(navigator.userAgent),insertTreeBefore=createMicrosoftUnsafeLocalFunction(function(parentNode,tree,referenceNode){11===tree.node.nodeType||1===tree.node.nodeType&&"object"===tree.node.nodeName.toLowerCase()&&(null==tree.node.namespaceURI||tree.node.namespaceURI===DOMNamespaces.html)?(insertTreeChildren(tree),parentNode.insertBefore(tree.node,referenceNode)):(parentNode.insertBefore(tree.node,referenceNode),insertTreeChildren(tree))});DOMLazyTree.insertTreeBefore=insertTreeBefore,DOMLazyTree.replaceChildWithTree=replaceChildWithTree,DOMLazyTree.queueChild=queueChild,DOMLazyTree.queueHTML=queueHTML,DOMLazyTree.queueText=queueText,module.exports=DOMLazyTree},function(module,exports,__webpack_require__){"use strict";(function(process){function attachRefs(){ReactRef.attachRefs(this,this._currentElement)}var ReactRef=__webpack_require__(269),ReactInstrumentation=__webpack_require__(14),warning=__webpack_require__(2),ReactReconciler={mountComponent:function(internalInstance,transaction,hostParent,hostContainerInfo,context,parentDebugID){"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onBeforeMountComponent(internalInstance._debugID,internalInstance._currentElement,parentDebugID);var markup=internalInstance.mountComponent(transaction,hostParent,hostContainerInfo,context,parentDebugID);return internalInstance._currentElement&&null!=internalInstance._currentElement.ref&&transaction.getReactMountReady().enqueue(attachRefs,internalInstance),"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onMountComponent(internalInstance._debugID),markup},getHostNode:function(internalInstance){return internalInstance.getHostNode()},unmountComponent:function(internalInstance,safely){"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onBeforeUnmountComponent(internalInstance._debugID),ReactRef.detachRefs(internalInstance,internalInstance._currentElement),internalInstance.unmountComponent(safely),"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onUnmountComponent(internalInstance._debugID)},receiveComponent:function(internalInstance,nextElement,transaction,context){var prevElement=internalInstance._currentElement;if(nextElement!==prevElement||context!==internalInstance._context){"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onBeforeUpdateComponent(internalInstance._debugID,nextElement);var refsChanged=ReactRef.shouldUpdateRefs(prevElement,nextElement);refsChanged&&ReactRef.detachRefs(internalInstance,prevElement),internalInstance.receiveComponent(nextElement,transaction,context),refsChanged&&internalInstance._currentElement&&null!=internalInstance._currentElement.ref&&transaction.getReactMountReady().enqueue(attachRefs,internalInstance),"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onUpdateComponent(internalInstance._debugID)}},performUpdateIfNecessary:function(internalInstance,transaction,updateBatchNumber){if(internalInstance._updateBatchNumber!==updateBatchNumber)return void("production"!==process.env.NODE_ENV&&warning(null==internalInstance._updateBatchNumber||internalInstance._updateBatchNumber===updateBatchNumber+1,"performUpdateIfNecessary: Unexpected batch number (current %s, pending %s)",updateBatchNumber,internalInstance._updateBatchNumber));"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onBeforeUpdateComponent(internalInstance._debugID,internalInstance._currentElement),internalInstance.performUpdateIfNecessary(transaction),"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onUpdateComponent(internalInstance._debugID)}};module.exports=ReactReconciler}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var _assign=__webpack_require__(7),ReactBaseClasses=__webpack_require__(124),ReactChildren=__webpack_require__(300),ReactDOMFactories=__webpack_require__(301),ReactElement=__webpack_require__(24),ReactPropTypes=__webpack_require__(303),ReactVersion=__webpack_require__(305),createReactClass=__webpack_require__(307),onlyChild=__webpack_require__(309),createElement=ReactElement.createElement,createFactory=ReactElement.createFactory,cloneElement=ReactElement.cloneElement;if("production"!==process.env.NODE_ENV){var lowPriorityWarning=__webpack_require__(69),canDefineProperty=__webpack_require__(45),ReactElementValidator=__webpack_require__(126),didWarnPropTypesDeprecated=!1;createElement=ReactElementValidator.createElement,createFactory=ReactElementValidator.createFactory,cloneElement=ReactElementValidator.cloneElement}var __spread=_assign,createMixin=function(mixin){return mixin};if("production"!==process.env.NODE_ENV){var warnedForSpread=!1,warnedForCreateMixin=!1;__spread=function(){return lowPriorityWarning(warnedForSpread,"React.__spread is deprecated and should not be used. Use Object.assign directly or another helper function with similar semantics. You may be seeing this warning due to your compiler. See https://fb.me/react-spread-deprecation for more details."),warnedForSpread=!0,_assign.apply(null,arguments)},createMixin=function(mixin){return lowPriorityWarning(warnedForCreateMixin,"React.createMixin is deprecated and should not be used. In React v16.0, it will be removed. You can use this mixin directly instead. See https://fb.me/createmixin-was-never-implemented for more info."),warnedForCreateMixin=!0,mixin}}var React={Children:{map:ReactChildren.map,forEach:ReactChildren.forEach,count:ReactChildren.count,toArray:ReactChildren.toArray,only:onlyChild},Component:ReactBaseClasses.Component,PureComponent:ReactBaseClasses.PureComponent,createElement:createElement,cloneElement:cloneElement,isValidElement:ReactElement.isValidElement,PropTypes:ReactPropTypes,createClass:createReactClass,createFactory:createFactory,createMixin:createMixin,DOM:ReactDOMFactories,version:ReactVersion,__spread:__spread};if("production"!==process.env.NODE_ENV){var warnedForCreateClass=!1;canDefineProperty&&(Object.defineProperty(React,"PropTypes",{get:function(){return lowPriorityWarning(didWarnPropTypesDeprecated,"Accessing PropTypes via the main React package is deprecated, and will be removed in  React v16.0. Use the latest available v15.* prop-types package from npm instead. For info on usage, compatibility, migration and more, see https://fb.me/prop-types-docs"),didWarnPropTypesDeprecated=!0,ReactPropTypes}}),Object.defineProperty(React,"createClass",{get:function(){return lowPriorityWarning(warnedForCreateClass,"Accessing createClass via the main React package is deprecated, and will be removed in React v16.0. Use a plain JavaScript class instead. If you're not yet ready to migrate, create-react-class v15.* is available on npm as a temporary, drop-in replacement. For more info see https://fb.me/react-create-class"),warnedForCreateClass=!0,createReactClass}})),React.DOM={};var warnedForFactories=!1;Object.keys(ReactDOMFactories).forEach(function(factory){React.DOM[factory]=function(){return warnedForFactories||(lowPriorityWarning(!1,"Accessing factories like React.DOM.%s has been deprecated and will be removed in v16.0+. Use the react-dom-factories package instead.  Version 1.0 provides a drop-in replacement. For more info, see https://fb.me/react-dom-factories",factory),warnedForFactories=!0),ReactDOMFactories[factory].apply(ReactDOMFactories,arguments)}})}module.exports=React}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function reactProdInvariant(code){for(var argCount=arguments.length-1,message="Minified React error #"+code+"; visit http://facebook.github.io/react/docs/error-decoder.html?invariant="+code,argIdx=0;argIdx<argCount;argIdx++)message+="&args[]="+encodeURIComponent(arguments[argIdx+1]);message+=" for the full message or use the non-minified dev environment for full errors and additional helpful warnings.";var error=new Error(message);throw error.name="Invariant Violation",error.framesToPop=1,error}module.exports=reactProdInvariant},function(module,exports,__webpack_require__){"use strict";(function(process){function isInteractive(tag){return"button"===tag||"input"===tag||"select"===tag||"textarea"===tag}function shouldPreventMouseEvent(name,type,props){switch(name){case"onClick":case"onClickCapture":case"onDoubleClick":case"onDoubleClickCapture":case"onMouseDown":case"onMouseDownCapture":case"onMouseMove":case"onMouseMoveCapture":case"onMouseUp":case"onMouseUpCapture":return!(!props.disabled||!isInteractive(type));default:return!1}}var _prodInvariant=__webpack_require__(4),EventPluginRegistry=__webpack_require__(39),EventPluginUtils=__webpack_require__(56),ReactErrorUtils=__webpack_require__(60),accumulateInto=__webpack_require__(115),forEachAccumulated=__webpack_require__(116),invariant=__webpack_require__(1),listenerBank={},eventQueue=null,executeDispatchesAndRelease=function(event,simulated){event&&(EventPluginUtils.executeDispatchesInOrder(event,simulated),event.isPersistent()||event.constructor.release(event))},executeDispatchesAndReleaseSimulated=function(e){return executeDispatchesAndRelease(e,!0)},executeDispatchesAndReleaseTopLevel=function(e){return executeDispatchesAndRelease(e,!1)},getDictionaryKey=function(inst){return"."+inst._rootNodeID},EventPluginHub={injection:{injectEventPluginOrder:EventPluginRegistry.injectEventPluginOrder,injectEventPluginsByName:EventPluginRegistry.injectEventPluginsByName},putListener:function(inst,registrationName,listener){"function"!=typeof listener&&("production"!==process.env.NODE_ENV?invariant(!1,"Expected %s listener to be a function, instead got type %s",registrationName,typeof listener):_prodInvariant("94",registrationName,typeof listener));var key=getDictionaryKey(inst);(listenerBank[registrationName]||(listenerBank[registrationName]={}))[key]=listener;var PluginModule=EventPluginRegistry.registrationNameModules[registrationName];PluginModule&&PluginModule.didPutListener&&PluginModule.didPutListener(inst,registrationName,listener)},getListener:function(inst,registrationName){var bankForRegistrationName=listenerBank[registrationName];if(shouldPreventMouseEvent(registrationName,inst._currentElement.type,inst._currentElement.props))return null;var key=getDictionaryKey(inst);return bankForRegistrationName&&bankForRegistrationName[key]},deleteListener:function(inst,registrationName){var PluginModule=EventPluginRegistry.registrationNameModules[registrationName];PluginModule&&PluginModule.willDeleteListener&&PluginModule.willDeleteListener(inst,registrationName);var bankForRegistrationName=listenerBank[registrationName];if(bankForRegistrationName){delete bankForRegistrationName[getDictionaryKey(inst)]}},deleteAllListeners:function(inst){var key=getDictionaryKey(inst);for(var registrationName in listenerBank)if(listenerBank.hasOwnProperty(registrationName)&&listenerBank[registrationName][key]){var PluginModule=EventPluginRegistry.registrationNameModules[registrationName];PluginModule&&PluginModule.willDeleteListener&&PluginModule.willDeleteListener(inst,registrationName),delete listenerBank[registrationName][key]}},extractEvents:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){for(var events,plugins=EventPluginRegistry.plugins,i=0;i<plugins.length;i++){var possiblePlugin=plugins[i];if(possiblePlugin){var extractedEvents=possiblePlugin.extractEvents(topLevelType,targetInst,nativeEvent,nativeEventTarget);extractedEvents&&(events=accumulateInto(events,extractedEvents))}}return events},enqueueEvents:function(events){events&&(eventQueue=accumulateInto(eventQueue,events))},processEventQueue:function(simulated){var processingEventQueue=eventQueue;eventQueue=null,simulated?forEachAccumulated(processingEventQueue,executeDispatchesAndReleaseSimulated):forEachAccumulated(processingEventQueue,executeDispatchesAndReleaseTopLevel),eventQueue&&("production"!==process.env.NODE_ENV?invariant(!1,"processEventQueue(): Additional events were enqueued while processing an event queue. Support for this has not yet been implemented."):_prodInvariant("95")),ReactErrorUtils.rethrowCaughtError()},__purge:function(){listenerBank={}},__getListenerBank:function(){return listenerBank}};module.exports=EventPluginHub}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function listenerAtPhase(inst,event,propagationPhase){var registrationName=event.dispatchConfig.phasedRegistrationNames[propagationPhase];return getListener(inst,registrationName)}function accumulateDirectionalDispatches(inst,phase,event){"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(inst,"Dispatching inst must not be null");var listener=listenerAtPhase(inst,event,phase);listener&&(event._dispatchListeners=accumulateInto(event._dispatchListeners,listener),event._dispatchInstances=accumulateInto(event._dispatchInstances,inst))}function accumulateTwoPhaseDispatchesSingle(event){event&&event.dispatchConfig.phasedRegistrationNames&&EventPluginUtils.traverseTwoPhase(event._targetInst,accumulateDirectionalDispatches,event)}function accumulateTwoPhaseDispatchesSingleSkipTarget(event){if(event&&event.dispatchConfig.phasedRegistrationNames){var targetInst=event._targetInst,parentInst=targetInst?EventPluginUtils.getParentInstance(targetInst):null;EventPluginUtils.traverseTwoPhase(parentInst,accumulateDirectionalDispatches,event)}}function accumulateDispatches(inst,ignoredDirection,event){if(event&&event.dispatchConfig.registrationName){var registrationName=event.dispatchConfig.registrationName,listener=getListener(inst,registrationName);listener&&(event._dispatchListeners=accumulateInto(event._dispatchListeners,listener),event._dispatchInstances=accumulateInto(event._dispatchInstances,inst))}}function accumulateDirectDispatchesSingle(event){event&&event.dispatchConfig.registrationName&&accumulateDispatches(event._targetInst,null,event)}function accumulateTwoPhaseDispatches(events){forEachAccumulated(events,accumulateTwoPhaseDispatchesSingle)}function accumulateTwoPhaseDispatchesSkipTarget(events){forEachAccumulated(events,accumulateTwoPhaseDispatchesSingleSkipTarget)}function accumulateEnterLeaveDispatches(leave,enter,from,to){EventPluginUtils.traverseEnterLeave(from,to,accumulateDispatches,leave,enter)}function accumulateDirectDispatches(events){forEachAccumulated(events,accumulateDirectDispatchesSingle)}var EventPluginHub=__webpack_require__(30),EventPluginUtils=__webpack_require__(56),accumulateInto=__webpack_require__(115),forEachAccumulated=__webpack_require__(116),warning=__webpack_require__(2),getListener=EventPluginHub.getListener,EventPropagators={accumulateTwoPhaseDispatches:accumulateTwoPhaseDispatches,accumulateTwoPhaseDispatchesSkipTarget:accumulateTwoPhaseDispatchesSkipTarget,accumulateDirectDispatches:accumulateDirectDispatches,accumulateEnterLeaveDispatches:accumulateEnterLeaveDispatches};module.exports=EventPropagators}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var ReactInstanceMap={remove:function(key){key._reactInternalInstance=void 0},get:function(key){return key._reactInternalInstance},has:function(key){return void 0!==key._reactInternalInstance},set:function(key,value){key._reactInternalInstance=value}};module.exports=ReactInstanceMap},function(module,exports,__webpack_require__){"use strict";function SyntheticUIEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticEvent=__webpack_require__(20),getEventTarget=__webpack_require__(65),UIEventInterface={view:function(event){if(event.view)return event.view;var target=getEventTarget(event);if(target.window===target)return target;var doc=target.ownerDocument;return doc?doc.defaultView||doc.parentWindow:window},detail:function(event){return event.detail||0}};SyntheticEvent.augmentClass(SyntheticUIEvent,UIEventInterface),module.exports=SyntheticUIEvent},function(module,exports,__webpack_require__){"use strict";function makeEmptyFunction(arg){return function(){return arg}}var emptyFunction=function(){};emptyFunction.thatReturns=makeEmptyFunction,emptyFunction.thatReturnsFalse=makeEmptyFunction(!1),emptyFunction.thatReturnsTrue=makeEmptyFunction(!0),emptyFunction.thatReturnsNull=makeEmptyFunction(null),emptyFunction.thatReturnsThis=function(){return this},emptyFunction.thatReturnsArgument=function(arg){return arg},module.exports=emptyFunction},function(module,exports,__webpack_require__){"use strict";function toObject(val){if(null===val||void 0===val)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(val)}/*
+var getOwnPropertySymbols=Object.getOwnPropertySymbols,hasOwnProperty=Object.prototype.hasOwnProperty,propIsEnumerable=Object.prototype.propertyIsEnumerable;module.exports=function(){try{if(!Object.assign)return!1;var test1=new String("abc");if(test1[5]="de","5"===Object.getOwnPropertyNames(test1)[0])return!1;for(var test2={},i=0;i<10;i++)test2["_"+String.fromCharCode(i)]=i;if("0123456789"!==Object.getOwnPropertyNames(test2).map(function(n){return test2[n]}).join(""))return!1;var test3={};return"abcdefghijklmnopqrst".split("").forEach(function(letter){test3[letter]=letter}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},test3)).join("")}catch(err){return!1}}()?Object.assign:function(target,source){for(var from,symbols,to=toObject(target),s=1;s<arguments.length;s++){from=Object(arguments[s]);for(var key in from)hasOwnProperty.call(from,key)&&(to[key]=from[key]);if(getOwnPropertySymbols){symbols=getOwnPropertySymbols(from);for(var i=0;i<symbols.length;i++)propIsEnumerable.call(from,symbols[i])&&(to[symbols[i]]=from[symbols[i]])}}return to}},function(module,exports,__webpack_require__){"use strict";(function(process){function shouldPrecacheNode(node,nodeID){return 1===node.nodeType&&node.getAttribute(ATTR_NAME)===String(nodeID)||8===node.nodeType&&node.nodeValue===" react-text: "+nodeID+" "||8===node.nodeType&&node.nodeValue===" react-empty: "+nodeID+" "}function getRenderedHostOrTextFromComponent(component){for(var rendered;rendered=component._renderedComponent;)component=rendered;return component}function precacheNode(inst,node){var hostInst=getRenderedHostOrTextFromComponent(inst);hostInst._hostNode=node,node[internalInstanceKey]=hostInst}function uncacheNode(inst){var node=inst._hostNode;node&&(delete node[internalInstanceKey],inst._hostNode=null)}function precacheChildNodes(inst,node){if(!(inst._flags&Flags.hasCachedChildNodes)){var children=inst._renderedChildren,childNode=node.firstChild;outer:for(var name in children)if(children.hasOwnProperty(name)){var childInst=children[name],childID=getRenderedHostOrTextFromComponent(childInst)._domID;if(0!==childID){for(;null!==childNode;childNode=childNode.nextSibling)if(shouldPrecacheNode(childNode,childID)){precacheNode(childInst,childNode);continue outer}"production"!==process.env.NODE_ENV?invariant(!1,"Unable to find element with ID %s.",childID):_prodInvariant("32",childID)}}inst._flags|=Flags.hasCachedChildNodes}}function getClosestInstanceFromNode(node){if(node[internalInstanceKey])return node[internalInstanceKey];for(var parents=[];!node[internalInstanceKey];){if(parents.push(node),!node.parentNode)return null;node=node.parentNode}for(var closest,inst;node&&(inst=node[internalInstanceKey]);node=parents.pop())closest=inst,parents.length&&precacheChildNodes(inst,node);return closest}function getInstanceFromNode(node){var inst=getClosestInstanceFromNode(node);return null!=inst&&inst._hostNode===node?inst:null}function getNodeFromInstance(inst){if(void 0===inst._hostNode&&("production"!==process.env.NODE_ENV?invariant(!1,"getNodeFromInstance: Invalid argument."):_prodInvariant("33")),inst._hostNode)return inst._hostNode;for(var parents=[];!inst._hostNode;)parents.push(inst),inst._hostParent||("production"!==process.env.NODE_ENV?invariant(!1,"React DOM tree root should always have a node reference."):_prodInvariant("34")),inst=inst._hostParent;for(;parents.length;inst=parents.pop())precacheChildNodes(inst,inst._hostNode);return inst._hostNode}var _prodInvariant=__webpack_require__(4),DOMProperty=__webpack_require__(21),ReactDOMComponentFlags=__webpack_require__(105),invariant=__webpack_require__(1),ATTR_NAME=DOMProperty.ID_ATTRIBUTE_NAME,Flags=ReactDOMComponentFlags,internalInstanceKey="__reactInternalInstance$"+Math.random().toString(36).slice(2),ReactDOMComponentTree={getClosestInstanceFromNode:getClosestInstanceFromNode,getInstanceFromNode:getInstanceFromNode,getNodeFromInstance:getNodeFromInstance,precacheChildNodes:precacheChildNodes,precacheNode:precacheNode,uncacheNode:uncacheNode};module.exports=ReactDOMComponentTree}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var canUseDOM=!("undefined"==typeof window||!window.document||!window.document.createElement),ExecutionEnvironment={canUseDOM:canUseDOM,canUseWorkers:"undefined"!=typeof Worker,canUseEventListeners:canUseDOM&&!(!window.addEventListener&&!window.attachEvent),canUseViewport:canUseDOM&&!!window.screen,isInWorker:!canUseDOM};module.exports=ExecutionEnvironment},function(module,exports,__webpack_require__){"use strict";module.exports=__webpack_require__(28)},function(module,exports,__webpack_require__){"use strict";(function(process){function isNative(fn){var funcToString=Function.prototype.toString,hasOwnProperty=Object.prototype.hasOwnProperty,reIsNative=RegExp("^"+funcToString.call(hasOwnProperty).replace(/[\\^$.*+?()[\]{}|]/g,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$");try{var source=funcToString.call(fn);return reIsNative.test(source)}catch(err){return!1}}function purgeDeep(id){var item=getItem(id);if(item){var childIDs=item.childIDs;removeItem(id),childIDs.forEach(purgeDeep)}}function describeComponentFrame(name,source,ownerName){return"\n    in "+(name||"Unknown")+(source?" (at "+source.fileName.replace(/^.*[\\\/]/,"")+":"+source.lineNumber+")":ownerName?" (created by "+ownerName+")":"")}function getDisplayName(element){return null==element?"#empty":"string"==typeof element||"number"==typeof element?"#text":"string"==typeof element.type?element.type:element.type.displayName||element.type.name||"Unknown"}function describeID(id){var ownerName,name=ReactComponentTreeHook.getDisplayName(id),element=ReactComponentTreeHook.getElement(id),ownerID=ReactComponentTreeHook.getOwnerID(id);return ownerID&&(ownerName=ReactComponentTreeHook.getDisplayName(ownerID)),"production"!==process.env.NODE_ENV&&warning(element,"ReactComponentTreeHook: Missing React element for debugID %s when building stack",id),describeComponentFrame(name,element&&element._source,ownerName)}var setItem,getItem,removeItem,getItemIDs,addRoot,removeRoot,getRootIDs,_prodInvariant=__webpack_require__(29),ReactCurrentOwner=__webpack_require__(18),invariant=__webpack_require__(1),warning=__webpack_require__(2),canUseCollections="function"==typeof Array.from&&"function"==typeof Map&&isNative(Map)&&null!=Map.prototype&&"function"==typeof Map.prototype.keys&&isNative(Map.prototype.keys)&&"function"==typeof Set&&isNative(Set)&&null!=Set.prototype&&"function"==typeof Set.prototype.keys&&isNative(Set.prototype.keys);if(canUseCollections){var itemMap=new Map,rootIDSet=new Set;setItem=function(id,item){itemMap.set(id,item)},getItem=function(id){return itemMap.get(id)},removeItem=function(id){itemMap.delete(id)},getItemIDs=function(){return Array.from(itemMap.keys())},addRoot=function(id){rootIDSet.add(id)},removeRoot=function(id){rootIDSet.delete(id)},getRootIDs=function(){return Array.from(rootIDSet.keys())}}else{var itemByKey={},rootByKey={},getKeyFromID=function(id){return"."+id},getIDFromKey=function(key){return parseInt(key.substr(1),10)};setItem=function(id,item){var key=getKeyFromID(id);itemByKey[key]=item},getItem=function(id){var key=getKeyFromID(id);return itemByKey[key]},removeItem=function(id){var key=getKeyFromID(id);delete itemByKey[key]},getItemIDs=function(){return Object.keys(itemByKey).map(getIDFromKey)},addRoot=function(id){var key=getKeyFromID(id);rootByKey[key]=!0},removeRoot=function(id){var key=getKeyFromID(id);delete rootByKey[key]},getRootIDs=function(){return Object.keys(rootByKey).map(getIDFromKey)}}var unmountedIDs=[],ReactComponentTreeHook={onSetChildren:function(id,nextChildIDs){var item=getItem(id);item||("production"!==process.env.NODE_ENV?invariant(!1,"Item must have been set"):_prodInvariant("144")),item.childIDs=nextChildIDs;for(var i=0;i<nextChildIDs.length;i++){var nextChildID=nextChildIDs[i],nextChild=getItem(nextChildID);nextChild||("production"!==process.env.NODE_ENV?invariant(!1,"Expected hook events to fire for the child before its parent includes it in onSetChildren()."):_prodInvariant("140")),null==nextChild.childIDs&&"object"==typeof nextChild.element&&null!=nextChild.element&&("production"!==process.env.NODE_ENV?invariant(!1,"Expected onSetChildren() to fire for a container child before its parent includes it in onSetChildren()."):_prodInvariant("141")),nextChild.isMounted||("production"!==process.env.NODE_ENV?invariant(!1,"Expected onMountComponent() to fire for the child before its parent includes it in onSetChildren()."):_prodInvariant("71")),null==nextChild.parentID&&(nextChild.parentID=id),nextChild.parentID!==id&&("production"!==process.env.NODE_ENV?invariant(!1,"Expected onBeforeMountComponent() parent and onSetChildren() to be consistent (%s has parents %s and %s).",nextChildID,nextChild.parentID,id):_prodInvariant("142",nextChildID,nextChild.parentID,id))}},onBeforeMountComponent:function(id,element,parentID){setItem(id,{element:element,parentID:parentID,text:null,childIDs:[],isMounted:!1,updateCount:0})},onBeforeUpdateComponent:function(id,element){var item=getItem(id);item&&item.isMounted&&(item.element=element)},onMountComponent:function(id){var item=getItem(id);item||("production"!==process.env.NODE_ENV?invariant(!1,"Item must have been set"):_prodInvariant("144")),item.isMounted=!0,0===item.parentID&&addRoot(id)},onUpdateComponent:function(id){var item=getItem(id);item&&item.isMounted&&item.updateCount++},onUnmountComponent:function(id){var item=getItem(id);if(item){item.isMounted=!1;0===item.parentID&&removeRoot(id)}unmountedIDs.push(id)},purgeUnmountedComponents:function(){if(!ReactComponentTreeHook._preventPurging){for(var i=0;i<unmountedIDs.length;i++){purgeDeep(unmountedIDs[i])}unmountedIDs.length=0}},isMounted:function(id){var item=getItem(id);return!!item&&item.isMounted},getCurrentStackAddendum:function(topElement){var info="";if(topElement){var name=getDisplayName(topElement),owner=topElement._owner;info+=describeComponentFrame(name,topElement._source,owner&&owner.getName())}var currentOwner=ReactCurrentOwner.current,id=currentOwner&&currentOwner._debugID;return info+=ReactComponentTreeHook.getStackAddendumByID(id)},getStackAddendumByID:function(id){for(var info="";id;)info+=describeID(id),id=ReactComponentTreeHook.getParentID(id);return info},getChildIDs:function(id){var item=getItem(id);return item?item.childIDs:[]},getDisplayName:function(id){var element=ReactComponentTreeHook.getElement(id);return element?getDisplayName(element):null},getElement:function(id){var item=getItem(id);return item?item.element:null},getOwnerID:function(id){var element=ReactComponentTreeHook.getElement(id);return element&&element._owner?element._owner._debugID:null},getParentID:function(id){var item=getItem(id);return item?item.parentID:null},getSource:function(id){var item=getItem(id),element=item?item.element:null;return null!=element?element._source:null},getText:function(id){var element=ReactComponentTreeHook.getElement(id);return"string"==typeof element?element:"number"==typeof element?""+element:null},getUpdateCount:function(id){var item=getItem(id);return item?item.updateCount:0},getRootIDs:getRootIDs,getRegisteredIDs:getItemIDs,pushNonStandardWarningStack:function(isCreatingElement,currentSource){if("function"==typeof console.reactStack){var stack=[],currentOwner=ReactCurrentOwner.current,id=currentOwner&&currentOwner._debugID;try{for(isCreatingElement&&stack.push({name:id?ReactComponentTreeHook.getDisplayName(id):null,fileName:currentSource?currentSource.fileName:null,lineNumber:currentSource?currentSource.lineNumber:null});id;){var element=ReactComponentTreeHook.getElement(id),parentID=ReactComponentTreeHook.getParentID(id),ownerID=ReactComponentTreeHook.getOwnerID(id),ownerName=ownerID?ReactComponentTreeHook.getDisplayName(ownerID):null,source=element&&element._source;stack.push({name:ownerName,fileName:source?source.fileName:null,lineNumber:source?source.lineNumber:null}),id=parentID}}catch(err){}}},popNonStandardWarningStack:function(){console.reactStackEnd}};module.exports=ReactComponentTreeHook}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function makeEmptyFunction(arg){return function(){return arg}}var emptyFunction=function(){};emptyFunction.thatReturns=makeEmptyFunction,emptyFunction.thatReturnsFalse=makeEmptyFunction(!1),emptyFunction.thatReturnsTrue=makeEmptyFunction(!0),emptyFunction.thatReturnsNull=makeEmptyFunction(null),emptyFunction.thatReturnsThis=function(){return this},emptyFunction.thatReturnsArgument=function(arg){return arg},module.exports=emptyFunction},function(module,exports,__webpack_require__){(function(process){if("production"!==process.env.NODE_ENV){var REACT_ELEMENT_TYPE="function"==typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103,isValidElement=function(object){return"object"==typeof object&&null!==object&&object.$$typeof===REACT_ELEMENT_TYPE};module.exports=__webpack_require__(101)(isValidElement,!0)}else module.exports=__webpack_require__(226)()}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var debugTool=null;if("production"!==process.env.NODE_ENV){debugTool=__webpack_require__(256)}module.exports={debugTool:debugTool}}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function invariant(condition,format,a,b,c,d,e,f){if(validateFormat(format),!condition){var error;if(void 0===format)error=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var args=[a,b,c,d,e,f],argIndex=0;error=new Error(format.replace(/%s/g,function(){return args[argIndex++]})),error.name="Invariant Violation"}throw error.framesToPop=1,error}}var validateFormat=function(format){};"production"!==process.env.NODE_ENV&&(validateFormat=function(format){if(void 0===format)throw new Error("invariant requires an error message argument")}),module.exports=invariant}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){(function(global){function baseToString(value){if("string"==typeof value)return value;if(isSymbol(value))return symbolToString?symbolToString.call(value):"";var result=value+"";return"0"==result&&1/value==-INFINITY?"-0":result}function isObjectLike(value){return!!value&&"object"==typeof value}function isSymbol(value){return"symbol"==typeof value||isObjectLike(value)&&objectToString.call(value)==symbolTag}function toString(value){return null==value?"":baseToString(value)}function uniqueId(prefix){var id=++idCounter;return toString(prefix)+id}var INFINITY=1/0,symbolTag="[object Symbol]",freeGlobal="object"==typeof global&&global&&global.Object===Object&&global,freeSelf="object"==typeof self&&self&&self.Object===Object&&self,root=freeGlobal||freeSelf||Function("return this")(),objectProto=Object.prototype,idCounter=0,objectToString=objectProto.toString,Symbol=root.Symbol,symbolProto=Symbol?Symbol.prototype:void 0,symbolToString=symbolProto?symbolProto.toString:void 0;module.exports=uniqueId}).call(exports,__webpack_require__(46))},function(module,exports,__webpack_require__){"use strict";(function(process){function ensureInjected(){ReactUpdates.ReactReconcileTransaction&&batchingStrategy||("production"!==process.env.NODE_ENV?invariant(!1,"ReactUpdates: must inject a reconcile transaction class and batching strategy"):_prodInvariant("123"))}function ReactUpdatesFlushTransaction(){this.reinitializeTransaction(),this.dirtyComponentsLength=null,this.callbackQueue=CallbackQueue.getPooled(),this.reconcileTransaction=ReactUpdates.ReactReconcileTransaction.getPooled(!0)}function batchedUpdates(callback,a,b,c,d,e){return ensureInjected(),batchingStrategy.batchedUpdates(callback,a,b,c,d,e)}function mountOrderComparator(c1,c2){return c1._mountOrder-c2._mountOrder}function runBatchedUpdates(transaction){var len=transaction.dirtyComponentsLength;len!==dirtyComponents.length&&("production"!==process.env.NODE_ENV?invariant(!1,"Expected flush transaction's stored dirty-components length (%s) to match dirty-components array length (%s).",len,dirtyComponents.length):_prodInvariant("124",len,dirtyComponents.length)),dirtyComponents.sort(mountOrderComparator),updateBatchNumber++;for(var i=0;i<len;i++){var component=dirtyComponents[i],callbacks=component._pendingCallbacks;component._pendingCallbacks=null;if(ReactFeatureFlags.logTopLevelRenders){var namedComponent=component;component._currentElement.type.isReactTopLevelWrapper&&(namedComponent=component._renderedComponent),"React update: "+namedComponent.getName()}if(ReactReconciler.performUpdateIfNecessary(component,transaction.reconcileTransaction,updateBatchNumber),callbacks)for(var j=0;j<callbacks.length;j++)transaction.callbackQueue.enqueue(callbacks[j],component.getPublicInstance())}}function enqueueUpdate(component){if(ensureInjected(),!batchingStrategy.isBatchingUpdates)return void batchingStrategy.batchedUpdates(enqueueUpdate,component);dirtyComponents.push(component),null==component._updateBatchNumber&&(component._updateBatchNumber=updateBatchNumber+1)}function asap(callback,context){batchingStrategy.isBatchingUpdates||("production"!==process.env.NODE_ENV?invariant(!1,"ReactUpdates.asap: Can't enqueue an asap callback in a context whereupdates are not being batched."):_prodInvariant("125")),asapCallbackQueue.enqueue(callback,context),asapEnqueued=!0}var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),CallbackQueue=__webpack_require__(103),PooledClass=__webpack_require__(23),ReactFeatureFlags=__webpack_require__(108),ReactReconciler=__webpack_require__(27),Transaction=__webpack_require__(42),invariant=__webpack_require__(1),dirtyComponents=[],updateBatchNumber=0,asapCallbackQueue=CallbackQueue.getPooled(),asapEnqueued=!1,batchingStrategy=null,NESTED_UPDATES={initialize:function(){this.dirtyComponentsLength=dirtyComponents.length},close:function(){this.dirtyComponentsLength!==dirtyComponents.length?(dirtyComponents.splice(0,this.dirtyComponentsLength),flushBatchedUpdates()):dirtyComponents.length=0}},UPDATE_QUEUEING={initialize:function(){this.callbackQueue.reset()},close:function(){this.callbackQueue.notifyAll()}},TRANSACTION_WRAPPERS=[NESTED_UPDATES,UPDATE_QUEUEING];_assign(ReactUpdatesFlushTransaction.prototype,Transaction,{getTransactionWrappers:function(){return TRANSACTION_WRAPPERS},destructor:function(){this.dirtyComponentsLength=null,CallbackQueue.release(this.callbackQueue),this.callbackQueue=null,ReactUpdates.ReactReconcileTransaction.release(this.reconcileTransaction),this.reconcileTransaction=null},perform:function(method,scope,a){return Transaction.perform.call(this,this.reconcileTransaction.perform,this.reconcileTransaction,method,scope,a)}}),PooledClass.addPoolingTo(ReactUpdatesFlushTransaction);var flushBatchedUpdates=function(){for(;dirtyComponents.length||asapEnqueued;){if(dirtyComponents.length){var transaction=ReactUpdatesFlushTransaction.getPooled();transaction.perform(runBatchedUpdates,null,transaction),ReactUpdatesFlushTransaction.release(transaction)}if(asapEnqueued){asapEnqueued=!1;var queue=asapCallbackQueue;asapCallbackQueue=CallbackQueue.getPooled(),queue.notifyAll(),CallbackQueue.release(queue)}}},ReactUpdatesInjection={injectReconcileTransaction:function(ReconcileTransaction){ReconcileTransaction||("production"!==process.env.NODE_ENV?invariant(!1,"ReactUpdates: must provide a reconcile transaction class"):_prodInvariant("126")),ReactUpdates.ReactReconcileTransaction=ReconcileTransaction},injectBatchingStrategy:function(_batchingStrategy){_batchingStrategy||("production"!==process.env.NODE_ENV?invariant(!1,"ReactUpdates: must provide a batching strategy"):_prodInvariant("127")),"function"!=typeof _batchingStrategy.batchedUpdates&&("production"!==process.env.NODE_ENV?invariant(!1,"ReactUpdates: must provide a batchedUpdates() function"):_prodInvariant("128")),"boolean"!=typeof _batchingStrategy.isBatchingUpdates&&("production"!==process.env.NODE_ENV?invariant(!1,"ReactUpdates: must provide an isBatchingUpdates boolean attribute"):_prodInvariant("129")),batchingStrategy=_batchingStrategy}},ReactUpdates={ReactReconcileTransaction:null,batchedUpdates:batchedUpdates,enqueueUpdate:enqueueUpdate,flushBatchedUpdates:flushBatchedUpdates,injection:ReactUpdatesInjection,asap:asap};module.exports=ReactUpdates}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var ReactCurrentOwner={current:null};module.exports=ReactCurrentOwner},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyFunction=__webpack_require__(34),warning=emptyFunction;"production"!==process.env.NODE_ENV&&function(){var printWarning=function(format){for(var _len=arguments.length,args=Array(_len>1?_len-1:0),_key=1;_key<_len;_key++)args[_key-1]=arguments[_key];var argIndex=0,message="Warning: "+format.replace(/%s/g,function(){return args[argIndex++]});try{throw new Error(message)}catch(x){}};warning=function(condition,format){if(void 0===format)throw new Error("`warning(condition, format, ...args)` requires a warning message argument");if(0!==format.indexOf("Failed Composite propType: ")&&!condition){for(var _len2=arguments.length,args=Array(_len2>2?_len2-2:0),_key2=2;_key2<_len2;_key2++)args[_key2-2]=arguments[_key2];printWarning.apply(void 0,[format].concat(args))}}}(),module.exports=warning}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function SyntheticEvent(dispatchConfig,targetInst,nativeEvent,nativeEventTarget){"production"!==process.env.NODE_ENV&&(delete this.nativeEvent,delete this.preventDefault,delete this.stopPropagation),this.dispatchConfig=dispatchConfig,this._targetInst=targetInst,this.nativeEvent=nativeEvent;var Interface=this.constructor.Interface;for(var propName in Interface)if(Interface.hasOwnProperty(propName)){"production"!==process.env.NODE_ENV&&delete this[propName];var normalize=Interface[propName];normalize?this[propName]=normalize(nativeEvent):"target"===propName?this.target=nativeEventTarget:this[propName]=nativeEvent[propName]}var defaultPrevented=null!=nativeEvent.defaultPrevented?nativeEvent.defaultPrevented:!1===nativeEvent.returnValue;return this.isDefaultPrevented=defaultPrevented?emptyFunction.thatReturnsTrue:emptyFunction.thatReturnsFalse,this.isPropagationStopped=emptyFunction.thatReturnsFalse,this}function getPooledWarningPropertyDefinition(propName,getVal){function set(val){return warn(isFunction?"setting the method":"setting the property","This is effectively a no-op"),val}function get(){return warn(isFunction?"accessing the method":"accessing the property",isFunction?"This is a no-op function":"This is set to null"),getVal}function warn(action,result){"production"!==process.env.NODE_ENV&&warning(!1,"This synthetic event is reused for performance reasons. If you're seeing this, you're %s `%s` on a released/nullified synthetic event. %s. If you must keep the original synthetic event around, use event.persist(). See https://fb.me/react-event-pooling for more information.",action,propName,result)}var isFunction="function"==typeof getVal;return{configurable:!0,set:set,get:get}}var _assign=__webpack_require__(7),PooledClass=__webpack_require__(23),emptyFunction=__webpack_require__(12),warning=__webpack_require__(2),didWarnForAddedNewProperty=!1,isProxySupported="function"==typeof Proxy,shouldBeReleasedProperties=["dispatchConfig","_targetInst","nativeEvent","isDefaultPrevented","isPropagationStopped","_dispatchListeners","_dispatchInstances"],EventInterface={type:null,target:null,currentTarget:emptyFunction.thatReturnsNull,eventPhase:null,bubbles:null,cancelable:null,timeStamp:function(event){return event.timeStamp||Date.now()},defaultPrevented:null,isTrusted:null};_assign(SyntheticEvent.prototype,{preventDefault:function(){this.defaultPrevented=!0;var event=this.nativeEvent;event&&(event.preventDefault?event.preventDefault():"unknown"!=typeof event.returnValue&&(event.returnValue=!1),this.isDefaultPrevented=emptyFunction.thatReturnsTrue)},stopPropagation:function(){var event=this.nativeEvent;event&&(event.stopPropagation?event.stopPropagation():"unknown"!=typeof event.cancelBubble&&(event.cancelBubble=!0),this.isPropagationStopped=emptyFunction.thatReturnsTrue)},persist:function(){this.isPersistent=emptyFunction.thatReturnsTrue},isPersistent:emptyFunction.thatReturnsFalse,destructor:function(){var Interface=this.constructor.Interface;for(var propName in Interface)"production"!==process.env.NODE_ENV?Object.defineProperty(this,propName,getPooledWarningPropertyDefinition(propName,Interface[propName])):this[propName]=null;for(var i=0;i<shouldBeReleasedProperties.length;i++)this[shouldBeReleasedProperties[i]]=null;"production"!==process.env.NODE_ENV&&(Object.defineProperty(this,"nativeEvent",getPooledWarningPropertyDefinition("nativeEvent",null)),Object.defineProperty(this,"preventDefault",getPooledWarningPropertyDefinition("preventDefault",emptyFunction)),Object.defineProperty(this,"stopPropagation",getPooledWarningPropertyDefinition("stopPropagation",emptyFunction)))}}),SyntheticEvent.Interface=EventInterface,"production"!==process.env.NODE_ENV&&isProxySupported&&(SyntheticEvent=new Proxy(SyntheticEvent,{construct:function(target,args){return this.apply(target,Object.create(target.prototype),args)},apply:function(constructor,that,args){return new Proxy(constructor.apply(that,args),{set:function(target,prop,value){return"isPersistent"===prop||target.constructor.Interface.hasOwnProperty(prop)||-1!==shouldBeReleasedProperties.indexOf(prop)||("production"!==process.env.NODE_ENV&&warning(didWarnForAddedNewProperty||target.isPersistent(),"This synthetic event is reused for performance reasons. If you're seeing this, you're adding a new property in the synthetic event object. The property is never released. See https://fb.me/react-event-pooling for more information."),didWarnForAddedNewProperty=!0),target[prop]=value,!0}})}})),SyntheticEvent.augmentClass=function(Class,Interface){var Super=this,E=function(){};E.prototype=Super.prototype;var prototype=new E;_assign(prototype,Class.prototype),Class.prototype=prototype,Class.prototype.constructor=Class,Class.Interface=_assign({},Super.Interface,Interface),Class.augmentClass=Super.augmentClass,PooledClass.addPoolingTo(Class,PooledClass.fourArgumentPooler)},PooledClass.addPoolingTo(SyntheticEvent,PooledClass.fourArgumentPooler),module.exports=SyntheticEvent}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function checkMask(value,bitmask){return(value&bitmask)===bitmask}var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),DOMPropertyInjection={MUST_USE_PROPERTY:1,HAS_BOOLEAN_VALUE:4,HAS_NUMERIC_VALUE:8,HAS_POSITIVE_NUMERIC_VALUE:24,HAS_OVERLOADED_BOOLEAN_VALUE:32,injectDOMPropertyConfig:function(domPropertyConfig){var Injection=DOMPropertyInjection,Properties=domPropertyConfig.Properties||{},DOMAttributeNamespaces=domPropertyConfig.DOMAttributeNamespaces||{},DOMAttributeNames=domPropertyConfig.DOMAttributeNames||{},DOMPropertyNames=domPropertyConfig.DOMPropertyNames||{},DOMMutationMethods=domPropertyConfig.DOMMutationMethods||{};domPropertyConfig.isCustomAttribute&&DOMProperty._isCustomAttributeFunctions.push(domPropertyConfig.isCustomAttribute);for(var propName in Properties){DOMProperty.properties.hasOwnProperty(propName)&&("production"!==process.env.NODE_ENV?invariant(!1,"injectDOMPropertyConfig(...): You're trying to inject DOM property '%s' which has already been injected. You may be accidentally injecting the same DOM property config twice, or you may be injecting two configs that have conflicting property names.",propName):_prodInvariant("48",propName));var lowerCased=propName.toLowerCase(),propConfig=Properties[propName],propertyInfo={attributeName:lowerCased,attributeNamespace:null,propertyName:propName,mutationMethod:null,mustUseProperty:checkMask(propConfig,Injection.MUST_USE_PROPERTY),hasBooleanValue:checkMask(propConfig,Injection.HAS_BOOLEAN_VALUE),hasNumericValue:checkMask(propConfig,Injection.HAS_NUMERIC_VALUE),hasPositiveNumericValue:checkMask(propConfig,Injection.HAS_POSITIVE_NUMERIC_VALUE),hasOverloadedBooleanValue:checkMask(propConfig,Injection.HAS_OVERLOADED_BOOLEAN_VALUE)};if(propertyInfo.hasBooleanValue+propertyInfo.hasNumericValue+propertyInfo.hasOverloadedBooleanValue<=1||("production"!==process.env.NODE_ENV?invariant(!1,"DOMProperty: Value can be one of boolean, overloaded boolean, or numeric value, but not a combination: %s",propName):_prodInvariant("50",propName)),"production"!==process.env.NODE_ENV&&(DOMProperty.getPossibleStandardName[lowerCased]=propName),DOMAttributeNames.hasOwnProperty(propName)){var attributeName=DOMAttributeNames[propName];propertyInfo.attributeName=attributeName,"production"!==process.env.NODE_ENV&&(DOMProperty.getPossibleStandardName[attributeName]=propName)}DOMAttributeNamespaces.hasOwnProperty(propName)&&(propertyInfo.attributeNamespace=DOMAttributeNamespaces[propName]),DOMPropertyNames.hasOwnProperty(propName)&&(propertyInfo.propertyName=DOMPropertyNames[propName]),DOMMutationMethods.hasOwnProperty(propName)&&(propertyInfo.mutationMethod=DOMMutationMethods[propName]),DOMProperty.properties[propName]=propertyInfo}}},ATTRIBUTE_NAME_START_CHAR=":A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD",DOMProperty={ID_ATTRIBUTE_NAME:"data-reactid",ROOT_ATTRIBUTE_NAME:"data-reactroot",ATTRIBUTE_NAME_START_CHAR:ATTRIBUTE_NAME_START_CHAR,ATTRIBUTE_NAME_CHAR:ATTRIBUTE_NAME_START_CHAR+"\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040",properties:{},getPossibleStandardName:"production"!==process.env.NODE_ENV?{autofocus:"autoFocus"}:null,_isCustomAttributeFunctions:[],isCustomAttribute:function(attributeName){for(var i=0;i<DOMProperty._isCustomAttributeFunctions.length;i++){if((0,DOMProperty._isCustomAttributeFunctions[i])(attributeName))return!0}return!1},injection:DOMPropertyInjection};module.exports=DOMProperty}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function hasValidRef(config){if("production"!==process.env.NODE_ENV&&hasOwnProperty.call(config,"ref")){var getter=Object.getOwnPropertyDescriptor(config,"ref").get;if(getter&&getter.isReactWarning)return!1}return void 0!==config.ref}function hasValidKey(config){if("production"!==process.env.NODE_ENV&&hasOwnProperty.call(config,"key")){var getter=Object.getOwnPropertyDescriptor(config,"key").get;if(getter&&getter.isReactWarning)return!1}return void 0!==config.key}function defineKeyPropWarningGetter(props,displayName){var warnAboutAccessingKey=function(){specialPropKeyWarningShown||(specialPropKeyWarningShown=!0,"production"!==process.env.NODE_ENV&&warning(!1,"%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://fb.me/react-special-props)",displayName))};warnAboutAccessingKey.isReactWarning=!0,Object.defineProperty(props,"key",{get:warnAboutAccessingKey,configurable:!0})}function defineRefPropWarningGetter(props,displayName){var warnAboutAccessingRef=function(){specialPropRefWarningShown||(specialPropRefWarningShown=!0,"production"!==process.env.NODE_ENV&&warning(!1,"%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://fb.me/react-special-props)",displayName))};warnAboutAccessingRef.isReactWarning=!0,Object.defineProperty(props,"ref",{get:warnAboutAccessingRef,configurable:!0})}var specialPropKeyWarningShown,specialPropRefWarningShown,_assign=__webpack_require__(35),ReactCurrentOwner=__webpack_require__(36),warning=__webpack_require__(19),canDefineProperty=__webpack_require__(37),hasOwnProperty=Object.prototype.hasOwnProperty,REACT_ELEMENT_TYPE=__webpack_require__(89),RESERVED_PROPS={key:!0,ref:!0,__self:!0,__source:!0},ReactElement=function(type,key,ref,self,source,owner,props){var element={$$typeof:REACT_ELEMENT_TYPE,type:type,key:key,ref:ref,props:props,_owner:owner};return"production"!==process.env.NODE_ENV&&(element._store={},canDefineProperty?(Object.defineProperty(element._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(element,"_self",{configurable:!1,enumerable:!1,writable:!1,value:self}),Object.defineProperty(element,"_source",{configurable:!1,enumerable:!1,writable:!1,value:source})):(element._store.validated=!1,element._self=self,element._source=source),Object.freeze&&(Object.freeze(element.props),Object.freeze(element))),element};ReactElement.createElement=function(type,config,children){var propName,props={},key=null,ref=null,self=null,source=null;if(null!=config){hasValidRef(config)&&(ref=config.ref),hasValidKey(config)&&(key=""+config.key),self=void 0===config.__self?null:config.__self,source=void 0===config.__source?null:config.__source;for(propName in config)hasOwnProperty.call(config,propName)&&!RESERVED_PROPS.hasOwnProperty(propName)&&(props[propName]=config[propName])}var childrenLength=arguments.length-2;if(1===childrenLength)props.children=children;else if(childrenLength>1){for(var childArray=Array(childrenLength),i=0;i<childrenLength;i++)childArray[i]=arguments[i+2];"production"!==process.env.NODE_ENV&&Object.freeze&&Object.freeze(childArray),props.children=childArray}if(type&&type.defaultProps){var defaultProps=type.defaultProps;for(propName in defaultProps)void 0===props[propName]&&(props[propName]=defaultProps[propName])}if("production"!==process.env.NODE_ENV&&(key||ref)&&(void 0===props.$$typeof||props.$$typeof!==REACT_ELEMENT_TYPE)){var displayName="function"==typeof type?type.displayName||type.name||"Unknown":type;key&&defineKeyPropWarningGetter(props,displayName),ref&&defineRefPropWarningGetter(props,displayName)}return ReactElement(type,key,ref,self,source,ReactCurrentOwner.current,props)},ReactElement.createFactory=function(type){var factory=ReactElement.createElement.bind(null,type);return factory.type=type,factory},ReactElement.cloneAndReplaceKey=function(oldElement,newKey){return ReactElement(oldElement.type,newKey,oldElement.ref,oldElement._self,oldElement._source,oldElement._owner,oldElement.props)},ReactElement.cloneElement=function(element,config,children){var propName,props=_assign({},element.props),key=element.key,ref=element.ref,self=element._self,source=element._source,owner=element._owner;if(null!=config){hasValidRef(config)&&(ref=config.ref,owner=ReactCurrentOwner.current),hasValidKey(config)&&(key=""+config.key);var defaultProps;element.type&&element.type.defaultProps&&(defaultProps=element.type.defaultProps);for(propName in config)hasOwnProperty.call(config,propName)&&!RESERVED_PROPS.hasOwnProperty(propName)&&(void 0===config[propName]&&void 0!==defaultProps?props[propName]=defaultProps[propName]:props[propName]=config[propName])}var childrenLength=arguments.length-2;if(1===childrenLength)props.children=children;else if(childrenLength>1){for(var childArray=Array(childrenLength),i=0;i<childrenLength;i++)childArray[i]=arguments[i+2];props.children=childArray}return ReactElement(element.type,key,ref,self,source,owner,props)},ReactElement.isValidElement=function(object){return"object"==typeof object&&null!==object&&object.$$typeof===REACT_ELEMENT_TYPE},module.exports=ReactElement}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),oneArgumentPooler=function(copyFieldsFrom){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,copyFieldsFrom),instance}return new Klass(copyFieldsFrom)},twoArgumentPooler=function(a1,a2){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2),instance}return new Klass(a1,a2)},threeArgumentPooler=function(a1,a2,a3){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2,a3),instance}return new Klass(a1,a2,a3)},fourArgumentPooler=function(a1,a2,a3,a4){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2,a3,a4),instance}return new Klass(a1,a2,a3,a4)},standardReleaser=function(instance){var Klass=this;instance instanceof Klass||("production"!==process.env.NODE_ENV?invariant(!1,"Trying to release an instance into a pool of a different type."):_prodInvariant("25")),instance.destructor(),Klass.instancePool.length<Klass.poolSize&&Klass.instancePool.push(instance)},DEFAULT_POOLER=oneArgumentPooler,addPoolingTo=function(CopyConstructor,pooler){var NewKlass=CopyConstructor;return NewKlass.instancePool=[],NewKlass.getPooled=pooler||DEFAULT_POOLER,NewKlass.poolSize||(NewKlass.poolSize=10),NewKlass.release=standardReleaser,NewKlass},PooledClass={addPoolingTo:addPoolingTo,oneArgumentPooler:oneArgumentPooler,twoArgumentPooler:twoArgumentPooler,threeArgumentPooler:threeArgumentPooler,fourArgumentPooler:fourArgumentPooler};module.exports=PooledClass}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function hasValidRef(config){if("production"!==process.env.NODE_ENV&&hasOwnProperty.call(config,"ref")){var getter=Object.getOwnPropertyDescriptor(config,"ref").get;if(getter&&getter.isReactWarning)return!1}return void 0!==config.ref}function hasValidKey(config){if("production"!==process.env.NODE_ENV&&hasOwnProperty.call(config,"key")){var getter=Object.getOwnPropertyDescriptor(config,"key").get;if(getter&&getter.isReactWarning)return!1}return void 0!==config.key}function defineKeyPropWarningGetter(props,displayName){var warnAboutAccessingKey=function(){specialPropKeyWarningShown||(specialPropKeyWarningShown=!0,"production"!==process.env.NODE_ENV&&warning(!1,"%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://fb.me/react-special-props)",displayName))};warnAboutAccessingKey.isReactWarning=!0,Object.defineProperty(props,"key",{get:warnAboutAccessingKey,configurable:!0})}function defineRefPropWarningGetter(props,displayName){var warnAboutAccessingRef=function(){specialPropRefWarningShown||(specialPropRefWarningShown=!0,"production"!==process.env.NODE_ENV&&warning(!1,"%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://fb.me/react-special-props)",displayName))};warnAboutAccessingRef.isReactWarning=!0,Object.defineProperty(props,"ref",{get:warnAboutAccessingRef,configurable:!0})}var specialPropKeyWarningShown,specialPropRefWarningShown,_assign=__webpack_require__(7),ReactCurrentOwner=__webpack_require__(18),warning=__webpack_require__(2),canDefineProperty=__webpack_require__(45),hasOwnProperty=Object.prototype.hasOwnProperty,REACT_ELEMENT_TYPE=__webpack_require__(125),RESERVED_PROPS={key:!0,ref:!0,__self:!0,__source:!0},ReactElement=function(type,key,ref,self,source,owner,props){var element={$$typeof:REACT_ELEMENT_TYPE,type:type,key:key,ref:ref,props:props,_owner:owner};return"production"!==process.env.NODE_ENV&&(element._store={},canDefineProperty?(Object.defineProperty(element._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(element,"_self",{configurable:!1,enumerable:!1,writable:!1,value:self}),Object.defineProperty(element,"_source",{configurable:!1,enumerable:!1,writable:!1,value:source})):(element._store.validated=!1,element._self=self,element._source=source),Object.freeze&&(Object.freeze(element.props),Object.freeze(element))),element};ReactElement.createElement=function(type,config,children){var propName,props={},key=null,ref=null,self=null,source=null;if(null!=config){hasValidRef(config)&&(ref=config.ref),hasValidKey(config)&&(key=""+config.key),self=void 0===config.__self?null:config.__self,source=void 0===config.__source?null:config.__source;for(propName in config)hasOwnProperty.call(config,propName)&&!RESERVED_PROPS.hasOwnProperty(propName)&&(props[propName]=config[propName])}var childrenLength=arguments.length-2;if(1===childrenLength)props.children=children;else if(childrenLength>1){for(var childArray=Array(childrenLength),i=0;i<childrenLength;i++)childArray[i]=arguments[i+2];"production"!==process.env.NODE_ENV&&Object.freeze&&Object.freeze(childArray),props.children=childArray}if(type&&type.defaultProps){var defaultProps=type.defaultProps;for(propName in defaultProps)void 0===props[propName]&&(props[propName]=defaultProps[propName])}if("production"!==process.env.NODE_ENV&&(key||ref)&&(void 0===props.$$typeof||props.$$typeof!==REACT_ELEMENT_TYPE)){var displayName="function"==typeof type?type.displayName||type.name||"Unknown":type;key&&defineKeyPropWarningGetter(props,displayName),ref&&defineRefPropWarningGetter(props,displayName)}return ReactElement(type,key,ref,self,source,ReactCurrentOwner.current,props)},ReactElement.createFactory=function(type){var factory=ReactElement.createElement.bind(null,type);return factory.type=type,factory},ReactElement.cloneAndReplaceKey=function(oldElement,newKey){return ReactElement(oldElement.type,newKey,oldElement.ref,oldElement._self,oldElement._source,oldElement._owner,oldElement.props)},ReactElement.cloneElement=function(element,config,children){var propName,props=_assign({},element.props),key=element.key,ref=element.ref,self=element._self,source=element._source,owner=element._owner;if(null!=config){hasValidRef(config)&&(ref=config.ref,owner=ReactCurrentOwner.current),hasValidKey(config)&&(key=""+config.key);var defaultProps;element.type&&element.type.defaultProps&&(defaultProps=element.type.defaultProps);for(propName in config)hasOwnProperty.call(config,propName)&&!RESERVED_PROPS.hasOwnProperty(propName)&&(void 0===config[propName]&&void 0!==defaultProps?props[propName]=defaultProps[propName]:props[propName]=config[propName])}var childrenLength=arguments.length-2;if(1===childrenLength)props.children=children;else if(childrenLength>1){for(var childArray=Array(childrenLength),i=0;i<childrenLength;i++)childArray[i]=arguments[i+2];props.children=childArray}return ReactElement(element.type,key,ref,self,source,owner,props)},ReactElement.isValidElement=function(object){return"object"==typeof object&&null!==object&&object.$$typeof===REACT_ELEMENT_TYPE},module.exports=ReactElement}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function reactProdInvariant(code){for(var argCount=arguments.length-1,message="Minified React error #"+code+"; visit http://facebook.github.io/react/docs/error-decoder.html?invariant="+code,argIdx=0;argIdx<argCount;argIdx++)message+="&args[]="+encodeURIComponent(arguments[argIdx+1]);message+=" for the full message or use the non-minified dev environment for full errors and additional helpful warnings.";var error=new Error(message);throw error.name="Invariant Violation",error.framesToPop=1,error}module.exports=reactProdInvariant},function(module,exports,__webpack_require__){"use strict";function insertTreeChildren(tree){if(enableLazy){var node=tree.node,children=tree.children;if(children.length)for(var i=0;i<children.length;i++)insertTreeBefore(node,children[i],null);else null!=tree.html?setInnerHTML(node,tree.html):null!=tree.text&&setTextContent(node,tree.text)}}function replaceChildWithTree(oldNode,newTree){oldNode.parentNode.replaceChild(newTree.node,oldNode),insertTreeChildren(newTree)}function queueChild(parentTree,childTree){enableLazy?parentTree.children.push(childTree):parentTree.node.appendChild(childTree.node)}function queueHTML(tree,html){enableLazy?tree.html=html:setInnerHTML(tree.node,html)}function queueText(tree,text){enableLazy?tree.text=text:setTextContent(tree.node,text)}function toString(){return this.node.nodeName}function DOMLazyTree(node){return{node:node,children:[],html:null,text:null,toString:toString}}var DOMNamespaces=__webpack_require__(55),setInnerHTML=__webpack_require__(44),createMicrosoftUnsafeLocalFunction=__webpack_require__(62),setTextContent=__webpack_require__(122),enableLazy="undefined"!=typeof document&&"number"==typeof document.documentMode||"undefined"!=typeof navigator&&"string"==typeof navigator.userAgent&&/\bEdge\/\d/.test(navigator.userAgent),insertTreeBefore=createMicrosoftUnsafeLocalFunction(function(parentNode,tree,referenceNode){11===tree.node.nodeType||1===tree.node.nodeType&&"object"===tree.node.nodeName.toLowerCase()&&(null==tree.node.namespaceURI||tree.node.namespaceURI===DOMNamespaces.html)?(insertTreeChildren(tree),parentNode.insertBefore(tree.node,referenceNode)):(parentNode.insertBefore(tree.node,referenceNode),insertTreeChildren(tree))});DOMLazyTree.insertTreeBefore=insertTreeBefore,DOMLazyTree.replaceChildWithTree=replaceChildWithTree,DOMLazyTree.queueChild=queueChild,DOMLazyTree.queueHTML=queueHTML,DOMLazyTree.queueText=queueText,module.exports=DOMLazyTree},function(module,exports,__webpack_require__){"use strict";(function(process){function attachRefs(){ReactRef.attachRefs(this,this._currentElement)}var ReactRef=__webpack_require__(270),ReactInstrumentation=__webpack_require__(14),warning=__webpack_require__(2),ReactReconciler={mountComponent:function(internalInstance,transaction,hostParent,hostContainerInfo,context,parentDebugID){"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onBeforeMountComponent(internalInstance._debugID,internalInstance._currentElement,parentDebugID);var markup=internalInstance.mountComponent(transaction,hostParent,hostContainerInfo,context,parentDebugID);return internalInstance._currentElement&&null!=internalInstance._currentElement.ref&&transaction.getReactMountReady().enqueue(attachRefs,internalInstance),"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onMountComponent(internalInstance._debugID),markup},getHostNode:function(internalInstance){return internalInstance.getHostNode()},unmountComponent:function(internalInstance,safely){"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onBeforeUnmountComponent(internalInstance._debugID),ReactRef.detachRefs(internalInstance,internalInstance._currentElement),internalInstance.unmountComponent(safely),"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onUnmountComponent(internalInstance._debugID)},receiveComponent:function(internalInstance,nextElement,transaction,context){var prevElement=internalInstance._currentElement;if(nextElement!==prevElement||context!==internalInstance._context){"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onBeforeUpdateComponent(internalInstance._debugID,nextElement);var refsChanged=ReactRef.shouldUpdateRefs(prevElement,nextElement);refsChanged&&ReactRef.detachRefs(internalInstance,prevElement),internalInstance.receiveComponent(nextElement,transaction,context),refsChanged&&internalInstance._currentElement&&null!=internalInstance._currentElement.ref&&transaction.getReactMountReady().enqueue(attachRefs,internalInstance),"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onUpdateComponent(internalInstance._debugID)}},performUpdateIfNecessary:function(internalInstance,transaction,updateBatchNumber){if(internalInstance._updateBatchNumber!==updateBatchNumber)return void("production"!==process.env.NODE_ENV&&warning(null==internalInstance._updateBatchNumber||internalInstance._updateBatchNumber===updateBatchNumber+1,"performUpdateIfNecessary: Unexpected batch number (current %s, pending %s)",updateBatchNumber,internalInstance._updateBatchNumber));"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onBeforeUpdateComponent(internalInstance._debugID,internalInstance._currentElement),internalInstance.performUpdateIfNecessary(transaction),"production"!==process.env.NODE_ENV&&0!==internalInstance._debugID&&ReactInstrumentation.debugTool.onUpdateComponent(internalInstance._debugID)}};module.exports=ReactReconciler}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var _assign=__webpack_require__(7),ReactBaseClasses=__webpack_require__(124),ReactChildren=__webpack_require__(301),ReactDOMFactories=__webpack_require__(302),ReactElement=__webpack_require__(24),ReactPropTypes=__webpack_require__(304),ReactVersion=__webpack_require__(306),createReactClass=__webpack_require__(308),onlyChild=__webpack_require__(310),createElement=ReactElement.createElement,createFactory=ReactElement.createFactory,cloneElement=ReactElement.cloneElement;if("production"!==process.env.NODE_ENV){var lowPriorityWarning=__webpack_require__(69),canDefineProperty=__webpack_require__(45),ReactElementValidator=__webpack_require__(126),didWarnPropTypesDeprecated=!1;createElement=ReactElementValidator.createElement,createFactory=ReactElementValidator.createFactory,cloneElement=ReactElementValidator.cloneElement}var __spread=_assign,createMixin=function(mixin){return mixin};if("production"!==process.env.NODE_ENV){var warnedForSpread=!1,warnedForCreateMixin=!1;__spread=function(){return lowPriorityWarning(warnedForSpread,"React.__spread is deprecated and should not be used. Use Object.assign directly or another helper function with similar semantics. You may be seeing this warning due to your compiler. See https://fb.me/react-spread-deprecation for more details."),warnedForSpread=!0,_assign.apply(null,arguments)},createMixin=function(mixin){return lowPriorityWarning(warnedForCreateMixin,"React.createMixin is deprecated and should not be used. In React v16.0, it will be removed. You can use this mixin directly instead. See https://fb.me/createmixin-was-never-implemented for more info."),warnedForCreateMixin=!0,mixin}}var React={Children:{map:ReactChildren.map,forEach:ReactChildren.forEach,count:ReactChildren.count,toArray:ReactChildren.toArray,only:onlyChild},Component:ReactBaseClasses.Component,PureComponent:ReactBaseClasses.PureComponent,createElement:createElement,cloneElement:cloneElement,isValidElement:ReactElement.isValidElement,PropTypes:ReactPropTypes,createClass:createReactClass,createFactory:createFactory,createMixin:createMixin,DOM:ReactDOMFactories,version:ReactVersion,__spread:__spread};if("production"!==process.env.NODE_ENV){var warnedForCreateClass=!1;canDefineProperty&&(Object.defineProperty(React,"PropTypes",{get:function(){return lowPriorityWarning(didWarnPropTypesDeprecated,"Accessing PropTypes via the main React package is deprecated, and will be removed in  React v16.0. Use the latest available v15.* prop-types package from npm instead. For info on usage, compatibility, migration and more, see https://fb.me/prop-types-docs"),didWarnPropTypesDeprecated=!0,ReactPropTypes}}),Object.defineProperty(React,"createClass",{get:function(){return lowPriorityWarning(warnedForCreateClass,"Accessing createClass via the main React package is deprecated, and will be removed in React v16.0. Use a plain JavaScript class instead. If you're not yet ready to migrate, create-react-class v15.* is available on npm as a temporary, drop-in replacement. For more info see https://fb.me/react-create-class"),warnedForCreateClass=!0,createReactClass}})),React.DOM={};var warnedForFactories=!1;Object.keys(ReactDOMFactories).forEach(function(factory){React.DOM[factory]=function(){return warnedForFactories||(lowPriorityWarning(!1,"Accessing factories like React.DOM.%s has been deprecated and will be removed in v16.0+. Use the react-dom-factories package instead.  Version 1.0 provides a drop-in replacement. For more info, see https://fb.me/react-dom-factories",factory),warnedForFactories=!0),ReactDOMFactories[factory].apply(ReactDOMFactories,arguments)}})}module.exports=React}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function reactProdInvariant(code){for(var argCount=arguments.length-1,message="Minified React error #"+code+"; visit http://facebook.github.io/react/docs/error-decoder.html?invariant="+code,argIdx=0;argIdx<argCount;argIdx++)message+="&args[]="+encodeURIComponent(arguments[argIdx+1]);message+=" for the full message or use the non-minified dev environment for full errors and additional helpful warnings.";var error=new Error(message);throw error.name="Invariant Violation",error.framesToPop=1,error}module.exports=reactProdInvariant},function(module,exports,__webpack_require__){"use strict";(function(process){function isInteractive(tag){return"button"===tag||"input"===tag||"select"===tag||"textarea"===tag}function shouldPreventMouseEvent(name,type,props){switch(name){case"onClick":case"onClickCapture":case"onDoubleClick":case"onDoubleClickCapture":case"onMouseDown":case"onMouseDownCapture":case"onMouseMove":case"onMouseMoveCapture":case"onMouseUp":case"onMouseUpCapture":return!(!props.disabled||!isInteractive(type));default:return!1}}var _prodInvariant=__webpack_require__(4),EventPluginRegistry=__webpack_require__(39),EventPluginUtils=__webpack_require__(56),ReactErrorUtils=__webpack_require__(60),accumulateInto=__webpack_require__(115),forEachAccumulated=__webpack_require__(116),invariant=__webpack_require__(1),listenerBank={},eventQueue=null,executeDispatchesAndRelease=function(event,simulated){event&&(EventPluginUtils.executeDispatchesInOrder(event,simulated),event.isPersistent()||event.constructor.release(event))},executeDispatchesAndReleaseSimulated=function(e){return executeDispatchesAndRelease(e,!0)},executeDispatchesAndReleaseTopLevel=function(e){return executeDispatchesAndRelease(e,!1)},getDictionaryKey=function(inst){return"."+inst._rootNodeID},EventPluginHub={injection:{injectEventPluginOrder:EventPluginRegistry.injectEventPluginOrder,injectEventPluginsByName:EventPluginRegistry.injectEventPluginsByName},putListener:function(inst,registrationName,listener){"function"!=typeof listener&&("production"!==process.env.NODE_ENV?invariant(!1,"Expected %s listener to be a function, instead got type %s",registrationName,typeof listener):_prodInvariant("94",registrationName,typeof listener));var key=getDictionaryKey(inst);(listenerBank[registrationName]||(listenerBank[registrationName]={}))[key]=listener;var PluginModule=EventPluginRegistry.registrationNameModules[registrationName];PluginModule&&PluginModule.didPutListener&&PluginModule.didPutListener(inst,registrationName,listener)},getListener:function(inst,registrationName){var bankForRegistrationName=listenerBank[registrationName];if(shouldPreventMouseEvent(registrationName,inst._currentElement.type,inst._currentElement.props))return null;var key=getDictionaryKey(inst);return bankForRegistrationName&&bankForRegistrationName[key]},deleteListener:function(inst,registrationName){var PluginModule=EventPluginRegistry.registrationNameModules[registrationName];PluginModule&&PluginModule.willDeleteListener&&PluginModule.willDeleteListener(inst,registrationName);var bankForRegistrationName=listenerBank[registrationName];if(bankForRegistrationName){delete bankForRegistrationName[getDictionaryKey(inst)]}},deleteAllListeners:function(inst){var key=getDictionaryKey(inst);for(var registrationName in listenerBank)if(listenerBank.hasOwnProperty(registrationName)&&listenerBank[registrationName][key]){var PluginModule=EventPluginRegistry.registrationNameModules[registrationName];PluginModule&&PluginModule.willDeleteListener&&PluginModule.willDeleteListener(inst,registrationName),delete listenerBank[registrationName][key]}},extractEvents:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){for(var events,plugins=EventPluginRegistry.plugins,i=0;i<plugins.length;i++){var possiblePlugin=plugins[i];if(possiblePlugin){var extractedEvents=possiblePlugin.extractEvents(topLevelType,targetInst,nativeEvent,nativeEventTarget);extractedEvents&&(events=accumulateInto(events,extractedEvents))}}return events},enqueueEvents:function(events){events&&(eventQueue=accumulateInto(eventQueue,events))},processEventQueue:function(simulated){var processingEventQueue=eventQueue;eventQueue=null,simulated?forEachAccumulated(processingEventQueue,executeDispatchesAndReleaseSimulated):forEachAccumulated(processingEventQueue,executeDispatchesAndReleaseTopLevel),eventQueue&&("production"!==process.env.NODE_ENV?invariant(!1,"processEventQueue(): Additional events were enqueued while processing an event queue. Support for this has not yet been implemented."):_prodInvariant("95")),ReactErrorUtils.rethrowCaughtError()},__purge:function(){listenerBank={}},__getListenerBank:function(){return listenerBank}};module.exports=EventPluginHub}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function listenerAtPhase(inst,event,propagationPhase){var registrationName=event.dispatchConfig.phasedRegistrationNames[propagationPhase];return getListener(inst,registrationName)}function accumulateDirectionalDispatches(inst,phase,event){"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(inst,"Dispatching inst must not be null");var listener=listenerAtPhase(inst,event,phase);listener&&(event._dispatchListeners=accumulateInto(event._dispatchListeners,listener),event._dispatchInstances=accumulateInto(event._dispatchInstances,inst))}function accumulateTwoPhaseDispatchesSingle(event){event&&event.dispatchConfig.phasedRegistrationNames&&EventPluginUtils.traverseTwoPhase(event._targetInst,accumulateDirectionalDispatches,event)}function accumulateTwoPhaseDispatchesSingleSkipTarget(event){if(event&&event.dispatchConfig.phasedRegistrationNames){var targetInst=event._targetInst,parentInst=targetInst?EventPluginUtils.getParentInstance(targetInst):null;EventPluginUtils.traverseTwoPhase(parentInst,accumulateDirectionalDispatches,event)}}function accumulateDispatches(inst,ignoredDirection,event){if(event&&event.dispatchConfig.registrationName){var registrationName=event.dispatchConfig.registrationName,listener=getListener(inst,registrationName);listener&&(event._dispatchListeners=accumulateInto(event._dispatchListeners,listener),event._dispatchInstances=accumulateInto(event._dispatchInstances,inst))}}function accumulateDirectDispatchesSingle(event){event&&event.dispatchConfig.registrationName&&accumulateDispatches(event._targetInst,null,event)}function accumulateTwoPhaseDispatches(events){forEachAccumulated(events,accumulateTwoPhaseDispatchesSingle)}function accumulateTwoPhaseDispatchesSkipTarget(events){forEachAccumulated(events,accumulateTwoPhaseDispatchesSingleSkipTarget)}function accumulateEnterLeaveDispatches(leave,enter,from,to){EventPluginUtils.traverseEnterLeave(from,to,accumulateDispatches,leave,enter)}function accumulateDirectDispatches(events){forEachAccumulated(events,accumulateDirectDispatchesSingle)}var EventPluginHub=__webpack_require__(30),EventPluginUtils=__webpack_require__(56),accumulateInto=__webpack_require__(115),forEachAccumulated=__webpack_require__(116),warning=__webpack_require__(2),getListener=EventPluginHub.getListener,EventPropagators={accumulateTwoPhaseDispatches:accumulateTwoPhaseDispatches,accumulateTwoPhaseDispatchesSkipTarget:accumulateTwoPhaseDispatchesSkipTarget,accumulateDirectDispatches:accumulateDirectDispatches,accumulateEnterLeaveDispatches:accumulateEnterLeaveDispatches};module.exports=EventPropagators}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var ReactInstanceMap={remove:function(key){key._reactInternalInstance=void 0},get:function(key){return key._reactInternalInstance},has:function(key){return void 0!==key._reactInternalInstance},set:function(key,value){key._reactInternalInstance=value}};module.exports=ReactInstanceMap},function(module,exports,__webpack_require__){"use strict";function SyntheticUIEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticEvent=__webpack_require__(20),getEventTarget=__webpack_require__(65),UIEventInterface={view:function(event){if(event.view)return event.view;var target=getEventTarget(event);if(target.window===target)return target;var doc=target.ownerDocument;return doc?doc.defaultView||doc.parentWindow:window},detail:function(event){return event.detail||0}};SyntheticEvent.augmentClass(SyntheticUIEvent,UIEventInterface),module.exports=SyntheticUIEvent},function(module,exports,__webpack_require__){"use strict";function makeEmptyFunction(arg){return function(){return arg}}var emptyFunction=function(){};emptyFunction.thatReturns=makeEmptyFunction,emptyFunction.thatReturnsFalse=makeEmptyFunction(!1),emptyFunction.thatReturnsTrue=makeEmptyFunction(!0),emptyFunction.thatReturnsNull=makeEmptyFunction(null),emptyFunction.thatReturnsThis=function(){return this},emptyFunction.thatReturnsArgument=function(arg){return arg},module.exports=emptyFunction},function(module,exports,__webpack_require__){"use strict";function toObject(val){if(null===val||void 0===val)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(val)}/*
 object-assign
 (c) Sindre Sorhus
 @license MIT
 */
-var getOwnPropertySymbols=Object.getOwnPropertySymbols,hasOwnProperty=Object.prototype.hasOwnProperty,propIsEnumerable=Object.prototype.propertyIsEnumerable;module.exports=function(){try{if(!Object.assign)return!1;var test1=new String("abc");if(test1[5]="de","5"===Object.getOwnPropertyNames(test1)[0])return!1;for(var test2={},i=0;i<10;i++)test2["_"+String.fromCharCode(i)]=i;if("0123456789"!==Object.getOwnPropertyNames(test2).map(function(n){return test2[n]}).join(""))return!1;var test3={};return"abcdefghijklmnopqrst".split("").forEach(function(letter){test3[letter]=letter}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},test3)).join("")}catch(err){return!1}}()?Object.assign:function(target,source){for(var from,symbols,to=toObject(target),s=1;s<arguments.length;s++){from=Object(arguments[s]);for(var key in from)hasOwnProperty.call(from,key)&&(to[key]=from[key]);if(getOwnPropertySymbols){symbols=getOwnPropertySymbols(from);for(var i=0;i<symbols.length;i++)propIsEnumerable.call(from,symbols[i])&&(to[symbols[i]]=from[symbols[i]])}}return to}},function(module,exports,__webpack_require__){"use strict";var ReactCurrentOwner={current:null};module.exports=ReactCurrentOwner},function(module,exports,__webpack_require__){"use strict";(function(process){var canDefineProperty=!1;if("production"!==process.env.NODE_ENV)try{Object.defineProperty({},"x",{get:function(){}}),canDefineProperty=!0}catch(x){}module.exports=canDefineProperty}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyObject={};"production"!==process.env.NODE_ENV&&Object.freeze(emptyObject),module.exports=emptyObject}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function recomputePluginOrdering(){if(eventPluginOrder)for(var pluginName in namesToPlugins){var pluginModule=namesToPlugins[pluginName],pluginIndex=eventPluginOrder.indexOf(pluginName);if(pluginIndex>-1||("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginRegistry: Cannot inject event plugins that do not exist in the plugin ordering, `%s`.",pluginName):_prodInvariant("96",pluginName)),!EventPluginRegistry.plugins[pluginIndex]){pluginModule.extractEvents||("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginRegistry: Event plugins must implement an `extractEvents` method, but `%s` does not.",pluginName):_prodInvariant("97",pluginName)),EventPluginRegistry.plugins[pluginIndex]=pluginModule;var publishedEvents=pluginModule.eventTypes;for(var eventName in publishedEvents)publishEventForPlugin(publishedEvents[eventName],pluginModule,eventName)||("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginRegistry: Failed to publish event `%s` for plugin `%s`.",eventName,pluginName):_prodInvariant("98",eventName,pluginName))}}}function publishEventForPlugin(dispatchConfig,pluginModule,eventName){EventPluginRegistry.eventNameDispatchConfigs.hasOwnProperty(eventName)&&("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginHub: More than one plugin attempted to publish the same event name, `%s`.",eventName):_prodInvariant("99",eventName)),EventPluginRegistry.eventNameDispatchConfigs[eventName]=dispatchConfig;var phasedRegistrationNames=dispatchConfig.phasedRegistrationNames;if(phasedRegistrationNames){for(var phaseName in phasedRegistrationNames)if(phasedRegistrationNames.hasOwnProperty(phaseName)){var phasedRegistrationName=phasedRegistrationNames[phaseName];publishRegistrationName(phasedRegistrationName,pluginModule,eventName)}return!0}return!!dispatchConfig.registrationName&&(publishRegistrationName(dispatchConfig.registrationName,pluginModule,eventName),!0)}function publishRegistrationName(registrationName,pluginModule,eventName){if(EventPluginRegistry.registrationNameModules[registrationName]&&("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginHub: More than one plugin attempted to publish the same registration name, `%s`.",registrationName):_prodInvariant("100",registrationName)),EventPluginRegistry.registrationNameModules[registrationName]=pluginModule,EventPluginRegistry.registrationNameDependencies[registrationName]=pluginModule.eventTypes[eventName].dependencies,"production"!==process.env.NODE_ENV){var lowerCasedName=registrationName.toLowerCase();EventPluginRegistry.possibleRegistrationNames[lowerCasedName]=registrationName,"onDoubleClick"===registrationName&&(EventPluginRegistry.possibleRegistrationNames.ondblclick=registrationName)}}var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),eventPluginOrder=null,namesToPlugins={},EventPluginRegistry={plugins:[],eventNameDispatchConfigs:{},registrationNameModules:{},registrationNameDependencies:{},possibleRegistrationNames:"production"!==process.env.NODE_ENV?{}:null,injectEventPluginOrder:function(injectedEventPluginOrder){eventPluginOrder&&("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginRegistry: Cannot inject event plugin ordering more than once. You are likely trying to load more than one copy of React."):_prodInvariant("101")),eventPluginOrder=Array.prototype.slice.call(injectedEventPluginOrder),recomputePluginOrdering()},injectEventPluginsByName:function(injectedNamesToPlugins){var isOrderingDirty=!1;for(var pluginName in injectedNamesToPlugins)if(injectedNamesToPlugins.hasOwnProperty(pluginName)){var pluginModule=injectedNamesToPlugins[pluginName];namesToPlugins.hasOwnProperty(pluginName)&&namesToPlugins[pluginName]===pluginModule||(namesToPlugins[pluginName]&&("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginRegistry: Cannot inject two different event plugins using the same name, `%s`.",pluginName):_prodInvariant("102",pluginName)),namesToPlugins[pluginName]=pluginModule,isOrderingDirty=!0)}isOrderingDirty&&recomputePluginOrdering()},getPluginModuleForEvent:function(event){var dispatchConfig=event.dispatchConfig;if(dispatchConfig.registrationName)return EventPluginRegistry.registrationNameModules[dispatchConfig.registrationName]||null;if(void 0!==dispatchConfig.phasedRegistrationNames){var phasedRegistrationNames=dispatchConfig.phasedRegistrationNames;for(var phase in phasedRegistrationNames)if(phasedRegistrationNames.hasOwnProperty(phase)){var pluginModule=EventPluginRegistry.registrationNameModules[phasedRegistrationNames[phase]];if(pluginModule)return pluginModule}}return null},_resetEventPlugins:function(){eventPluginOrder=null;for(var pluginName in namesToPlugins)namesToPlugins.hasOwnProperty(pluginName)&&delete namesToPlugins[pluginName];EventPluginRegistry.plugins.length=0;var eventNameDispatchConfigs=EventPluginRegistry.eventNameDispatchConfigs;for(var eventName in eventNameDispatchConfigs)eventNameDispatchConfigs.hasOwnProperty(eventName)&&delete eventNameDispatchConfigs[eventName];var registrationNameModules=EventPluginRegistry.registrationNameModules;for(var registrationName in registrationNameModules)registrationNameModules.hasOwnProperty(registrationName)&&delete registrationNameModules[registrationName];if("production"!==process.env.NODE_ENV){var possibleRegistrationNames=EventPluginRegistry.possibleRegistrationNames;for(var lowerCasedName in possibleRegistrationNames)possibleRegistrationNames.hasOwnProperty(lowerCasedName)&&delete possibleRegistrationNames[lowerCasedName]}}};module.exports=EventPluginRegistry}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function getListeningForDocument(mountAt){return Object.prototype.hasOwnProperty.call(mountAt,topListenersIDKey)||(mountAt[topListenersIDKey]=reactTopListenersCounter++,alreadyListeningTo[mountAt[topListenersIDKey]]={}),alreadyListeningTo[mountAt[topListenersIDKey]]}var hasEventPageXY,_assign=__webpack_require__(7),EventPluginRegistry=__webpack_require__(39),ReactEventEmitterMixin=__webpack_require__(259),ViewportMetrics=__webpack_require__(114),getVendorPrefixedEventName=__webpack_require__(294),isEventSupported=__webpack_require__(66),alreadyListeningTo={},isMonitoringScrollValue=!1,reactTopListenersCounter=0,topEventMapping={topAbort:"abort",topAnimationEnd:getVendorPrefixedEventName("animationend")||"animationend",topAnimationIteration:getVendorPrefixedEventName("animationiteration")||"animationiteration",topAnimationStart:getVendorPrefixedEventName("animationstart")||"animationstart",topBlur:"blur",topCanPlay:"canplay",topCanPlayThrough:"canplaythrough",topChange:"change",topClick:"click",topCompositionEnd:"compositionend",topCompositionStart:"compositionstart",topCompositionUpdate:"compositionupdate",topContextMenu:"contextmenu",topCopy:"copy",topCut:"cut",topDoubleClick:"dblclick",topDrag:"drag",topDragEnd:"dragend",topDragEnter:"dragenter",topDragExit:"dragexit",topDragLeave:"dragleave",topDragOver:"dragover",topDragStart:"dragstart",topDrop:"drop",topDurationChange:"durationchange",topEmptied:"emptied",topEncrypted:"encrypted",topEnded:"ended",topError:"error",topFocus:"focus",topInput:"input",topKeyDown:"keydown",topKeyPress:"keypress",topKeyUp:"keyup",topLoadedData:"loadeddata",topLoadedMetadata:"loadedmetadata",topLoadStart:"loadstart",topMouseDown:"mousedown",topMouseMove:"mousemove",topMouseOut:"mouseout",topMouseOver:"mouseover",topMouseUp:"mouseup",topPaste:"paste",topPause:"pause",topPlay:"play",topPlaying:"playing",topProgress:"progress",topRateChange:"ratechange",topScroll:"scroll",topSeeked:"seeked",topSeeking:"seeking",topSelectionChange:"selectionchange",topStalled:"stalled",topSuspend:"suspend",topTextInput:"textInput",topTimeUpdate:"timeupdate",topTouchCancel:"touchcancel",topTouchEnd:"touchend",topTouchMove:"touchmove",topTouchStart:"touchstart",topTransitionEnd:getVendorPrefixedEventName("transitionend")||"transitionend",topVolumeChange:"volumechange",topWaiting:"waiting",topWheel:"wheel"},topListenersIDKey="_reactListenersID"+String(Math.random()).slice(2),ReactBrowserEventEmitter=_assign({},ReactEventEmitterMixin,{ReactEventListener:null,injection:{injectReactEventListener:function(ReactEventListener){ReactEventListener.setHandleTopLevel(ReactBrowserEventEmitter.handleTopLevel),ReactBrowserEventEmitter.ReactEventListener=ReactEventListener}},setEnabled:function(enabled){ReactBrowserEventEmitter.ReactEventListener&&ReactBrowserEventEmitter.ReactEventListener.setEnabled(enabled)},isEnabled:function(){return!(!ReactBrowserEventEmitter.ReactEventListener||!ReactBrowserEventEmitter.ReactEventListener.isEnabled())},listenTo:function(registrationName,contentDocumentHandle){for(var mountAt=contentDocumentHandle,isListening=getListeningForDocument(mountAt),dependencies=EventPluginRegistry.registrationNameDependencies[registrationName],i=0;i<dependencies.length;i++){var dependency=dependencies[i];isListening.hasOwnProperty(dependency)&&isListening[dependency]||("topWheel"===dependency?isEventSupported("wheel")?ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent("topWheel","wheel",mountAt):isEventSupported("mousewheel")?ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent("topWheel","mousewheel",mountAt):ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent("topWheel","DOMMouseScroll",mountAt):"topScroll"===dependency?isEventSupported("scroll",!0)?ReactBrowserEventEmitter.ReactEventListener.trapCapturedEvent("topScroll","scroll",mountAt):ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent("topScroll","scroll",ReactBrowserEventEmitter.ReactEventListener.WINDOW_HANDLE):"topFocus"===dependency||"topBlur"===dependency?(isEventSupported("focus",!0)?(ReactBrowserEventEmitter.ReactEventListener.trapCapturedEvent("topFocus","focus",mountAt),ReactBrowserEventEmitter.ReactEventListener.trapCapturedEvent("topBlur","blur",mountAt)):isEventSupported("focusin")&&(ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent("topFocus","focusin",mountAt),ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent("topBlur","focusout",mountAt)),isListening.topBlur=!0,isListening.topFocus=!0):topEventMapping.hasOwnProperty(dependency)&&ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent(dependency,topEventMapping[dependency],mountAt),isListening[dependency]=!0)}},trapBubbledEvent:function(topLevelType,handlerBaseName,handle){return ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent(topLevelType,handlerBaseName,handle)},trapCapturedEvent:function(topLevelType,handlerBaseName,handle){return ReactBrowserEventEmitter.ReactEventListener.trapCapturedEvent(topLevelType,handlerBaseName,handle)},supportsEventPageXY:function(){if(!document.createEvent)return!1;var ev=document.createEvent("MouseEvent");return null!=ev&&"pageX"in ev},ensureScrollValueMonitoring:function(){if(void 0===hasEventPageXY&&(hasEventPageXY=ReactBrowserEventEmitter.supportsEventPageXY()),!hasEventPageXY&&!isMonitoringScrollValue){var refresh=ViewportMetrics.refreshScrollValues;ReactBrowserEventEmitter.ReactEventListener.monitorScrollValue(refresh),isMonitoringScrollValue=!0}}});module.exports=ReactBrowserEventEmitter},function(module,exports,__webpack_require__){"use strict";function SyntheticMouseEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticUIEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticUIEvent=__webpack_require__(33),ViewportMetrics=__webpack_require__(114),getEventModifierState=__webpack_require__(64),MouseEventInterface={screenX:null,screenY:null,clientX:null,clientY:null,ctrlKey:null,shiftKey:null,altKey:null,metaKey:null,getModifierState:getEventModifierState,button:function(event){var button=event.button;return"which"in event?button:2===button?2:4===button?1:0},buttons:null,relatedTarget:function(event){return event.relatedTarget||(event.fromElement===event.srcElement?event.toElement:event.fromElement)},pageX:function(event){return"pageX"in event?event.pageX:event.clientX+ViewportMetrics.currentScrollLeft},pageY:function(event){return"pageY"in event?event.pageY:event.clientY+ViewportMetrics.currentScrollTop}};SyntheticUIEvent.augmentClass(SyntheticMouseEvent,MouseEventInterface),module.exports=SyntheticMouseEvent},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),OBSERVED_ERROR={},TransactionImpl={reinitializeTransaction:function(){this.transactionWrappers=this.getTransactionWrappers(),this.wrapperInitData?this.wrapperInitData.length=0:this.wrapperInitData=[],this._isInTransaction=!1},_isInTransaction:!1,getTransactionWrappers:null,isInTransaction:function(){return!!this._isInTransaction},perform:function(method,scope,a,b,c,d,e,f){this.isInTransaction()&&("production"!==process.env.NODE_ENV?invariant(!1,"Transaction.perform(...): Cannot initialize a transaction when there is already an outstanding transaction."):_prodInvariant("27"));var errorThrown,ret;try{this._isInTransaction=!0,errorThrown=!0,this.initializeAll(0),ret=method.call(scope,a,b,c,d,e,f),errorThrown=!1}finally{try{if(errorThrown)try{this.closeAll(0)}catch(err){}else this.closeAll(0)}finally{this._isInTransaction=!1}}return ret},initializeAll:function(startIndex){for(var transactionWrappers=this.transactionWrappers,i=startIndex;i<transactionWrappers.length;i++){var wrapper=transactionWrappers[i];try{this.wrapperInitData[i]=OBSERVED_ERROR,this.wrapperInitData[i]=wrapper.initialize?wrapper.initialize.call(this):null}finally{if(this.wrapperInitData[i]===OBSERVED_ERROR)try{this.initializeAll(i+1)}catch(err){}}}},closeAll:function(startIndex){this.isInTransaction()||("production"!==process.env.NODE_ENV?invariant(!1,"Transaction.closeAll(): Cannot close transaction when none are open."):_prodInvariant("28"));for(var transactionWrappers=this.transactionWrappers,i=startIndex;i<transactionWrappers.length;i++){var errorThrown,wrapper=transactionWrappers[i],initData=this.wrapperInitData[i];try{errorThrown=!0,initData!==OBSERVED_ERROR&&wrapper.close&&wrapper.close.call(this,initData),errorThrown=!1}finally{if(errorThrown)try{this.closeAll(i+1)}catch(e){}}}this.wrapperInitData.length=0}};module.exports=TransactionImpl}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function escapeHtml(string){var str=""+string,match=matchHtmlRegExp.exec(str);if(!match)return str;var escape,html="",index=0,lastIndex=0;for(index=match.index;index<str.length;index++){switch(str.charCodeAt(index)){case 34:escape="&quot;";break;case 38:escape="&amp;";break;case 39:escape="&#x27;";break;case 60:escape="&lt;";break;case 62:escape="&gt;";break;default:continue}lastIndex!==index&&(html+=str.substring(lastIndex,index)),lastIndex=index+1,html+=escape}return lastIndex!==index?html+str.substring(lastIndex,index):html}function escapeTextContentForBrowser(text){return"boolean"==typeof text||"number"==typeof text?""+text:escapeHtml(text)}var matchHtmlRegExp=/["'&<>]/;module.exports=escapeTextContentForBrowser},function(module,exports,__webpack_require__){"use strict";var reusableSVGContainer,ExecutionEnvironment=__webpack_require__(9),DOMNamespaces=__webpack_require__(55),WHITESPACE_TEST=/^[ \r\n\t\f]/,NONVISIBLE_TEST=/<(!--|link|noscript|meta|script|style)[ \r\n\t\f\/>]/,createMicrosoftUnsafeLocalFunction=__webpack_require__(62),setInnerHTML=createMicrosoftUnsafeLocalFunction(function(node,html){if(node.namespaceURI!==DOMNamespaces.svg||"innerHTML"in node)node.innerHTML=html;else{reusableSVGContainer=reusableSVGContainer||document.createElement("div"),reusableSVGContainer.innerHTML="<svg>"+html+"</svg>";for(var svgNode=reusableSVGContainer.firstChild;svgNode.firstChild;)node.appendChild(svgNode.firstChild)}});if(ExecutionEnvironment.canUseDOM){var testElement=document.createElement("div");testElement.innerHTML=" ",""===testElement.innerHTML&&(setInnerHTML=function(node,html){if(node.parentNode&&node.parentNode.replaceChild(node,node),WHITESPACE_TEST.test(html)||"<"===html[0]&&NONVISIBLE_TEST.test(html)){node.innerHTML=String.fromCharCode(65279)+html;var textNode=node.firstChild;1===textNode.data.length?node.removeChild(textNode):textNode.deleteData(0,1)}else node.innerHTML=html}),testElement=null}module.exports=setInnerHTML},function(module,exports,__webpack_require__){"use strict";(function(process){var canDefineProperty=!1;if("production"!==process.env.NODE_ENV)try{Object.defineProperty({},"x",{get:function(){}}),canDefineProperty=!0}catch(x){}module.exports=canDefineProperty}).call(exports,__webpack_require__(0))},function(module,exports){var g;g=function(){return this}();try{g=g||Function("return this")()||(0,eval)("this")}catch(e){"object"==typeof window&&(g=window)}module.exports=g},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.FormLabel=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),FormLabel=exports.FormLabel=function(_React$PureComponent){function FormLabel(){return _classCallCheck(this,FormLabel),_possibleConstructorReturn(this,(FormLabel.__proto__||Object.getPrototypeOf(FormLabel)).apply(this,arguments))}return _inherits(FormLabel,_React$PureComponent),_createClass(FormLabel,[{key:"errorMessage",value:function(){if(this.props.errorMessage)return _react2.default.createElement("span",{className:"ds-c-field__hint ds-u-color--error",id:this.props.fieldId+"-message",role:"alert"},this.props.errorMessage)}},{key:"hint",value:function(){if(this.props.hint){var classes=(0,_classnames2.default)("ds-c-field__hint",{"ds-c-field__hint--inverse":this.props.inversed});return _react2.default.createElement("span",{className:classes},this.props.hint)}}},{key:"render",value:function(){var ComponentType=this.props.component,labelTextClasses=this.props.errorMessage&&"ds-u-font-weight--bold",classes=(0,_classnames2.default)("ds-c-label",this.props.className);return _react2.default.createElement(ComponentType,{className:classes,htmlFor:this.props.fieldId},_react2.default.createElement("span",{className:labelTextClasses},this.props.children),this.errorMessage(),this.hint())}}]),FormLabel}(_react2.default.PureComponent);FormLabel.defaultProps={component:"label"},FormLabel.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,component:_propTypes2.default.oneOf(["label","legend"]),errorMessage:_propTypes2.default.string,fieldId:_propTypes2.default.string,hint:_propTypes2.default.node,inversed:_propTypes2.default.bool},exports.default=FormLabel},function(module,exports,__webpack_require__){"use strict";module.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(module,exports,__webpack_require__){"use strict";(function(process){function isNative(fn){var funcToString=Function.prototype.toString,hasOwnProperty=Object.prototype.hasOwnProperty,reIsNative=RegExp("^"+funcToString.call(hasOwnProperty).replace(/[\\^$.*+?()[\]{}|]/g,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$");try{var source=funcToString.call(fn);return reIsNative.test(source)}catch(err){return!1}}function purgeDeep(id){var item=getItem(id);if(item){var childIDs=item.childIDs;removeItem(id),childIDs.forEach(purgeDeep)}}function describeComponentFrame(name,source,ownerName){return"\n    in "+(name||"Unknown")+(source?" (at "+source.fileName.replace(/^.*[\\\/]/,"")+":"+source.lineNumber+")":ownerName?" (created by "+ownerName+")":"")}function getDisplayName(element){return null==element?"#empty":"string"==typeof element||"number"==typeof element?"#text":"string"==typeof element.type?element.type:element.type.displayName||element.type.name||"Unknown"}function describeID(id){var ownerName,name=ReactComponentTreeHook.getDisplayName(id),element=ReactComponentTreeHook.getElement(id),ownerID=ReactComponentTreeHook.getOwnerID(id);return ownerID&&(ownerName=ReactComponentTreeHook.getDisplayName(ownerID)),"production"!==process.env.NODE_ENV&&warning(element,"ReactComponentTreeHook: Missing React element for debugID %s when building stack",id),describeComponentFrame(name,element&&element._source,ownerName)}var setItem,getItem,removeItem,getItemIDs,addRoot,removeRoot,getRootIDs,_prodInvariant=__webpack_require__(25),ReactCurrentOwner=__webpack_require__(36),invariant=__webpack_require__(15),warning=__webpack_require__(19),canUseCollections="function"==typeof Array.from&&"function"==typeof Map&&isNative(Map)&&null!=Map.prototype&&"function"==typeof Map.prototype.keys&&isNative(Map.prototype.keys)&&"function"==typeof Set&&isNative(Set)&&null!=Set.prototype&&"function"==typeof Set.prototype.keys&&isNative(Set.prototype.keys);if(canUseCollections){var itemMap=new Map,rootIDSet=new Set;setItem=function(id,item){itemMap.set(id,item)},getItem=function(id){return itemMap.get(id)},removeItem=function(id){itemMap.delete(id)},getItemIDs=function(){return Array.from(itemMap.keys())},addRoot=function(id){rootIDSet.add(id)},removeRoot=function(id){rootIDSet.delete(id)},getRootIDs=function(){return Array.from(rootIDSet.keys())}}else{var itemByKey={},rootByKey={},getKeyFromID=function(id){return"."+id},getIDFromKey=function(key){return parseInt(key.substr(1),10)};setItem=function(id,item){var key=getKeyFromID(id);itemByKey[key]=item},getItem=function(id){var key=getKeyFromID(id);return itemByKey[key]},removeItem=function(id){var key=getKeyFromID(id);delete itemByKey[key]},getItemIDs=function(){return Object.keys(itemByKey).map(getIDFromKey)},addRoot=function(id){var key=getKeyFromID(id);rootByKey[key]=!0},removeRoot=function(id){var key=getKeyFromID(id);delete rootByKey[key]},getRootIDs=function(){return Object.keys(rootByKey).map(getIDFromKey)}}var unmountedIDs=[],ReactComponentTreeHook={onSetChildren:function(id,nextChildIDs){var item=getItem(id);item||("production"!==process.env.NODE_ENV?invariant(!1,"Item must have been set"):_prodInvariant("144")),item.childIDs=nextChildIDs;for(var i=0;i<nextChildIDs.length;i++){var nextChildID=nextChildIDs[i],nextChild=getItem(nextChildID);nextChild||("production"!==process.env.NODE_ENV?invariant(!1,"Expected hook events to fire for the child before its parent includes it in onSetChildren()."):_prodInvariant("140")),null==nextChild.childIDs&&"object"==typeof nextChild.element&&null!=nextChild.element&&("production"!==process.env.NODE_ENV?invariant(!1,"Expected onSetChildren() to fire for a container child before its parent includes it in onSetChildren()."):_prodInvariant("141")),nextChild.isMounted||("production"!==process.env.NODE_ENV?invariant(!1,"Expected onMountComponent() to fire for the child before its parent includes it in onSetChildren()."):_prodInvariant("71")),null==nextChild.parentID&&(nextChild.parentID=id),nextChild.parentID!==id&&("production"!==process.env.NODE_ENV?invariant(!1,"Expected onBeforeMountComponent() parent and onSetChildren() to be consistent (%s has parents %s and %s).",nextChildID,nextChild.parentID,id):_prodInvariant("142",nextChildID,nextChild.parentID,id))}},onBeforeMountComponent:function(id,element,parentID){setItem(id,{element:element,parentID:parentID,text:null,childIDs:[],isMounted:!1,updateCount:0})},onBeforeUpdateComponent:function(id,element){var item=getItem(id);item&&item.isMounted&&(item.element=element)},onMountComponent:function(id){var item=getItem(id);item||("production"!==process.env.NODE_ENV?invariant(!1,"Item must have been set"):_prodInvariant("144")),item.isMounted=!0,0===item.parentID&&addRoot(id)},onUpdateComponent:function(id){var item=getItem(id);item&&item.isMounted&&item.updateCount++},onUnmountComponent:function(id){var item=getItem(id);if(item){item.isMounted=!1;0===item.parentID&&removeRoot(id)}unmountedIDs.push(id)},purgeUnmountedComponents:function(){if(!ReactComponentTreeHook._preventPurging){for(var i=0;i<unmountedIDs.length;i++){purgeDeep(unmountedIDs[i])}unmountedIDs.length=0}},isMounted:function(id){var item=getItem(id);return!!item&&item.isMounted},getCurrentStackAddendum:function(topElement){var info="";if(topElement){var name=getDisplayName(topElement),owner=topElement._owner;info+=describeComponentFrame(name,topElement._source,owner&&owner.getName())}var currentOwner=ReactCurrentOwner.current,id=currentOwner&&currentOwner._debugID;return info+=ReactComponentTreeHook.getStackAddendumByID(id)},getStackAddendumByID:function(id){for(var info="";id;)info+=describeID(id),id=ReactComponentTreeHook.getParentID(id);return info},getChildIDs:function(id){var item=getItem(id);return item?item.childIDs:[]},getDisplayName:function(id){var element=ReactComponentTreeHook.getElement(id);return element?getDisplayName(element):null},getElement:function(id){var item=getItem(id);return item?item.element:null},getOwnerID:function(id){var element=ReactComponentTreeHook.getElement(id);return element&&element._owner?element._owner._debugID:null},getParentID:function(id){var item=getItem(id);return item?item.parentID:null},getSource:function(id){var item=getItem(id),element=item?item.element:null;return null!=element?element._source:null},getText:function(id){var element=ReactComponentTreeHook.getElement(id);return"string"==typeof element?element:"number"==typeof element?""+element:null},getUpdateCount:function(id){var item=getItem(id);return item?item.updateCount:0},getRootIDs:getRootIDs,getRegisteredIDs:getItemIDs,pushNonStandardWarningStack:function(isCreatingElement,currentSource){if("function"==typeof console.reactStack){var stack=[],currentOwner=ReactCurrentOwner.current,id=currentOwner&&currentOwner._debugID;try{for(isCreatingElement&&stack.push({name:id?ReactComponentTreeHook.getDisplayName(id):null,fileName:currentSource?currentSource.fileName:null,lineNumber:currentSource?currentSource.lineNumber:null});id;){var element=ReactComponentTreeHook.getElement(id),parentID=ReactComponentTreeHook.getParentID(id),ownerID=ReactComponentTreeHook.getOwnerID(id),ownerName=ownerID?ReactComponentTreeHook.getDisplayName(ownerID):null,source=element&&element._source;stack.push({name:ownerName,fileName:source?source.fileName:null,lineNumber:source?source.lineNumber:null}),id=parentID}}catch(err){}}},popNonStandardWarningStack:function(){console.reactStackEnd}};module.exports=ReactComponentTreeHook}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var lowPriorityWarning=function(){};if("production"!==process.env.NODE_ENV){var printWarning=function(format){for(var _len=arguments.length,args=Array(_len>1?_len-1:0),_key=1;_key<_len;_key++)args[_key-1]=arguments[_key];var argIndex=0,message="Warning: "+format.replace(/%s/g,function(){return args[argIndex++]});try{throw new Error(message)}catch(x){}};lowPriorityWarning=function(condition,format){if(void 0===format)throw new Error("`warning(condition, format, ...args)` requires a warning message argument");if(!condition){for(var _len2=arguments.length,args=Array(_len2>2?_len2-2:0),_key2=2;_key2<_len2;_key2++)args[_key2-2]=arguments[_key2];printWarning.apply(void 0,[format].concat(args))}}}module.exports=lowPriorityWarning}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function is(x,y){return x===y?0!==x||0!==y||1/x==1/y:x!==x&&y!==y}function shallowEqual(objA,objB){if(is(objA,objB))return!0;if("object"!=typeof objA||null===objA||"object"!=typeof objB||null===objB)return!1;var keysA=Object.keys(objA),keysB=Object.keys(objB);if(keysA.length!==keysB.length)return!1;for(var i=0;i<keysA.length;i++)if(!hasOwnProperty.call(objB,keysA[i])||!is(objA[keysA[i]],objB[keysA[i]]))return!1;return!0}var hasOwnProperty=Object.prototype.hasOwnProperty;module.exports=shallowEqual},function(module,exports){function isObject(value){var type=typeof value;return null!=value&&("object"==type||"function"==type)}module.exports=isObject},function(module,exports,__webpack_require__){"use strict";module.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(module,exports,__webpack_require__){"use strict";(function(process){function getNodeAfter(parentNode,node){return Array.isArray(node)&&(node=node[1]),node?node.nextSibling:parentNode.firstChild}function insertLazyTreeChildAt(parentNode,childTree,referenceNode){DOMLazyTree.insertTreeBefore(parentNode,childTree,referenceNode)}function moveChild(parentNode,childNode,referenceNode){Array.isArray(childNode)?moveDelimitedText(parentNode,childNode[0],childNode[1],referenceNode):insertChildAt(parentNode,childNode,referenceNode)}function removeChild(parentNode,childNode){if(Array.isArray(childNode)){var closingComment=childNode[1];childNode=childNode[0],removeDelimitedText(parentNode,childNode,closingComment),parentNode.removeChild(closingComment)}parentNode.removeChild(childNode)}function moveDelimitedText(parentNode,openingComment,closingComment,referenceNode){for(var node=openingComment;;){var nextNode=node.nextSibling;if(insertChildAt(parentNode,node,referenceNode),node===closingComment)break;node=nextNode}}function removeDelimitedText(parentNode,startNode,closingComment){for(;;){var node=startNode.nextSibling;if(node===closingComment)break;parentNode.removeChild(node)}}function replaceDelimitedText(openingComment,closingComment,stringText){var parentNode=openingComment.parentNode,nodeAfterComment=openingComment.nextSibling;nodeAfterComment===closingComment?stringText&&insertChildAt(parentNode,document.createTextNode(stringText),nodeAfterComment):stringText?(setTextContent(nodeAfterComment,stringText),removeDelimitedText(parentNode,nodeAfterComment,closingComment)):removeDelimitedText(parentNode,openingComment,closingComment),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:ReactDOMComponentTree.getInstanceFromNode(openingComment)._debugID,type:"replace text",payload:stringText})}var DOMLazyTree=__webpack_require__(26),Danger=__webpack_require__(232),ReactDOMComponentTree=__webpack_require__(8),ReactInstrumentation=__webpack_require__(14),createMicrosoftUnsafeLocalFunction=__webpack_require__(62),setInnerHTML=__webpack_require__(44),setTextContent=__webpack_require__(122),insertChildAt=createMicrosoftUnsafeLocalFunction(function(parentNode,childNode,referenceNode){parentNode.insertBefore(childNode,referenceNode)}),dangerouslyReplaceNodeWithMarkup=Danger.dangerouslyReplaceNodeWithMarkup;"production"!==process.env.NODE_ENV&&(dangerouslyReplaceNodeWithMarkup=function(oldChild,markup,prevInstance){if(Danger.dangerouslyReplaceNodeWithMarkup(oldChild,markup),0!==prevInstance._debugID)ReactInstrumentation.debugTool.onHostOperation({instanceID:prevInstance._debugID,type:"replace with",payload:markup.toString()});else{var nextInstance=ReactDOMComponentTree.getInstanceFromNode(markup.node);0!==nextInstance._debugID&&ReactInstrumentation.debugTool.onHostOperation({instanceID:nextInstance._debugID,type:"mount",payload:markup.toString()})}});var DOMChildrenOperations={dangerouslyReplaceNodeWithMarkup:dangerouslyReplaceNodeWithMarkup,replaceDelimitedText:replaceDelimitedText,processUpdates:function(parentNode,updates){if("production"!==process.env.NODE_ENV)var parentNodeDebugID=ReactDOMComponentTree.getInstanceFromNode(parentNode)._debugID;for(var k=0;k<updates.length;k++){var update=updates[k];switch(update.type){case"INSERT_MARKUP":insertLazyTreeChildAt(parentNode,update.content,getNodeAfter(parentNode,update.afterNode)),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:parentNodeDebugID,type:"insert child",payload:{toIndex:update.toIndex,content:update.content.toString()}});break;case"MOVE_EXISTING":moveChild(parentNode,update.fromNode,getNodeAfter(parentNode,update.afterNode)),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:parentNodeDebugID,type:"move child",payload:{fromIndex:update.fromIndex,toIndex:update.toIndex}});break;case"SET_MARKUP":setInnerHTML(parentNode,update.content),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:parentNodeDebugID,type:"replace children",payload:update.content.toString()});break;case"TEXT_CONTENT":setTextContent(parentNode,update.content),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:parentNodeDebugID,type:"replace text",payload:update.content.toString()});break;case"REMOVE_NODE":removeChild(parentNode,update.fromNode),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:parentNodeDebugID,type:"remove child",payload:{fromIndex:update.fromIndex}})}}}};module.exports=DOMChildrenOperations}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var DOMNamespaces={html:"http://www.w3.org/1999/xhtml",mathml:"http://www.w3.org/1998/Math/MathML",svg:"http://www.w3.org/2000/svg"};module.exports=DOMNamespaces},function(module,exports,__webpack_require__){"use strict";(function(process){function isEndish(topLevelType){return"topMouseUp"===topLevelType||"topTouchEnd"===topLevelType||"topTouchCancel"===topLevelType}function isMoveish(topLevelType){return"topMouseMove"===topLevelType||"topTouchMove"===topLevelType}function isStartish(topLevelType){return"topMouseDown"===topLevelType||"topTouchStart"===topLevelType}function executeDispatch(event,simulated,listener,inst){var type=event.type||"unknown-event";event.currentTarget=EventPluginUtils.getNodeFromInstance(inst),simulated?ReactErrorUtils.invokeGuardedCallbackWithCatch(type,listener,event):ReactErrorUtils.invokeGuardedCallback(type,listener,event),event.currentTarget=null}function executeDispatchesInOrder(event,simulated){var dispatchListeners=event._dispatchListeners,dispatchInstances=event._dispatchInstances;if("production"!==process.env.NODE_ENV&&validateEventDispatches(event),Array.isArray(dispatchListeners))for(var i=0;i<dispatchListeners.length&&!event.isPropagationStopped();i++)executeDispatch(event,simulated,dispatchListeners[i],dispatchInstances[i]);else dispatchListeners&&executeDispatch(event,simulated,dispatchListeners,dispatchInstances);event._dispatchListeners=null,event._dispatchInstances=null}function executeDispatchesInOrderStopAtTrueImpl(event){var dispatchListeners=event._dispatchListeners,dispatchInstances=event._dispatchInstances;if("production"!==process.env.NODE_ENV&&validateEventDispatches(event),Array.isArray(dispatchListeners)){for(var i=0;i<dispatchListeners.length&&!event.isPropagationStopped();i++)if(dispatchListeners[i](event,dispatchInstances[i]))return dispatchInstances[i]}else if(dispatchListeners&&dispatchListeners(event,dispatchInstances))return dispatchInstances;return null}function executeDispatchesInOrderStopAtTrue(event){var ret=executeDispatchesInOrderStopAtTrueImpl(event);return event._dispatchInstances=null,event._dispatchListeners=null,ret}function executeDirectDispatch(event){"production"!==process.env.NODE_ENV&&validateEventDispatches(event);var dispatchListener=event._dispatchListeners,dispatchInstance=event._dispatchInstances;Array.isArray(dispatchListener)&&("production"!==process.env.NODE_ENV?invariant(!1,"executeDirectDispatch(...): Invalid `event`."):_prodInvariant("103")),event.currentTarget=dispatchListener?EventPluginUtils.getNodeFromInstance(dispatchInstance):null;var res=dispatchListener?dispatchListener(event):null;return event.currentTarget=null,event._dispatchListeners=null,event._dispatchInstances=null,res}function hasDispatches(event){return!!event._dispatchListeners}var ComponentTree,TreeTraversal,validateEventDispatches,_prodInvariant=__webpack_require__(4),ReactErrorUtils=__webpack_require__(60),invariant=__webpack_require__(1),warning=__webpack_require__(2),injection={injectComponentTree:function(Injected){ComponentTree=Injected,"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(Injected&&Injected.getNodeFromInstance&&Injected.getInstanceFromNode,"EventPluginUtils.injection.injectComponentTree(...): Injected module is missing getNodeFromInstance or getInstanceFromNode.")},injectTreeTraversal:function(Injected){TreeTraversal=Injected,"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(Injected&&Injected.isAncestor&&Injected.getLowestCommonAncestor,"EventPluginUtils.injection.injectTreeTraversal(...): Injected module is missing isAncestor or getLowestCommonAncestor.")}};"production"!==process.env.NODE_ENV&&(validateEventDispatches=function(event){var dispatchListeners=event._dispatchListeners,dispatchInstances=event._dispatchInstances,listenersIsArr=Array.isArray(dispatchListeners),listenersLen=listenersIsArr?dispatchListeners.length:dispatchListeners?1:0,instancesIsArr=Array.isArray(dispatchInstances),instancesLen=instancesIsArr?dispatchInstances.length:dispatchInstances?1:0;"production"!==process.env.NODE_ENV&&warning(instancesIsArr===listenersIsArr&&instancesLen===listenersLen,"EventPluginUtils: Invalid `event`.")});var EventPluginUtils={isEndish:isEndish,isMoveish:isMoveish,isStartish:isStartish,executeDirectDispatch:executeDirectDispatch,executeDispatchesInOrder:executeDispatchesInOrder,executeDispatchesInOrderStopAtTrue:executeDispatchesInOrderStopAtTrue,hasDispatches:hasDispatches,getInstanceFromNode:function(node){return ComponentTree.getInstanceFromNode(node)},getNodeFromInstance:function(node){return ComponentTree.getNodeFromInstance(node)},isAncestor:function(a,b){return TreeTraversal.isAncestor(a,b)},getLowestCommonAncestor:function(a,b){return TreeTraversal.getLowestCommonAncestor(a,b)},getParentInstance:function(inst){return TreeTraversal.getParentInstance(inst)},traverseTwoPhase:function(target,fn,arg){return TreeTraversal.traverseTwoPhase(target,fn,arg)},traverseEnterLeave:function(from,to,fn,argFrom,argTo){return TreeTraversal.traverseEnterLeave(from,to,fn,argFrom,argTo)},injection:injection};module.exports=EventPluginUtils}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function escape(key){var escaperLookup={"=":"=0",":":"=2"};return"$"+(""+key).replace(/[=:]/g,function(match){return escaperLookup[match]})}function unescape(key){var unescapeRegex=/(=0|=2)/g,unescaperLookup={"=0":"=","=2":":"};return(""+("."===key[0]&&"$"===key[1]?key.substring(2):key.substring(1))).replace(unescapeRegex,function(match){return unescaperLookup[match]})}var KeyEscapeUtils={escape:escape,unescape:unescape};module.exports=KeyEscapeUtils},function(module,exports,__webpack_require__){"use strict";(function(process){function _assertSingleLink(inputProps){null!=inputProps.checkedLink&&null!=inputProps.valueLink&&("production"!==process.env.NODE_ENV?invariant(!1,"Cannot provide a checkedLink and a valueLink. If you want to use checkedLink, you probably don't want to use valueLink and vice versa."):_prodInvariant("87"))}function _assertValueLink(inputProps){_assertSingleLink(inputProps),(null!=inputProps.value||null!=inputProps.onChange)&&("production"!==process.env.NODE_ENV?invariant(!1,"Cannot provide a valueLink and a value or onChange event. If you want to use value or onChange, you probably don't want to use valueLink."):_prodInvariant("88"))}function _assertCheckedLink(inputProps){_assertSingleLink(inputProps),(null!=inputProps.checked||null!=inputProps.onChange)&&("production"!==process.env.NODE_ENV?invariant(!1,"Cannot provide a checkedLink and a checked property or onChange event. If you want to use checked or onChange, you probably don't want to use checkedLink"):_prodInvariant("89"))}function getDeclarationErrorAddendum(owner){if(owner){var name=owner.getName();if(name)return" Check the render method of `"+name+"`."}return""}var _prodInvariant=__webpack_require__(4),ReactPropTypesSecret=__webpack_require__(113),propTypesFactory=__webpack_require__(100),React=__webpack_require__(28),PropTypes=propTypesFactory(React.isValidElement),invariant=__webpack_require__(1),warning=__webpack_require__(2),hasReadOnlyValue={button:!0,checkbox:!0,image:!0,hidden:!0,radio:!0,reset:!0,submit:!0},propTypes={value:function(props,propName,componentName){return!props[propName]||hasReadOnlyValue[props.type]||props.onChange||props.readOnly||props.disabled?null:new Error("You provided a `value` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultValue`. Otherwise, set either `onChange` or `readOnly`.")},checked:function(props,propName,componentName){return!props[propName]||props.onChange||props.readOnly||props.disabled?null:new Error("You provided a `checked` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultChecked`. Otherwise, set either `onChange` or `readOnly`.")},onChange:PropTypes.func},loggedTypeFailures={},LinkedValueUtils={checkPropTypes:function(tagName,props,owner){for(var propName in propTypes){if(propTypes.hasOwnProperty(propName))var error=propTypes[propName](props,propName,tagName,"prop",null,ReactPropTypesSecret);if(error instanceof Error&&!(error.message in loggedTypeFailures)){loggedTypeFailures[error.message]=!0;var addendum=getDeclarationErrorAddendum(owner);"production"!==process.env.NODE_ENV&&warning(!1,"Failed form propType: %s%s",error.message,addendum)}}},getValue:function(inputProps){return inputProps.valueLink?(_assertValueLink(inputProps),inputProps.valueLink.value):inputProps.value},getChecked:function(inputProps){return inputProps.checkedLink?(_assertCheckedLink(inputProps),inputProps.checkedLink.value):inputProps.checked},executeOnChange:function(inputProps,event){return inputProps.valueLink?(_assertValueLink(inputProps),inputProps.valueLink.requestChange(event.target.value)):inputProps.checkedLink?(_assertCheckedLink(inputProps),inputProps.checkedLink.requestChange(event.target.checked)):inputProps.onChange?inputProps.onChange.call(void 0,event):void 0}};module.exports=LinkedValueUtils}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),injected=!1,ReactComponentEnvironment={replaceNodeWithMarkup:null,processChildrenUpdates:null,injection:{injectEnvironment:function(environment){injected&&("production"!==process.env.NODE_ENV?invariant(!1,"ReactCompositeComponent: injectEnvironment() can only be called once."):_prodInvariant("104")),ReactComponentEnvironment.replaceNodeWithMarkup=environment.replaceNodeWithMarkup,ReactComponentEnvironment.processChildrenUpdates=environment.processChildrenUpdates,injected=!0}}};module.exports=ReactComponentEnvironment}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function invokeGuardedCallback(name,func,a){try{func(a)}catch(x){null===caughtError&&(caughtError=x)}}var caughtError=null,ReactErrorUtils={invokeGuardedCallback:invokeGuardedCallback,invokeGuardedCallbackWithCatch:invokeGuardedCallback,rethrowCaughtError:function(){if(caughtError){var error=caughtError;throw caughtError=null,error}}};if("production"!==process.env.NODE_ENV&&"undefined"!=typeof window&&"function"==typeof window.dispatchEvent&&"undefined"!=typeof document&&"function"==typeof document.createEvent){var fakeNode=document.createElement("react");ReactErrorUtils.invokeGuardedCallback=function(name,func,a){var boundFunc=func.bind(null,a),evtType="react-"+name;fakeNode.addEventListener(evtType,boundFunc,!1);var evt=document.createEvent("Event");evt.initEvent(evtType,!1,!1),fakeNode.dispatchEvent(evt),fakeNode.removeEventListener(evtType,boundFunc,!1)}}module.exports=ReactErrorUtils}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function enqueueUpdate(internalInstance){ReactUpdates.enqueueUpdate(internalInstance)}function formatUnexpectedArgument(arg){var type=typeof arg;if("object"!==type)return type;var displayName=arg.constructor&&arg.constructor.name||type,keys=Object.keys(arg);return keys.length>0&&keys.length<20?displayName+" (keys: "+keys.join(", ")+")":displayName}function getInternalInstanceReadyForUpdate(publicInstance,callerName){var internalInstance=ReactInstanceMap.get(publicInstance);if(!internalInstance){if("production"!==process.env.NODE_ENV){var ctor=publicInstance.constructor;"production"!==process.env.NODE_ENV&&warning(!callerName,"%s(...): Can only update a mounted or mounting component. This usually means you called %s() on an unmounted component. This is a no-op. Please check the code for the %s component.",callerName,callerName,ctor&&(ctor.displayName||ctor.name)||"ReactClass")}return null}return"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(null==ReactCurrentOwner.current,"%s(...): Cannot update during an existing state transition (such as within `render` or another component's constructor). Render methods should be a pure function of props and state; constructor side-effects are an anti-pattern, but can be moved to `componentWillMount`.",callerName),internalInstance}var _prodInvariant=__webpack_require__(4),ReactCurrentOwner=__webpack_require__(18),ReactInstanceMap=__webpack_require__(32),ReactInstrumentation=__webpack_require__(14),ReactUpdates=__webpack_require__(17),invariant=__webpack_require__(1),warning=__webpack_require__(2),ReactUpdateQueue={isMounted:function(publicInstance){if("production"!==process.env.NODE_ENV){var owner=ReactCurrentOwner.current;null!==owner&&("production"!==process.env.NODE_ENV&&warning(owner._warnedAboutRefsInRender,"%s is accessing isMounted inside its render() function. render() should be a pure function of props and state. It should never access something that requires stale data from the previous render, such as refs. Move this logic to componentDidMount and componentDidUpdate instead.",owner.getName()||"A component"),owner._warnedAboutRefsInRender=!0)}var internalInstance=ReactInstanceMap.get(publicInstance);return!!internalInstance&&!!internalInstance._renderedComponent},enqueueCallback:function(publicInstance,callback,callerName){ReactUpdateQueue.validateCallback(callback,callerName);var internalInstance=getInternalInstanceReadyForUpdate(publicInstance);if(!internalInstance)return null;internalInstance._pendingCallbacks?internalInstance._pendingCallbacks.push(callback):internalInstance._pendingCallbacks=[callback],enqueueUpdate(internalInstance)},enqueueCallbackInternal:function(internalInstance,callback){internalInstance._pendingCallbacks?internalInstance._pendingCallbacks.push(callback):internalInstance._pendingCallbacks=[callback],enqueueUpdate(internalInstance)},enqueueForceUpdate:function(publicInstance){var internalInstance=getInternalInstanceReadyForUpdate(publicInstance,"forceUpdate");internalInstance&&(internalInstance._pendingForceUpdate=!0,enqueueUpdate(internalInstance))},enqueueReplaceState:function(publicInstance,completeState,callback){var internalInstance=getInternalInstanceReadyForUpdate(publicInstance,"replaceState");internalInstance&&(internalInstance._pendingStateQueue=[completeState],internalInstance._pendingReplaceState=!0,void 0!==callback&&null!==callback&&(ReactUpdateQueue.validateCallback(callback,"replaceState"),internalInstance._pendingCallbacks?internalInstance._pendingCallbacks.push(callback):internalInstance._pendingCallbacks=[callback]),enqueueUpdate(internalInstance))},enqueueSetState:function(publicInstance,partialState){"production"!==process.env.NODE_ENV&&(ReactInstrumentation.debugTool.onSetState(),"production"!==process.env.NODE_ENV&&warning(null!=partialState,"setState(...): You passed an undefined or null state object; instead, use forceUpdate()."));var internalInstance=getInternalInstanceReadyForUpdate(publicInstance,"setState");if(internalInstance){(internalInstance._pendingStateQueue||(internalInstance._pendingStateQueue=[])).push(partialState),enqueueUpdate(internalInstance)}},enqueueElementInternal:function(internalInstance,nextElement,nextContext){internalInstance._pendingElement=nextElement,internalInstance._context=nextContext,enqueueUpdate(internalInstance)},validateCallback:function(callback,callerName){callback&&"function"!=typeof callback&&("production"!==process.env.NODE_ENV?invariant(!1,"%s(...): Expected the last optional `callback` argument to be a function. Instead received: %s.",callerName,formatUnexpectedArgument(callback)):_prodInvariant("122",callerName,formatUnexpectedArgument(callback)))}};module.exports=ReactUpdateQueue}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var createMicrosoftUnsafeLocalFunction=function(func){return"undefined"!=typeof MSApp&&MSApp.execUnsafeLocalFunction?function(arg0,arg1,arg2,arg3){MSApp.execUnsafeLocalFunction(function(){return func(arg0,arg1,arg2,arg3)})}:func};module.exports=createMicrosoftUnsafeLocalFunction},function(module,exports,__webpack_require__){"use strict";function getEventCharCode(nativeEvent){var charCode,keyCode=nativeEvent.keyCode;return"charCode"in nativeEvent?0===(charCode=nativeEvent.charCode)&&13===keyCode&&(charCode=13):charCode=keyCode,charCode>=32||13===charCode?charCode:0}module.exports=getEventCharCode},function(module,exports,__webpack_require__){"use strict";function modifierStateGetter(keyArg){var syntheticEvent=this,nativeEvent=syntheticEvent.nativeEvent;if(nativeEvent.getModifierState)return nativeEvent.getModifierState(keyArg);var keyProp=modifierKeyToProp[keyArg];return!!keyProp&&!!nativeEvent[keyProp]}function getEventModifierState(nativeEvent){return modifierStateGetter}var modifierKeyToProp={Alt:"altKey",Control:"ctrlKey",Meta:"metaKey",Shift:"shiftKey"};module.exports=getEventModifierState},function(module,exports,__webpack_require__){"use strict";function getEventTarget(nativeEvent){var target=nativeEvent.target||nativeEvent.srcElement||window;return target.correspondingUseElement&&(target=target.correspondingUseElement),3===target.nodeType?target.parentNode:target}module.exports=getEventTarget},function(module,exports,__webpack_require__){"use strict";/**
+var getOwnPropertySymbols=Object.getOwnPropertySymbols,hasOwnProperty=Object.prototype.hasOwnProperty,propIsEnumerable=Object.prototype.propertyIsEnumerable;module.exports=function(){try{if(!Object.assign)return!1;var test1=new String("abc");if(test1[5]="de","5"===Object.getOwnPropertyNames(test1)[0])return!1;for(var test2={},i=0;i<10;i++)test2["_"+String.fromCharCode(i)]=i;if("0123456789"!==Object.getOwnPropertyNames(test2).map(function(n){return test2[n]}).join(""))return!1;var test3={};return"abcdefghijklmnopqrst".split("").forEach(function(letter){test3[letter]=letter}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},test3)).join("")}catch(err){return!1}}()?Object.assign:function(target,source){for(var from,symbols,to=toObject(target),s=1;s<arguments.length;s++){from=Object(arguments[s]);for(var key in from)hasOwnProperty.call(from,key)&&(to[key]=from[key]);if(getOwnPropertySymbols){symbols=getOwnPropertySymbols(from);for(var i=0;i<symbols.length;i++)propIsEnumerable.call(from,symbols[i])&&(to[symbols[i]]=from[symbols[i]])}}return to}},function(module,exports,__webpack_require__){"use strict";var ReactCurrentOwner={current:null};module.exports=ReactCurrentOwner},function(module,exports,__webpack_require__){"use strict";(function(process){var canDefineProperty=!1;if("production"!==process.env.NODE_ENV)try{Object.defineProperty({},"x",{get:function(){}}),canDefineProperty=!0}catch(x){}module.exports=canDefineProperty}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyObject={};"production"!==process.env.NODE_ENV&&Object.freeze(emptyObject),module.exports=emptyObject}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function recomputePluginOrdering(){if(eventPluginOrder)for(var pluginName in namesToPlugins){var pluginModule=namesToPlugins[pluginName],pluginIndex=eventPluginOrder.indexOf(pluginName);if(pluginIndex>-1||("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginRegistry: Cannot inject event plugins that do not exist in the plugin ordering, `%s`.",pluginName):_prodInvariant("96",pluginName)),!EventPluginRegistry.plugins[pluginIndex]){pluginModule.extractEvents||("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginRegistry: Event plugins must implement an `extractEvents` method, but `%s` does not.",pluginName):_prodInvariant("97",pluginName)),EventPluginRegistry.plugins[pluginIndex]=pluginModule;var publishedEvents=pluginModule.eventTypes;for(var eventName in publishedEvents)publishEventForPlugin(publishedEvents[eventName],pluginModule,eventName)||("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginRegistry: Failed to publish event `%s` for plugin `%s`.",eventName,pluginName):_prodInvariant("98",eventName,pluginName))}}}function publishEventForPlugin(dispatchConfig,pluginModule,eventName){EventPluginRegistry.eventNameDispatchConfigs.hasOwnProperty(eventName)&&("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginHub: More than one plugin attempted to publish the same event name, `%s`.",eventName):_prodInvariant("99",eventName)),EventPluginRegistry.eventNameDispatchConfigs[eventName]=dispatchConfig;var phasedRegistrationNames=dispatchConfig.phasedRegistrationNames;if(phasedRegistrationNames){for(var phaseName in phasedRegistrationNames)if(phasedRegistrationNames.hasOwnProperty(phaseName)){var phasedRegistrationName=phasedRegistrationNames[phaseName];publishRegistrationName(phasedRegistrationName,pluginModule,eventName)}return!0}return!!dispatchConfig.registrationName&&(publishRegistrationName(dispatchConfig.registrationName,pluginModule,eventName),!0)}function publishRegistrationName(registrationName,pluginModule,eventName){if(EventPluginRegistry.registrationNameModules[registrationName]&&("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginHub: More than one plugin attempted to publish the same registration name, `%s`.",registrationName):_prodInvariant("100",registrationName)),EventPluginRegistry.registrationNameModules[registrationName]=pluginModule,EventPluginRegistry.registrationNameDependencies[registrationName]=pluginModule.eventTypes[eventName].dependencies,"production"!==process.env.NODE_ENV){var lowerCasedName=registrationName.toLowerCase();EventPluginRegistry.possibleRegistrationNames[lowerCasedName]=registrationName,"onDoubleClick"===registrationName&&(EventPluginRegistry.possibleRegistrationNames.ondblclick=registrationName)}}var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),eventPluginOrder=null,namesToPlugins={},EventPluginRegistry={plugins:[],eventNameDispatchConfigs:{},registrationNameModules:{},registrationNameDependencies:{},possibleRegistrationNames:"production"!==process.env.NODE_ENV?{}:null,injectEventPluginOrder:function(injectedEventPluginOrder){eventPluginOrder&&("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginRegistry: Cannot inject event plugin ordering more than once. You are likely trying to load more than one copy of React."):_prodInvariant("101")),eventPluginOrder=Array.prototype.slice.call(injectedEventPluginOrder),recomputePluginOrdering()},injectEventPluginsByName:function(injectedNamesToPlugins){var isOrderingDirty=!1;for(var pluginName in injectedNamesToPlugins)if(injectedNamesToPlugins.hasOwnProperty(pluginName)){var pluginModule=injectedNamesToPlugins[pluginName];namesToPlugins.hasOwnProperty(pluginName)&&namesToPlugins[pluginName]===pluginModule||(namesToPlugins[pluginName]&&("production"!==process.env.NODE_ENV?invariant(!1,"EventPluginRegistry: Cannot inject two different event plugins using the same name, `%s`.",pluginName):_prodInvariant("102",pluginName)),namesToPlugins[pluginName]=pluginModule,isOrderingDirty=!0)}isOrderingDirty&&recomputePluginOrdering()},getPluginModuleForEvent:function(event){var dispatchConfig=event.dispatchConfig;if(dispatchConfig.registrationName)return EventPluginRegistry.registrationNameModules[dispatchConfig.registrationName]||null;if(void 0!==dispatchConfig.phasedRegistrationNames){var phasedRegistrationNames=dispatchConfig.phasedRegistrationNames;for(var phase in phasedRegistrationNames)if(phasedRegistrationNames.hasOwnProperty(phase)){var pluginModule=EventPluginRegistry.registrationNameModules[phasedRegistrationNames[phase]];if(pluginModule)return pluginModule}}return null},_resetEventPlugins:function(){eventPluginOrder=null;for(var pluginName in namesToPlugins)namesToPlugins.hasOwnProperty(pluginName)&&delete namesToPlugins[pluginName];EventPluginRegistry.plugins.length=0;var eventNameDispatchConfigs=EventPluginRegistry.eventNameDispatchConfigs;for(var eventName in eventNameDispatchConfigs)eventNameDispatchConfigs.hasOwnProperty(eventName)&&delete eventNameDispatchConfigs[eventName];var registrationNameModules=EventPluginRegistry.registrationNameModules;for(var registrationName in registrationNameModules)registrationNameModules.hasOwnProperty(registrationName)&&delete registrationNameModules[registrationName];if("production"!==process.env.NODE_ENV){var possibleRegistrationNames=EventPluginRegistry.possibleRegistrationNames;for(var lowerCasedName in possibleRegistrationNames)possibleRegistrationNames.hasOwnProperty(lowerCasedName)&&delete possibleRegistrationNames[lowerCasedName]}}};module.exports=EventPluginRegistry}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function getListeningForDocument(mountAt){return Object.prototype.hasOwnProperty.call(mountAt,topListenersIDKey)||(mountAt[topListenersIDKey]=reactTopListenersCounter++,alreadyListeningTo[mountAt[topListenersIDKey]]={}),alreadyListeningTo[mountAt[topListenersIDKey]]}var hasEventPageXY,_assign=__webpack_require__(7),EventPluginRegistry=__webpack_require__(39),ReactEventEmitterMixin=__webpack_require__(260),ViewportMetrics=__webpack_require__(114),getVendorPrefixedEventName=__webpack_require__(295),isEventSupported=__webpack_require__(66),alreadyListeningTo={},isMonitoringScrollValue=!1,reactTopListenersCounter=0,topEventMapping={topAbort:"abort",topAnimationEnd:getVendorPrefixedEventName("animationend")||"animationend",topAnimationIteration:getVendorPrefixedEventName("animationiteration")||"animationiteration",topAnimationStart:getVendorPrefixedEventName("animationstart")||"animationstart",topBlur:"blur",topCanPlay:"canplay",topCanPlayThrough:"canplaythrough",topChange:"change",topClick:"click",topCompositionEnd:"compositionend",topCompositionStart:"compositionstart",topCompositionUpdate:"compositionupdate",topContextMenu:"contextmenu",topCopy:"copy",topCut:"cut",topDoubleClick:"dblclick",topDrag:"drag",topDragEnd:"dragend",topDragEnter:"dragenter",topDragExit:"dragexit",topDragLeave:"dragleave",topDragOver:"dragover",topDragStart:"dragstart",topDrop:"drop",topDurationChange:"durationchange",topEmptied:"emptied",topEncrypted:"encrypted",topEnded:"ended",topError:"error",topFocus:"focus",topInput:"input",topKeyDown:"keydown",topKeyPress:"keypress",topKeyUp:"keyup",topLoadedData:"loadeddata",topLoadedMetadata:"loadedmetadata",topLoadStart:"loadstart",topMouseDown:"mousedown",topMouseMove:"mousemove",topMouseOut:"mouseout",topMouseOver:"mouseover",topMouseUp:"mouseup",topPaste:"paste",topPause:"pause",topPlay:"play",topPlaying:"playing",topProgress:"progress",topRateChange:"ratechange",topScroll:"scroll",topSeeked:"seeked",topSeeking:"seeking",topSelectionChange:"selectionchange",topStalled:"stalled",topSuspend:"suspend",topTextInput:"textInput",topTimeUpdate:"timeupdate",topTouchCancel:"touchcancel",topTouchEnd:"touchend",topTouchMove:"touchmove",topTouchStart:"touchstart",topTransitionEnd:getVendorPrefixedEventName("transitionend")||"transitionend",topVolumeChange:"volumechange",topWaiting:"waiting",topWheel:"wheel"},topListenersIDKey="_reactListenersID"+String(Math.random()).slice(2),ReactBrowserEventEmitter=_assign({},ReactEventEmitterMixin,{ReactEventListener:null,injection:{injectReactEventListener:function(ReactEventListener){ReactEventListener.setHandleTopLevel(ReactBrowserEventEmitter.handleTopLevel),ReactBrowserEventEmitter.ReactEventListener=ReactEventListener}},setEnabled:function(enabled){ReactBrowserEventEmitter.ReactEventListener&&ReactBrowserEventEmitter.ReactEventListener.setEnabled(enabled)},isEnabled:function(){return!(!ReactBrowserEventEmitter.ReactEventListener||!ReactBrowserEventEmitter.ReactEventListener.isEnabled())},listenTo:function(registrationName,contentDocumentHandle){for(var mountAt=contentDocumentHandle,isListening=getListeningForDocument(mountAt),dependencies=EventPluginRegistry.registrationNameDependencies[registrationName],i=0;i<dependencies.length;i++){var dependency=dependencies[i];isListening.hasOwnProperty(dependency)&&isListening[dependency]||("topWheel"===dependency?isEventSupported("wheel")?ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent("topWheel","wheel",mountAt):isEventSupported("mousewheel")?ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent("topWheel","mousewheel",mountAt):ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent("topWheel","DOMMouseScroll",mountAt):"topScroll"===dependency?isEventSupported("scroll",!0)?ReactBrowserEventEmitter.ReactEventListener.trapCapturedEvent("topScroll","scroll",mountAt):ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent("topScroll","scroll",ReactBrowserEventEmitter.ReactEventListener.WINDOW_HANDLE):"topFocus"===dependency||"topBlur"===dependency?(isEventSupported("focus",!0)?(ReactBrowserEventEmitter.ReactEventListener.trapCapturedEvent("topFocus","focus",mountAt),ReactBrowserEventEmitter.ReactEventListener.trapCapturedEvent("topBlur","blur",mountAt)):isEventSupported("focusin")&&(ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent("topFocus","focusin",mountAt),ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent("topBlur","focusout",mountAt)),isListening.topBlur=!0,isListening.topFocus=!0):topEventMapping.hasOwnProperty(dependency)&&ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent(dependency,topEventMapping[dependency],mountAt),isListening[dependency]=!0)}},trapBubbledEvent:function(topLevelType,handlerBaseName,handle){return ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent(topLevelType,handlerBaseName,handle)},trapCapturedEvent:function(topLevelType,handlerBaseName,handle){return ReactBrowserEventEmitter.ReactEventListener.trapCapturedEvent(topLevelType,handlerBaseName,handle)},supportsEventPageXY:function(){if(!document.createEvent)return!1;var ev=document.createEvent("MouseEvent");return null!=ev&&"pageX"in ev},ensureScrollValueMonitoring:function(){if(void 0===hasEventPageXY&&(hasEventPageXY=ReactBrowserEventEmitter.supportsEventPageXY()),!hasEventPageXY&&!isMonitoringScrollValue){var refresh=ViewportMetrics.refreshScrollValues;ReactBrowserEventEmitter.ReactEventListener.monitorScrollValue(refresh),isMonitoringScrollValue=!0}}});module.exports=ReactBrowserEventEmitter},function(module,exports,__webpack_require__){"use strict";function SyntheticMouseEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticUIEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticUIEvent=__webpack_require__(33),ViewportMetrics=__webpack_require__(114),getEventModifierState=__webpack_require__(64),MouseEventInterface={screenX:null,screenY:null,clientX:null,clientY:null,ctrlKey:null,shiftKey:null,altKey:null,metaKey:null,getModifierState:getEventModifierState,button:function(event){var button=event.button;return"which"in event?button:2===button?2:4===button?1:0},buttons:null,relatedTarget:function(event){return event.relatedTarget||(event.fromElement===event.srcElement?event.toElement:event.fromElement)},pageX:function(event){return"pageX"in event?event.pageX:event.clientX+ViewportMetrics.currentScrollLeft},pageY:function(event){return"pageY"in event?event.pageY:event.clientY+ViewportMetrics.currentScrollTop}};SyntheticUIEvent.augmentClass(SyntheticMouseEvent,MouseEventInterface),module.exports=SyntheticMouseEvent},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),OBSERVED_ERROR={},TransactionImpl={reinitializeTransaction:function(){this.transactionWrappers=this.getTransactionWrappers(),this.wrapperInitData?this.wrapperInitData.length=0:this.wrapperInitData=[],this._isInTransaction=!1},_isInTransaction:!1,getTransactionWrappers:null,isInTransaction:function(){return!!this._isInTransaction},perform:function(method,scope,a,b,c,d,e,f){this.isInTransaction()&&("production"!==process.env.NODE_ENV?invariant(!1,"Transaction.perform(...): Cannot initialize a transaction when there is already an outstanding transaction."):_prodInvariant("27"));var errorThrown,ret;try{this._isInTransaction=!0,errorThrown=!0,this.initializeAll(0),ret=method.call(scope,a,b,c,d,e,f),errorThrown=!1}finally{try{if(errorThrown)try{this.closeAll(0)}catch(err){}else this.closeAll(0)}finally{this._isInTransaction=!1}}return ret},initializeAll:function(startIndex){for(var transactionWrappers=this.transactionWrappers,i=startIndex;i<transactionWrappers.length;i++){var wrapper=transactionWrappers[i];try{this.wrapperInitData[i]=OBSERVED_ERROR,this.wrapperInitData[i]=wrapper.initialize?wrapper.initialize.call(this):null}finally{if(this.wrapperInitData[i]===OBSERVED_ERROR)try{this.initializeAll(i+1)}catch(err){}}}},closeAll:function(startIndex){this.isInTransaction()||("production"!==process.env.NODE_ENV?invariant(!1,"Transaction.closeAll(): Cannot close transaction when none are open."):_prodInvariant("28"));for(var transactionWrappers=this.transactionWrappers,i=startIndex;i<transactionWrappers.length;i++){var errorThrown,wrapper=transactionWrappers[i],initData=this.wrapperInitData[i];try{errorThrown=!0,initData!==OBSERVED_ERROR&&wrapper.close&&wrapper.close.call(this,initData),errorThrown=!1}finally{if(errorThrown)try{this.closeAll(i+1)}catch(e){}}}this.wrapperInitData.length=0}};module.exports=TransactionImpl}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function escapeHtml(string){var str=""+string,match=matchHtmlRegExp.exec(str);if(!match)return str;var escape,html="",index=0,lastIndex=0;for(index=match.index;index<str.length;index++){switch(str.charCodeAt(index)){case 34:escape="&quot;";break;case 38:escape="&amp;";break;case 39:escape="&#x27;";break;case 60:escape="&lt;";break;case 62:escape="&gt;";break;default:continue}lastIndex!==index&&(html+=str.substring(lastIndex,index)),lastIndex=index+1,html+=escape}return lastIndex!==index?html+str.substring(lastIndex,index):html}function escapeTextContentForBrowser(text){return"boolean"==typeof text||"number"==typeof text?""+text:escapeHtml(text)}var matchHtmlRegExp=/["'&<>]/;module.exports=escapeTextContentForBrowser},function(module,exports,__webpack_require__){"use strict";var reusableSVGContainer,ExecutionEnvironment=__webpack_require__(9),DOMNamespaces=__webpack_require__(55),WHITESPACE_TEST=/^[ \r\n\t\f]/,NONVISIBLE_TEST=/<(!--|link|noscript|meta|script|style)[ \r\n\t\f\/>]/,createMicrosoftUnsafeLocalFunction=__webpack_require__(62),setInnerHTML=createMicrosoftUnsafeLocalFunction(function(node,html){if(node.namespaceURI!==DOMNamespaces.svg||"innerHTML"in node)node.innerHTML=html;else{reusableSVGContainer=reusableSVGContainer||document.createElement("div"),reusableSVGContainer.innerHTML="<svg>"+html+"</svg>";for(var svgNode=reusableSVGContainer.firstChild;svgNode.firstChild;)node.appendChild(svgNode.firstChild)}});if(ExecutionEnvironment.canUseDOM){var testElement=document.createElement("div");testElement.innerHTML=" ",""===testElement.innerHTML&&(setInnerHTML=function(node,html){if(node.parentNode&&node.parentNode.replaceChild(node,node),WHITESPACE_TEST.test(html)||"<"===html[0]&&NONVISIBLE_TEST.test(html)){node.innerHTML=String.fromCharCode(65279)+html;var textNode=node.firstChild;1===textNode.data.length?node.removeChild(textNode):textNode.deleteData(0,1)}else node.innerHTML=html}),testElement=null}module.exports=setInnerHTML},function(module,exports,__webpack_require__){"use strict";(function(process){var canDefineProperty=!1;if("production"!==process.env.NODE_ENV)try{Object.defineProperty({},"x",{get:function(){}}),canDefineProperty=!0}catch(x){}module.exports=canDefineProperty}).call(exports,__webpack_require__(0))},function(module,exports){var g;g=function(){return this}();try{g=g||Function("return this")()||(0,eval)("this")}catch(e){"object"==typeof window&&(g=window)}module.exports=g},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.FormLabel=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),FormLabel=exports.FormLabel=function(_React$PureComponent){function FormLabel(){return _classCallCheck(this,FormLabel),_possibleConstructorReturn(this,(FormLabel.__proto__||Object.getPrototypeOf(FormLabel)).apply(this,arguments))}return _inherits(FormLabel,_React$PureComponent),_createClass(FormLabel,[{key:"errorMessage",value:function(){if(this.props.errorMessage)return _react2.default.createElement("span",{className:"ds-c-field__hint ds-u-color--error",id:this.props.fieldId+"-message",role:"alert"},this.props.errorMessage)}},{key:"hint",value:function(){if(this.props.hint){var classes=(0,_classnames2.default)("ds-c-field__hint",{"ds-c-field__hint--inverse":this.props.inversed});return _react2.default.createElement("span",{className:classes},this.props.hint)}}},{key:"render",value:function(){var ComponentType=this.props.component,labelTextClasses=this.props.errorMessage&&"ds-u-font-weight--bold",classes=(0,_classnames2.default)("ds-c-label",this.props.className);return _react2.default.createElement(ComponentType,{className:classes,htmlFor:this.props.fieldId},_react2.default.createElement("span",{className:labelTextClasses},this.props.children),this.errorMessage(),this.hint())}}]),FormLabel}(_react2.default.PureComponent);FormLabel.defaultProps={component:"label"},FormLabel.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,component:_propTypes2.default.oneOf(["label","legend"]),errorMessage:_propTypes2.default.string,fieldId:_propTypes2.default.string,hint:_propTypes2.default.node,inversed:_propTypes2.default.bool},exports.default=FormLabel},function(module,exports,__webpack_require__){"use strict";module.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(module,exports,__webpack_require__){"use strict";(function(process){function isNative(fn){var funcToString=Function.prototype.toString,hasOwnProperty=Object.prototype.hasOwnProperty,reIsNative=RegExp("^"+funcToString.call(hasOwnProperty).replace(/[\\^$.*+?()[\]{}|]/g,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$");try{var source=funcToString.call(fn);return reIsNative.test(source)}catch(err){return!1}}function purgeDeep(id){var item=getItem(id);if(item){var childIDs=item.childIDs;removeItem(id),childIDs.forEach(purgeDeep)}}function describeComponentFrame(name,source,ownerName){return"\n    in "+(name||"Unknown")+(source?" (at "+source.fileName.replace(/^.*[\\\/]/,"")+":"+source.lineNumber+")":ownerName?" (created by "+ownerName+")":"")}function getDisplayName(element){return null==element?"#empty":"string"==typeof element||"number"==typeof element?"#text":"string"==typeof element.type?element.type:element.type.displayName||element.type.name||"Unknown"}function describeID(id){var ownerName,name=ReactComponentTreeHook.getDisplayName(id),element=ReactComponentTreeHook.getElement(id),ownerID=ReactComponentTreeHook.getOwnerID(id);return ownerID&&(ownerName=ReactComponentTreeHook.getDisplayName(ownerID)),"production"!==process.env.NODE_ENV&&warning(element,"ReactComponentTreeHook: Missing React element for debugID %s when building stack",id),describeComponentFrame(name,element&&element._source,ownerName)}var setItem,getItem,removeItem,getItemIDs,addRoot,removeRoot,getRootIDs,_prodInvariant=__webpack_require__(25),ReactCurrentOwner=__webpack_require__(36),invariant=__webpack_require__(15),warning=__webpack_require__(19),canUseCollections="function"==typeof Array.from&&"function"==typeof Map&&isNative(Map)&&null!=Map.prototype&&"function"==typeof Map.prototype.keys&&isNative(Map.prototype.keys)&&"function"==typeof Set&&isNative(Set)&&null!=Set.prototype&&"function"==typeof Set.prototype.keys&&isNative(Set.prototype.keys);if(canUseCollections){var itemMap=new Map,rootIDSet=new Set;setItem=function(id,item){itemMap.set(id,item)},getItem=function(id){return itemMap.get(id)},removeItem=function(id){itemMap.delete(id)},getItemIDs=function(){return Array.from(itemMap.keys())},addRoot=function(id){rootIDSet.add(id)},removeRoot=function(id){rootIDSet.delete(id)},getRootIDs=function(){return Array.from(rootIDSet.keys())}}else{var itemByKey={},rootByKey={},getKeyFromID=function(id){return"."+id},getIDFromKey=function(key){return parseInt(key.substr(1),10)};setItem=function(id,item){var key=getKeyFromID(id);itemByKey[key]=item},getItem=function(id){var key=getKeyFromID(id);return itemByKey[key]},removeItem=function(id){var key=getKeyFromID(id);delete itemByKey[key]},getItemIDs=function(){return Object.keys(itemByKey).map(getIDFromKey)},addRoot=function(id){var key=getKeyFromID(id);rootByKey[key]=!0},removeRoot=function(id){var key=getKeyFromID(id);delete rootByKey[key]},getRootIDs=function(){return Object.keys(rootByKey).map(getIDFromKey)}}var unmountedIDs=[],ReactComponentTreeHook={onSetChildren:function(id,nextChildIDs){var item=getItem(id);item||("production"!==process.env.NODE_ENV?invariant(!1,"Item must have been set"):_prodInvariant("144")),item.childIDs=nextChildIDs;for(var i=0;i<nextChildIDs.length;i++){var nextChildID=nextChildIDs[i],nextChild=getItem(nextChildID);nextChild||("production"!==process.env.NODE_ENV?invariant(!1,"Expected hook events to fire for the child before its parent includes it in onSetChildren()."):_prodInvariant("140")),null==nextChild.childIDs&&"object"==typeof nextChild.element&&null!=nextChild.element&&("production"!==process.env.NODE_ENV?invariant(!1,"Expected onSetChildren() to fire for a container child before its parent includes it in onSetChildren()."):_prodInvariant("141")),nextChild.isMounted||("production"!==process.env.NODE_ENV?invariant(!1,"Expected onMountComponent() to fire for the child before its parent includes it in onSetChildren()."):_prodInvariant("71")),null==nextChild.parentID&&(nextChild.parentID=id),nextChild.parentID!==id&&("production"!==process.env.NODE_ENV?invariant(!1,"Expected onBeforeMountComponent() parent and onSetChildren() to be consistent (%s has parents %s and %s).",nextChildID,nextChild.parentID,id):_prodInvariant("142",nextChildID,nextChild.parentID,id))}},onBeforeMountComponent:function(id,element,parentID){setItem(id,{element:element,parentID:parentID,text:null,childIDs:[],isMounted:!1,updateCount:0})},onBeforeUpdateComponent:function(id,element){var item=getItem(id);item&&item.isMounted&&(item.element=element)},onMountComponent:function(id){var item=getItem(id);item||("production"!==process.env.NODE_ENV?invariant(!1,"Item must have been set"):_prodInvariant("144")),item.isMounted=!0,0===item.parentID&&addRoot(id)},onUpdateComponent:function(id){var item=getItem(id);item&&item.isMounted&&item.updateCount++},onUnmountComponent:function(id){var item=getItem(id);if(item){item.isMounted=!1;0===item.parentID&&removeRoot(id)}unmountedIDs.push(id)},purgeUnmountedComponents:function(){if(!ReactComponentTreeHook._preventPurging){for(var i=0;i<unmountedIDs.length;i++){purgeDeep(unmountedIDs[i])}unmountedIDs.length=0}},isMounted:function(id){var item=getItem(id);return!!item&&item.isMounted},getCurrentStackAddendum:function(topElement){var info="";if(topElement){var name=getDisplayName(topElement),owner=topElement._owner;info+=describeComponentFrame(name,topElement._source,owner&&owner.getName())}var currentOwner=ReactCurrentOwner.current,id=currentOwner&&currentOwner._debugID;return info+=ReactComponentTreeHook.getStackAddendumByID(id)},getStackAddendumByID:function(id){for(var info="";id;)info+=describeID(id),id=ReactComponentTreeHook.getParentID(id);return info},getChildIDs:function(id){var item=getItem(id);return item?item.childIDs:[]},getDisplayName:function(id){var element=ReactComponentTreeHook.getElement(id);return element?getDisplayName(element):null},getElement:function(id){var item=getItem(id);return item?item.element:null},getOwnerID:function(id){var element=ReactComponentTreeHook.getElement(id);return element&&element._owner?element._owner._debugID:null},getParentID:function(id){var item=getItem(id);return item?item.parentID:null},getSource:function(id){var item=getItem(id),element=item?item.element:null;return null!=element?element._source:null},getText:function(id){var element=ReactComponentTreeHook.getElement(id);return"string"==typeof element?element:"number"==typeof element?""+element:null},getUpdateCount:function(id){var item=getItem(id);return item?item.updateCount:0},getRootIDs:getRootIDs,getRegisteredIDs:getItemIDs,pushNonStandardWarningStack:function(isCreatingElement,currentSource){if("function"==typeof console.reactStack){var stack=[],currentOwner=ReactCurrentOwner.current,id=currentOwner&&currentOwner._debugID;try{for(isCreatingElement&&stack.push({name:id?ReactComponentTreeHook.getDisplayName(id):null,fileName:currentSource?currentSource.fileName:null,lineNumber:currentSource?currentSource.lineNumber:null});id;){var element=ReactComponentTreeHook.getElement(id),parentID=ReactComponentTreeHook.getParentID(id),ownerID=ReactComponentTreeHook.getOwnerID(id),ownerName=ownerID?ReactComponentTreeHook.getDisplayName(ownerID):null,source=element&&element._source;stack.push({name:ownerName,fileName:source?source.fileName:null,lineNumber:source?source.lineNumber:null}),id=parentID}}catch(err){}}},popNonStandardWarningStack:function(){console.reactStackEnd}};module.exports=ReactComponentTreeHook}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var lowPriorityWarning=function(){};if("production"!==process.env.NODE_ENV){var printWarning=function(format){for(var _len=arguments.length,args=Array(_len>1?_len-1:0),_key=1;_key<_len;_key++)args[_key-1]=arguments[_key];var argIndex=0,message="Warning: "+format.replace(/%s/g,function(){return args[argIndex++]});try{throw new Error(message)}catch(x){}};lowPriorityWarning=function(condition,format){if(void 0===format)throw new Error("`warning(condition, format, ...args)` requires a warning message argument");if(!condition){for(var _len2=arguments.length,args=Array(_len2>2?_len2-2:0),_key2=2;_key2<_len2;_key2++)args[_key2-2]=arguments[_key2];printWarning.apply(void 0,[format].concat(args))}}}module.exports=lowPriorityWarning}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function is(x,y){return x===y?0!==x||0!==y||1/x==1/y:x!==x&&y!==y}function shallowEqual(objA,objB){if(is(objA,objB))return!0;if("object"!=typeof objA||null===objA||"object"!=typeof objB||null===objB)return!1;var keysA=Object.keys(objA),keysB=Object.keys(objB);if(keysA.length!==keysB.length)return!1;for(var i=0;i<keysA.length;i++)if(!hasOwnProperty.call(objB,keysA[i])||!is(objA[keysA[i]],objB[keysA[i]]))return!1;return!0}var hasOwnProperty=Object.prototype.hasOwnProperty;module.exports=shallowEqual},function(module,exports){function isObject(value){var type=typeof value;return null!=value&&("object"==type||"function"==type)}module.exports=isObject},function(module,exports,__webpack_require__){"use strict";module.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(module,exports,__webpack_require__){"use strict";(function(process){function getNodeAfter(parentNode,node){return Array.isArray(node)&&(node=node[1]),node?node.nextSibling:parentNode.firstChild}function insertLazyTreeChildAt(parentNode,childTree,referenceNode){DOMLazyTree.insertTreeBefore(parentNode,childTree,referenceNode)}function moveChild(parentNode,childNode,referenceNode){Array.isArray(childNode)?moveDelimitedText(parentNode,childNode[0],childNode[1],referenceNode):insertChildAt(parentNode,childNode,referenceNode)}function removeChild(parentNode,childNode){if(Array.isArray(childNode)){var closingComment=childNode[1];childNode=childNode[0],removeDelimitedText(parentNode,childNode,closingComment),parentNode.removeChild(closingComment)}parentNode.removeChild(childNode)}function moveDelimitedText(parentNode,openingComment,closingComment,referenceNode){for(var node=openingComment;;){var nextNode=node.nextSibling;if(insertChildAt(parentNode,node,referenceNode),node===closingComment)break;node=nextNode}}function removeDelimitedText(parentNode,startNode,closingComment){for(;;){var node=startNode.nextSibling;if(node===closingComment)break;parentNode.removeChild(node)}}function replaceDelimitedText(openingComment,closingComment,stringText){var parentNode=openingComment.parentNode,nodeAfterComment=openingComment.nextSibling;nodeAfterComment===closingComment?stringText&&insertChildAt(parentNode,document.createTextNode(stringText),nodeAfterComment):stringText?(setTextContent(nodeAfterComment,stringText),removeDelimitedText(parentNode,nodeAfterComment,closingComment)):removeDelimitedText(parentNode,openingComment,closingComment),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:ReactDOMComponentTree.getInstanceFromNode(openingComment)._debugID,type:"replace text",payload:stringText})}var DOMLazyTree=__webpack_require__(26),Danger=__webpack_require__(233),ReactDOMComponentTree=__webpack_require__(8),ReactInstrumentation=__webpack_require__(14),createMicrosoftUnsafeLocalFunction=__webpack_require__(62),setInnerHTML=__webpack_require__(44),setTextContent=__webpack_require__(122),insertChildAt=createMicrosoftUnsafeLocalFunction(function(parentNode,childNode,referenceNode){parentNode.insertBefore(childNode,referenceNode)}),dangerouslyReplaceNodeWithMarkup=Danger.dangerouslyReplaceNodeWithMarkup;"production"!==process.env.NODE_ENV&&(dangerouslyReplaceNodeWithMarkup=function(oldChild,markup,prevInstance){if(Danger.dangerouslyReplaceNodeWithMarkup(oldChild,markup),0!==prevInstance._debugID)ReactInstrumentation.debugTool.onHostOperation({instanceID:prevInstance._debugID,type:"replace with",payload:markup.toString()});else{var nextInstance=ReactDOMComponentTree.getInstanceFromNode(markup.node);0!==nextInstance._debugID&&ReactInstrumentation.debugTool.onHostOperation({instanceID:nextInstance._debugID,type:"mount",payload:markup.toString()})}});var DOMChildrenOperations={dangerouslyReplaceNodeWithMarkup:dangerouslyReplaceNodeWithMarkup,replaceDelimitedText:replaceDelimitedText,processUpdates:function(parentNode,updates){if("production"!==process.env.NODE_ENV)var parentNodeDebugID=ReactDOMComponentTree.getInstanceFromNode(parentNode)._debugID;for(var k=0;k<updates.length;k++){var update=updates[k];switch(update.type){case"INSERT_MARKUP":insertLazyTreeChildAt(parentNode,update.content,getNodeAfter(parentNode,update.afterNode)),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:parentNodeDebugID,type:"insert child",payload:{toIndex:update.toIndex,content:update.content.toString()}});break;case"MOVE_EXISTING":moveChild(parentNode,update.fromNode,getNodeAfter(parentNode,update.afterNode)),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:parentNodeDebugID,type:"move child",payload:{fromIndex:update.fromIndex,toIndex:update.toIndex}});break;case"SET_MARKUP":setInnerHTML(parentNode,update.content),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:parentNodeDebugID,type:"replace children",payload:update.content.toString()});break;case"TEXT_CONTENT":setTextContent(parentNode,update.content),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:parentNodeDebugID,type:"replace text",payload:update.content.toString()});break;case"REMOVE_NODE":removeChild(parentNode,update.fromNode),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:parentNodeDebugID,type:"remove child",payload:{fromIndex:update.fromIndex}})}}}};module.exports=DOMChildrenOperations}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var DOMNamespaces={html:"http://www.w3.org/1999/xhtml",mathml:"http://www.w3.org/1998/Math/MathML",svg:"http://www.w3.org/2000/svg"};module.exports=DOMNamespaces},function(module,exports,__webpack_require__){"use strict";(function(process){function isEndish(topLevelType){return"topMouseUp"===topLevelType||"topTouchEnd"===topLevelType||"topTouchCancel"===topLevelType}function isMoveish(topLevelType){return"topMouseMove"===topLevelType||"topTouchMove"===topLevelType}function isStartish(topLevelType){return"topMouseDown"===topLevelType||"topTouchStart"===topLevelType}function executeDispatch(event,simulated,listener,inst){var type=event.type||"unknown-event";event.currentTarget=EventPluginUtils.getNodeFromInstance(inst),simulated?ReactErrorUtils.invokeGuardedCallbackWithCatch(type,listener,event):ReactErrorUtils.invokeGuardedCallback(type,listener,event),event.currentTarget=null}function executeDispatchesInOrder(event,simulated){var dispatchListeners=event._dispatchListeners,dispatchInstances=event._dispatchInstances;if("production"!==process.env.NODE_ENV&&validateEventDispatches(event),Array.isArray(dispatchListeners))for(var i=0;i<dispatchListeners.length&&!event.isPropagationStopped();i++)executeDispatch(event,simulated,dispatchListeners[i],dispatchInstances[i]);else dispatchListeners&&executeDispatch(event,simulated,dispatchListeners,dispatchInstances);event._dispatchListeners=null,event._dispatchInstances=null}function executeDispatchesInOrderStopAtTrueImpl(event){var dispatchListeners=event._dispatchListeners,dispatchInstances=event._dispatchInstances;if("production"!==process.env.NODE_ENV&&validateEventDispatches(event),Array.isArray(dispatchListeners)){for(var i=0;i<dispatchListeners.length&&!event.isPropagationStopped();i++)if(dispatchListeners[i](event,dispatchInstances[i]))return dispatchInstances[i]}else if(dispatchListeners&&dispatchListeners(event,dispatchInstances))return dispatchInstances;return null}function executeDispatchesInOrderStopAtTrue(event){var ret=executeDispatchesInOrderStopAtTrueImpl(event);return event._dispatchInstances=null,event._dispatchListeners=null,ret}function executeDirectDispatch(event){"production"!==process.env.NODE_ENV&&validateEventDispatches(event);var dispatchListener=event._dispatchListeners,dispatchInstance=event._dispatchInstances;Array.isArray(dispatchListener)&&("production"!==process.env.NODE_ENV?invariant(!1,"executeDirectDispatch(...): Invalid `event`."):_prodInvariant("103")),event.currentTarget=dispatchListener?EventPluginUtils.getNodeFromInstance(dispatchInstance):null;var res=dispatchListener?dispatchListener(event):null;return event.currentTarget=null,event._dispatchListeners=null,event._dispatchInstances=null,res}function hasDispatches(event){return!!event._dispatchListeners}var ComponentTree,TreeTraversal,validateEventDispatches,_prodInvariant=__webpack_require__(4),ReactErrorUtils=__webpack_require__(60),invariant=__webpack_require__(1),warning=__webpack_require__(2),injection={injectComponentTree:function(Injected){ComponentTree=Injected,"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(Injected&&Injected.getNodeFromInstance&&Injected.getInstanceFromNode,"EventPluginUtils.injection.injectComponentTree(...): Injected module is missing getNodeFromInstance or getInstanceFromNode.")},injectTreeTraversal:function(Injected){TreeTraversal=Injected,"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(Injected&&Injected.isAncestor&&Injected.getLowestCommonAncestor,"EventPluginUtils.injection.injectTreeTraversal(...): Injected module is missing isAncestor or getLowestCommonAncestor.")}};"production"!==process.env.NODE_ENV&&(validateEventDispatches=function(event){var dispatchListeners=event._dispatchListeners,dispatchInstances=event._dispatchInstances,listenersIsArr=Array.isArray(dispatchListeners),listenersLen=listenersIsArr?dispatchListeners.length:dispatchListeners?1:0,instancesIsArr=Array.isArray(dispatchInstances),instancesLen=instancesIsArr?dispatchInstances.length:dispatchInstances?1:0;"production"!==process.env.NODE_ENV&&warning(instancesIsArr===listenersIsArr&&instancesLen===listenersLen,"EventPluginUtils: Invalid `event`.")});var EventPluginUtils={isEndish:isEndish,isMoveish:isMoveish,isStartish:isStartish,executeDirectDispatch:executeDirectDispatch,executeDispatchesInOrder:executeDispatchesInOrder,executeDispatchesInOrderStopAtTrue:executeDispatchesInOrderStopAtTrue,hasDispatches:hasDispatches,getInstanceFromNode:function(node){return ComponentTree.getInstanceFromNode(node)},getNodeFromInstance:function(node){return ComponentTree.getNodeFromInstance(node)},isAncestor:function(a,b){return TreeTraversal.isAncestor(a,b)},getLowestCommonAncestor:function(a,b){return TreeTraversal.getLowestCommonAncestor(a,b)},getParentInstance:function(inst){return TreeTraversal.getParentInstance(inst)},traverseTwoPhase:function(target,fn,arg){return TreeTraversal.traverseTwoPhase(target,fn,arg)},traverseEnterLeave:function(from,to,fn,argFrom,argTo){return TreeTraversal.traverseEnterLeave(from,to,fn,argFrom,argTo)},injection:injection};module.exports=EventPluginUtils}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function escape(key){var escaperLookup={"=":"=0",":":"=2"};return"$"+(""+key).replace(/[=:]/g,function(match){return escaperLookup[match]})}function unescape(key){var unescapeRegex=/(=0|=2)/g,unescaperLookup={"=0":"=","=2":":"};return(""+("."===key[0]&&"$"===key[1]?key.substring(2):key.substring(1))).replace(unescapeRegex,function(match){return unescaperLookup[match]})}var KeyEscapeUtils={escape:escape,unescape:unescape};module.exports=KeyEscapeUtils},function(module,exports,__webpack_require__){"use strict";(function(process){function _assertSingleLink(inputProps){null!=inputProps.checkedLink&&null!=inputProps.valueLink&&("production"!==process.env.NODE_ENV?invariant(!1,"Cannot provide a checkedLink and a valueLink. If you want to use checkedLink, you probably don't want to use valueLink and vice versa."):_prodInvariant("87"))}function _assertValueLink(inputProps){_assertSingleLink(inputProps),(null!=inputProps.value||null!=inputProps.onChange)&&("production"!==process.env.NODE_ENV?invariant(!1,"Cannot provide a valueLink and a value or onChange event. If you want to use value or onChange, you probably don't want to use valueLink."):_prodInvariant("88"))}function _assertCheckedLink(inputProps){_assertSingleLink(inputProps),(null!=inputProps.checked||null!=inputProps.onChange)&&("production"!==process.env.NODE_ENV?invariant(!1,"Cannot provide a checkedLink and a checked property or onChange event. If you want to use checked or onChange, you probably don't want to use checkedLink"):_prodInvariant("89"))}function getDeclarationErrorAddendum(owner){if(owner){var name=owner.getName();if(name)return" Check the render method of `"+name+"`."}return""}var _prodInvariant=__webpack_require__(4),ReactPropTypesSecret=__webpack_require__(113),propTypesFactory=__webpack_require__(100),React=__webpack_require__(28),PropTypes=propTypesFactory(React.isValidElement),invariant=__webpack_require__(1),warning=__webpack_require__(2),hasReadOnlyValue={button:!0,checkbox:!0,image:!0,hidden:!0,radio:!0,reset:!0,submit:!0},propTypes={value:function(props,propName,componentName){return!props[propName]||hasReadOnlyValue[props.type]||props.onChange||props.readOnly||props.disabled?null:new Error("You provided a `value` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultValue`. Otherwise, set either `onChange` or `readOnly`.")},checked:function(props,propName,componentName){return!props[propName]||props.onChange||props.readOnly||props.disabled?null:new Error("You provided a `checked` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultChecked`. Otherwise, set either `onChange` or `readOnly`.")},onChange:PropTypes.func},loggedTypeFailures={},LinkedValueUtils={checkPropTypes:function(tagName,props,owner){for(var propName in propTypes){if(propTypes.hasOwnProperty(propName))var error=propTypes[propName](props,propName,tagName,"prop",null,ReactPropTypesSecret);if(error instanceof Error&&!(error.message in loggedTypeFailures)){loggedTypeFailures[error.message]=!0;var addendum=getDeclarationErrorAddendum(owner);"production"!==process.env.NODE_ENV&&warning(!1,"Failed form propType: %s%s",error.message,addendum)}}},getValue:function(inputProps){return inputProps.valueLink?(_assertValueLink(inputProps),inputProps.valueLink.value):inputProps.value},getChecked:function(inputProps){return inputProps.checkedLink?(_assertCheckedLink(inputProps),inputProps.checkedLink.value):inputProps.checked},executeOnChange:function(inputProps,event){return inputProps.valueLink?(_assertValueLink(inputProps),inputProps.valueLink.requestChange(event.target.value)):inputProps.checkedLink?(_assertCheckedLink(inputProps),inputProps.checkedLink.requestChange(event.target.checked)):inputProps.onChange?inputProps.onChange.call(void 0,event):void 0}};module.exports=LinkedValueUtils}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),injected=!1,ReactComponentEnvironment={replaceNodeWithMarkup:null,processChildrenUpdates:null,injection:{injectEnvironment:function(environment){injected&&("production"!==process.env.NODE_ENV?invariant(!1,"ReactCompositeComponent: injectEnvironment() can only be called once."):_prodInvariant("104")),ReactComponentEnvironment.replaceNodeWithMarkup=environment.replaceNodeWithMarkup,ReactComponentEnvironment.processChildrenUpdates=environment.processChildrenUpdates,injected=!0}}};module.exports=ReactComponentEnvironment}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function invokeGuardedCallback(name,func,a){try{func(a)}catch(x){null===caughtError&&(caughtError=x)}}var caughtError=null,ReactErrorUtils={invokeGuardedCallback:invokeGuardedCallback,invokeGuardedCallbackWithCatch:invokeGuardedCallback,rethrowCaughtError:function(){if(caughtError){var error=caughtError;throw caughtError=null,error}}};if("production"!==process.env.NODE_ENV&&"undefined"!=typeof window&&"function"==typeof window.dispatchEvent&&"undefined"!=typeof document&&"function"==typeof document.createEvent){var fakeNode=document.createElement("react");ReactErrorUtils.invokeGuardedCallback=function(name,func,a){var boundFunc=func.bind(null,a),evtType="react-"+name;fakeNode.addEventListener(evtType,boundFunc,!1);var evt=document.createEvent("Event");evt.initEvent(evtType,!1,!1),fakeNode.dispatchEvent(evt),fakeNode.removeEventListener(evtType,boundFunc,!1)}}module.exports=ReactErrorUtils}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function enqueueUpdate(internalInstance){ReactUpdates.enqueueUpdate(internalInstance)}function formatUnexpectedArgument(arg){var type=typeof arg;if("object"!==type)return type;var displayName=arg.constructor&&arg.constructor.name||type,keys=Object.keys(arg);return keys.length>0&&keys.length<20?displayName+" (keys: "+keys.join(", ")+")":displayName}function getInternalInstanceReadyForUpdate(publicInstance,callerName){var internalInstance=ReactInstanceMap.get(publicInstance);if(!internalInstance){if("production"!==process.env.NODE_ENV){var ctor=publicInstance.constructor;"production"!==process.env.NODE_ENV&&warning(!callerName,"%s(...): Can only update a mounted or mounting component. This usually means you called %s() on an unmounted component. This is a no-op. Please check the code for the %s component.",callerName,callerName,ctor&&(ctor.displayName||ctor.name)||"ReactClass")}return null}return"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(null==ReactCurrentOwner.current,"%s(...): Cannot update during an existing state transition (such as within `render` or another component's constructor). Render methods should be a pure function of props and state; constructor side-effects are an anti-pattern, but can be moved to `componentWillMount`.",callerName),internalInstance}var _prodInvariant=__webpack_require__(4),ReactCurrentOwner=__webpack_require__(18),ReactInstanceMap=__webpack_require__(32),ReactInstrumentation=__webpack_require__(14),ReactUpdates=__webpack_require__(17),invariant=__webpack_require__(1),warning=__webpack_require__(2),ReactUpdateQueue={isMounted:function(publicInstance){if("production"!==process.env.NODE_ENV){var owner=ReactCurrentOwner.current;null!==owner&&("production"!==process.env.NODE_ENV&&warning(owner._warnedAboutRefsInRender,"%s is accessing isMounted inside its render() function. render() should be a pure function of props and state. It should never access something that requires stale data from the previous render, such as refs. Move this logic to componentDidMount and componentDidUpdate instead.",owner.getName()||"A component"),owner._warnedAboutRefsInRender=!0)}var internalInstance=ReactInstanceMap.get(publicInstance);return!!internalInstance&&!!internalInstance._renderedComponent},enqueueCallback:function(publicInstance,callback,callerName){ReactUpdateQueue.validateCallback(callback,callerName);var internalInstance=getInternalInstanceReadyForUpdate(publicInstance);if(!internalInstance)return null;internalInstance._pendingCallbacks?internalInstance._pendingCallbacks.push(callback):internalInstance._pendingCallbacks=[callback],enqueueUpdate(internalInstance)},enqueueCallbackInternal:function(internalInstance,callback){internalInstance._pendingCallbacks?internalInstance._pendingCallbacks.push(callback):internalInstance._pendingCallbacks=[callback],enqueueUpdate(internalInstance)},enqueueForceUpdate:function(publicInstance){var internalInstance=getInternalInstanceReadyForUpdate(publicInstance,"forceUpdate");internalInstance&&(internalInstance._pendingForceUpdate=!0,enqueueUpdate(internalInstance))},enqueueReplaceState:function(publicInstance,completeState,callback){var internalInstance=getInternalInstanceReadyForUpdate(publicInstance,"replaceState");internalInstance&&(internalInstance._pendingStateQueue=[completeState],internalInstance._pendingReplaceState=!0,void 0!==callback&&null!==callback&&(ReactUpdateQueue.validateCallback(callback,"replaceState"),internalInstance._pendingCallbacks?internalInstance._pendingCallbacks.push(callback):internalInstance._pendingCallbacks=[callback]),enqueueUpdate(internalInstance))},enqueueSetState:function(publicInstance,partialState){"production"!==process.env.NODE_ENV&&(ReactInstrumentation.debugTool.onSetState(),"production"!==process.env.NODE_ENV&&warning(null!=partialState,"setState(...): You passed an undefined or null state object; instead, use forceUpdate()."));var internalInstance=getInternalInstanceReadyForUpdate(publicInstance,"setState");if(internalInstance){(internalInstance._pendingStateQueue||(internalInstance._pendingStateQueue=[])).push(partialState),enqueueUpdate(internalInstance)}},enqueueElementInternal:function(internalInstance,nextElement,nextContext){internalInstance._pendingElement=nextElement,internalInstance._context=nextContext,enqueueUpdate(internalInstance)},validateCallback:function(callback,callerName){callback&&"function"!=typeof callback&&("production"!==process.env.NODE_ENV?invariant(!1,"%s(...): Expected the last optional `callback` argument to be a function. Instead received: %s.",callerName,formatUnexpectedArgument(callback)):_prodInvariant("122",callerName,formatUnexpectedArgument(callback)))}};module.exports=ReactUpdateQueue}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var createMicrosoftUnsafeLocalFunction=function(func){return"undefined"!=typeof MSApp&&MSApp.execUnsafeLocalFunction?function(arg0,arg1,arg2,arg3){MSApp.execUnsafeLocalFunction(function(){return func(arg0,arg1,arg2,arg3)})}:func};module.exports=createMicrosoftUnsafeLocalFunction},function(module,exports,__webpack_require__){"use strict";function getEventCharCode(nativeEvent){var charCode,keyCode=nativeEvent.keyCode;return"charCode"in nativeEvent?0===(charCode=nativeEvent.charCode)&&13===keyCode&&(charCode=13):charCode=keyCode,charCode>=32||13===charCode?charCode:0}module.exports=getEventCharCode},function(module,exports,__webpack_require__){"use strict";function modifierStateGetter(keyArg){var syntheticEvent=this,nativeEvent=syntheticEvent.nativeEvent;if(nativeEvent.getModifierState)return nativeEvent.getModifierState(keyArg);var keyProp=modifierKeyToProp[keyArg];return!!keyProp&&!!nativeEvent[keyProp]}function getEventModifierState(nativeEvent){return modifierStateGetter}var modifierKeyToProp={Alt:"altKey",Control:"ctrlKey",Meta:"metaKey",Shift:"shiftKey"};module.exports=getEventModifierState},function(module,exports,__webpack_require__){"use strict";function getEventTarget(nativeEvent){var target=nativeEvent.target||nativeEvent.srcElement||window;return target.correspondingUseElement&&(target=target.correspondingUseElement),3===target.nodeType?target.parentNode:target}module.exports=getEventTarget},function(module,exports,__webpack_require__){"use strict";/**
  * Checks if an event is supported in the current execution environment.
  *
  * NOTE: This will not work correctly for non-generic events such as `change`,
@@ -27,7 +27,12 @@ var getOwnPropertySymbols=Object.getOwnPropertySymbols,hasOwnProperty=Object.pro
  * @internal
  * @license Modernizr 3.0.0pre (Custom Build) | MIT
  */
-function isEventSupported(eventNameSuffix,capture){if(!ExecutionEnvironment.canUseDOM||capture&&!("addEventListener"in document))return!1;var eventName="on"+eventNameSuffix,isSupported=eventName in document;if(!isSupported){var element=document.createElement("div");element.setAttribute(eventName,"return;"),isSupported="function"==typeof element[eventName]}return!isSupported&&useHasFeature&&"wheel"===eventNameSuffix&&(isSupported=document.implementation.hasFeature("Events.wheel","3.0")),isSupported}var useHasFeature,ExecutionEnvironment=__webpack_require__(9);ExecutionEnvironment.canUseDOM&&(useHasFeature=document.implementation&&document.implementation.hasFeature&&!0!==document.implementation.hasFeature("","")),module.exports=isEventSupported},function(module,exports,__webpack_require__){"use strict";function shouldUpdateReactComponent(prevElement,nextElement){var prevEmpty=null===prevElement||!1===prevElement,nextEmpty=null===nextElement||!1===nextElement;if(prevEmpty||nextEmpty)return prevEmpty===nextEmpty;var prevType=typeof prevElement,nextType=typeof nextElement;return"string"===prevType||"number"===prevType?"string"===nextType||"number"===nextType:"object"===nextType&&prevElement.type===nextElement.type&&prevElement.key===nextElement.key}module.exports=shouldUpdateReactComponent},function(module,exports,__webpack_require__){"use strict";(function(process){var _assign=__webpack_require__(7),emptyFunction=__webpack_require__(12),warning=__webpack_require__(2),validateDOMNesting=emptyFunction;if("production"!==process.env.NODE_ENV){var specialTags=["address","applet","area","article","aside","base","basefont","bgsound","blockquote","body","br","button","caption","center","col","colgroup","dd","details","dir","div","dl","dt","embed","fieldset","figcaption","figure","footer","form","frame","frameset","h1","h2","h3","h4","h5","h6","head","header","hgroup","hr","html","iframe","img","input","isindex","li","link","listing","main","marquee","menu","menuitem","meta","nav","noembed","noframes","noscript","object","ol","p","param","plaintext","pre","script","section","select","source","style","summary","table","tbody","td","template","textarea","tfoot","th","thead","title","tr","track","ul","wbr","xmp"],inScopeTags=["applet","caption","html","table","td","th","marquee","object","template","foreignObject","desc","title"],buttonScopeTags=inScopeTags.concat(["button"]),impliedEndTags=["dd","dt","li","option","optgroup","p","rp","rt"],emptyAncestorInfo={current:null,formTag:null,aTagInScope:null,buttonTagInScope:null,nobrTagInScope:null,pTagInButtonScope:null,listItemTagAutoclosing:null,dlItemTagAutoclosing:null},updatedAncestorInfo=function(oldInfo,tag,instance){var ancestorInfo=_assign({},oldInfo||emptyAncestorInfo),info={tag:tag,instance:instance};return-1!==inScopeTags.indexOf(tag)&&(ancestorInfo.aTagInScope=null,ancestorInfo.buttonTagInScope=null,ancestorInfo.nobrTagInScope=null),-1!==buttonScopeTags.indexOf(tag)&&(ancestorInfo.pTagInButtonScope=null),-1!==specialTags.indexOf(tag)&&"address"!==tag&&"div"!==tag&&"p"!==tag&&(ancestorInfo.listItemTagAutoclosing=null,ancestorInfo.dlItemTagAutoclosing=null),ancestorInfo.current=info,"form"===tag&&(ancestorInfo.formTag=info),"a"===tag&&(ancestorInfo.aTagInScope=info),"button"===tag&&(ancestorInfo.buttonTagInScope=info),"nobr"===tag&&(ancestorInfo.nobrTagInScope=info),"p"===tag&&(ancestorInfo.pTagInButtonScope=info),"li"===tag&&(ancestorInfo.listItemTagAutoclosing=info),"dd"!==tag&&"dt"!==tag||(ancestorInfo.dlItemTagAutoclosing=info),ancestorInfo},isTagValidWithParent=function(tag,parentTag){switch(parentTag){case"select":return"option"===tag||"optgroup"===tag||"#text"===tag;case"optgroup":return"option"===tag||"#text"===tag;case"option":return"#text"===tag;case"tr":return"th"===tag||"td"===tag||"style"===tag||"script"===tag||"template"===tag;case"tbody":case"thead":case"tfoot":return"tr"===tag||"style"===tag||"script"===tag||"template"===tag;case"colgroup":return"col"===tag||"template"===tag;case"table":return"caption"===tag||"colgroup"===tag||"tbody"===tag||"tfoot"===tag||"thead"===tag||"style"===tag||"script"===tag||"template"===tag;case"head":return"base"===tag||"basefont"===tag||"bgsound"===tag||"link"===tag||"meta"===tag||"title"===tag||"noscript"===tag||"noframes"===tag||"style"===tag||"script"===tag||"template"===tag;case"html":return"head"===tag||"body"===tag;case"#document":return"html"===tag}switch(tag){case"h1":case"h2":case"h3":case"h4":case"h5":case"h6":return"h1"!==parentTag&&"h2"!==parentTag&&"h3"!==parentTag&&"h4"!==parentTag&&"h5"!==parentTag&&"h6"!==parentTag;case"rp":case"rt":return-1===impliedEndTags.indexOf(parentTag);case"body":case"caption":case"col":case"colgroup":case"frame":case"head":case"html":case"tbody":case"td":case"tfoot":case"th":case"thead":case"tr":return null==parentTag}return!0},findInvalidAncestorForTag=function(tag,ancestorInfo){switch(tag){case"address":case"article":case"aside":case"blockquote":case"center":case"details":case"dialog":case"dir":case"div":case"dl":case"fieldset":case"figcaption":case"figure":case"footer":case"header":case"hgroup":case"main":case"menu":case"nav":case"ol":case"p":case"section":case"summary":case"ul":case"pre":case"listing":case"table":case"hr":case"xmp":case"h1":case"h2":case"h3":case"h4":case"h5":case"h6":return ancestorInfo.pTagInButtonScope;case"form":return ancestorInfo.formTag||ancestorInfo.pTagInButtonScope;case"li":return ancestorInfo.listItemTagAutoclosing;case"dd":case"dt":return ancestorInfo.dlItemTagAutoclosing;case"button":return ancestorInfo.buttonTagInScope;case"a":return ancestorInfo.aTagInScope;case"nobr":return ancestorInfo.nobrTagInScope}return null},findOwnerStack=function(instance){if(!instance)return[];var stack=[];do{stack.push(instance)}while(instance=instance._currentElement._owner);return stack.reverse(),stack},didWarn={};validateDOMNesting=function(childTag,childText,childInstance,ancestorInfo){ancestorInfo=ancestorInfo||emptyAncestorInfo;var parentInfo=ancestorInfo.current,parentTag=parentInfo&&parentInfo.tag;null!=childText&&("production"!==process.env.NODE_ENV&&warning(null==childTag,"validateDOMNesting: when childText is passed, childTag should be null"),childTag="#text");var invalidParent=isTagValidWithParent(childTag,parentTag)?null:parentInfo,invalidAncestor=invalidParent?null:findInvalidAncestorForTag(childTag,ancestorInfo),problematic=invalidParent||invalidAncestor;if(problematic){var i,ancestorTag=problematic.tag,ancestorInstance=problematic.instance,childOwner=childInstance&&childInstance._currentElement._owner,ancestorOwner=ancestorInstance&&ancestorInstance._currentElement._owner,childOwners=findOwnerStack(childOwner),ancestorOwners=findOwnerStack(ancestorOwner),minStackLen=Math.min(childOwners.length,ancestorOwners.length),deepestCommon=-1;for(i=0;i<minStackLen&&childOwners[i]===ancestorOwners[i];i++)deepestCommon=i;var childOwnerNames=childOwners.slice(deepestCommon+1).map(function(inst){return inst.getName()||"(unknown)"}),ancestorOwnerNames=ancestorOwners.slice(deepestCommon+1).map(function(inst){return inst.getName()||"(unknown)"}),ownerInfo=[].concat(-1!==deepestCommon?childOwners[deepestCommon].getName()||"(unknown)":[],ancestorOwnerNames,ancestorTag,invalidAncestor?["..."]:[],childOwnerNames,childTag).join(" > "),warnKey=!!invalidParent+"|"+childTag+"|"+ancestorTag+"|"+ownerInfo;if(didWarn[warnKey])return;didWarn[warnKey]=!0;var tagDisplayName=childTag,whitespaceInfo="";if("#text"===childTag?/\S/.test(childText)?tagDisplayName="Text nodes":(tagDisplayName="Whitespace text nodes",whitespaceInfo=" Make sure you don't have any extra whitespace between tags on each line of your source code."):tagDisplayName="<"+childTag+">",invalidParent){var info="";"table"===ancestorTag&&"tr"===childTag&&(info+=" Add a <tbody> to your code to match the DOM tree generated by the browser."),"production"!==process.env.NODE_ENV&&warning(!1,"validateDOMNesting(...): %s cannot appear as a child of <%s>.%s See %s.%s",tagDisplayName,ancestorTag,whitespaceInfo,ownerInfo,info)}else"production"!==process.env.NODE_ENV&&warning(!1,"validateDOMNesting(...): %s cannot appear as a descendant of <%s>. See %s.",tagDisplayName,ancestorTag,ownerInfo)}},validateDOMNesting.updatedAncestorInfo=updatedAncestorInfo,validateDOMNesting.isTagValidInContext=function(tag,ancestorInfo){ancestorInfo=ancestorInfo||emptyAncestorInfo;var parentInfo=ancestorInfo.current,parentTag=parentInfo&&parentInfo.tag;return isTagValidWithParent(tag,parentTag)&&!findInvalidAncestorForTag(tag,ancestorInfo)}}module.exports=validateDOMNesting}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var lowPriorityWarning=function(){};if("production"!==process.env.NODE_ENV){var printWarning=function(format){for(var _len=arguments.length,args=Array(_len>1?_len-1:0),_key=1;_key<_len;_key++)args[_key-1]=arguments[_key];var argIndex=0,message="Warning: "+format.replace(/%s/g,function(){return args[argIndex++]});try{throw new Error(message)}catch(x){}};lowPriorityWarning=function(condition,format){if(void 0===format)throw new Error("`warning(condition, format, ...args)` requires a warning message argument");if(!condition){for(var _len2=arguments.length,args=Array(_len2>2?_len2-2:0),_key2=2;_key2<_len2;_key2++)args[_key2-2]=arguments[_key2];printWarning.apply(void 0,[format].concat(args))}}}module.exports=lowPriorityWarning}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Choice=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),Choice=function(props){var children=props.children,className=props.className,id=props.id,inversed=props.inversed,inputProps=_objectWithoutProperties(props,["children","className","id","inversed"]),inputClasses=(0,_classnames2.default)("ds-c-choice",{"ds-c-choice--inverse":inversed});return id||(id=(0,_lodash2.default)(inputProps.type+"_"+inputProps.name+"_")),_react2.default.createElement("div",{className:className},_react2.default.createElement("input",_extends({className:inputClasses,id:id},inputProps)),_react2.default.createElement("label",{htmlFor:id},children))};exports.Choice=Choice,Choice.defaultProps={type:"checkbox"},Choice.propTypes={children:_propTypes2.default.node.isRequired,checked:_propTypes2.default.bool,className:_propTypes2.default.string,defaultChecked:_propTypes2.default.bool,id:_propTypes2.default.string,inversed:_propTypes2.default.bool,name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,type:_propTypes2.default.oneOf(["checkbox","radio"]),value:_propTypes2.default.oneOfType([_propTypes2.default.number,_propTypes2.default.string]).isRequired},exports.default=Choice},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Select=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),Select=function(props){var children=props.children,className=props.className,id=props.id,inversed=props.inversed,selectProps=_objectWithoutProperties(props,["children","className","id","inversed"]),classes=(0,_classnames2.default)("ds-c-field ds-c-field--select",{"ds-c-field--inverse":inversed},className);return id||(id=(0,_lodash2.default)("select_"+selectProps.name+"_")),_react2.default.createElement("select",_extends({className:classes,id:id},selectProps),children)};exports.Select=Select,Select.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,defaultValue:_propTypes2.default.string,disabled:_propTypes2.default.bool,id:_propTypes2.default.string,inversed:_propTypes2.default.bool,multiple:function(props,propName,componentName){if(props[propName])return new Error("'"+propName+"' supplied to '"+componentName+"'. [A11Y]: Users often don’t understand how to select multiple items from dropdowns. Use checkboxes instead.")},name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,value:_propTypes2.default.string},exports.default=Select},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.FormLabel=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),FormLabel=exports.FormLabel=function(_React$PureComponent){function FormLabel(){return _classCallCheck(this,FormLabel),_possibleConstructorReturn(this,(FormLabel.__proto__||Object.getPrototypeOf(FormLabel)).apply(this,arguments))}return _inherits(FormLabel,_React$PureComponent),_createClass(FormLabel,[{key:"errorMessage",value:function(){if(this.props.errorMessage)return _react2.default.createElement("span",{className:"ds-c-field__hint ds-u-color--error",id:this.props.fieldId+"-message",role:"alert"},this.props.errorMessage)}},{key:"hint",value:function(){if(this.props.hint){var classes=(0,_classnames2.default)("ds-c-field__hint",{"ds-c-field__hint--inverse":this.props.inversed});return _react2.default.createElement("span",{className:classes},this.props.hint)}}},{key:"render",value:function(){var ComponentType=this.props.component,labelTextClasses=this.props.errorMessage&&"ds-u-font-weight--bold",classes=(0,_classnames2.default)("ds-c-label",this.props.className);return _react2.default.createElement(ComponentType,{className:classes,htmlFor:this.props.fieldId},_react2.default.createElement("span",{className:labelTextClasses},this.props.children),this.errorMessage(),this.hint())}}]),FormLabel}(_react2.default.PureComponent);FormLabel.defaultProps={component:"label"},FormLabel.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,component:_propTypes2.default.oneOf(["label","legend"]),errorMessage:_propTypes2.default.string,fieldId:_propTypes2.default.string,hint:_propTypes2.default.node,inversed:_propTypes2.default.bool},exports.default=FormLabel},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Tab=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Tab=exports.Tab=function(_React$PureComponent){function Tab(props){_classCallCheck(this,Tab);var _this=_possibleConstructorReturn(this,(Tab.__proto__||Object.getPrototypeOf(Tab)).call(this,props));return _this.handleClick=_this.handleClick.bind(_this),_this.href=_this.props.href||"#"+_this.props.panelId,_this}return _inherits(Tab,_React$PureComponent),_createClass(Tab,[{key:"handleClick",value:function(evt){this.props.onClick&&this.props.onClick(evt,this.props.panelId,this.props.id,this.href)}},{key:"render",value:function(){var classes=(0,_classnames2.default)("ds-c-tabs__item",this.props.className);return _react2.default.createElement("a",{"aria-selected":String(this.props.selected),"aria-controls":this.props.panelId,className:classes,href:this.href,id:this.props.id,onClick:this.handleClick,role:"tab"},this.props.children)}}]),Tab}(_react2.default.PureComponent);Tab.defaultProps={selected:!1},Tab.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,id:_propTypes2.default.string.isRequired,href:_propTypes2.default.string,onClick:_propTypes2.default.func,panelId:_propTypes2.default.string.isRequired,selected:_propTypes2.default.bool},exports.default=Tab},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function TabPanel(props){var classes=(0,_classnames2.default)("ds-c-tabs__panel",props.className);return _react2.default.createElement("div",{"aria-labelledby":props.tabId,"aria-hidden":String(!props.selected),className:classes,id:props.id,role:"tabpanel"},props.children)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.TabPanel=TabPanel;var _propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames);TabPanel.defaultProps={selected:!1},TabPanel.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,id:_propTypes2.default.string.isRequired,selected:_propTypes2.default.bool,tab:_propTypes2.default.string,tabClassName:_propTypes2.default.string,tabHref:_propTypes2.default.string,tabId:_propTypes2.default.string},exports.default=TabPanel},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.VerticalNav=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_VerticalNavItem=__webpack_require__(146),_VerticalNavItem2=_interopRequireDefault(_VerticalNavItem),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),VerticalNav=exports.VerticalNav=function(_React$PureComponent){function VerticalNav(){return _classCallCheck(this,VerticalNav),_possibleConstructorReturn(this,(VerticalNav.__proto__||Object.getPrototypeOf(VerticalNav)).apply(this,arguments))}return _inherits(VerticalNav,_React$PureComponent),_createClass(VerticalNav,[{key:"renderItems",value:function(){var _this2=this;return this.props.items.map(function(item){var onClick=item.onClick||_this2.props.onLinkClick,selected=item.selected||_this2.props.selectedId&&_this2.props.selectedId===item.id;return onClick||(onClick=void 0),_react2.default.createElement(_VerticalNavItem2.default,_extends({},item,{_selectedId:_this2.props.selectedId,key:item.id+item.url+item.label,onClick:onClick,selected:selected}))})}},{key:"render",value:function(){var classes=(0,_classnames2.default)({"ds-c-vertical-nav":!this.props.nested,"ds-c-vertical-nav__subnav":this.props.nested,"ds-u-display--none":this.props.collapsed},this.props.className);return _react2.default.createElement("ul",{className:classes,id:this.props.id},this.renderItems())}}]),VerticalNav}(_react2.default.PureComponent);VerticalNav.defaultProps={collapsed:!1},VerticalNav.propTypes={className:_propTypes2.default.string,collapsed:_propTypes2.default.bool,selectedId:_propTypes2.default.string,id:_propTypes2.default.string,items:_propTypes2.default.arrayOf(_propTypes2.default.object).isRequired,nested:_propTypes2.default.bool,onLinkClick:_propTypes2.default.func},exports.default=VerticalNav},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0});var _propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),CodeSnippet=function(props){return _react2.default.createElement("details",{className:"ds-u-margin-bottom--2",open:props.open},_react2.default.createElement("summary",{className:"ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1"},"Code snippet"),_react2.default.createElement("pre",{className:"language-"+props.language},_react2.default.createElement("code",{dangerouslySetInnerHTML:{__html:props.children}})))};CodeSnippet.defaultProps={language:"markup",open:!1},CodeSnippet.propTypes={children:_propTypes2.default.node.isRequired,language:_propTypes2.default.oneOf(["markup","jsx"]),open:_propTypes2.default.bool},exports.default=CodeSnippet},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0});var _propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_reactComponentPath=__webpack_require__(78),_reactComponentPath2=_interopRequireDefault(_reactComponentPath),Source=function(props){if(props.reactComponent||props.source){var path=props.reactComponent?(0,_reactComponentPath2.default)(props.source.path,props.reactComponent).replace(/[a-z-]+\/src\//,""):props.source.filename;return _react2.default.createElement("code",{className:"ds-u-font-size--small"},path)}return null};Source.propTypes={reactComponent:_propTypes2.default.string,source:_propTypes2.default.shape({filename:_propTypes2.default.string.isRequired,path:_propTypes2.default.string.isRequired})},exports.default=Source},function(module,exports,__webpack_require__){"use strict";function reactComponentPath(path,name){return path=path.match(/packages\/([a-z0-9_\-\/]+)/i)[1],path.replace(/\/([a-z0-9_-]+)$/i,"/"+name)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=reactComponentPath},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Choice=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),Choice=function(props){var children=props.children,className=props.className,id=props.id,inversed=props.inversed,inputProps=_objectWithoutProperties(props,["children","className","id","inversed"]),inputClasses=(0,_classnames2.default)("ds-c-choice",{"ds-c-choice--inverse":inversed});return id||(id=(0,_lodash2.default)(inputProps.type+"_"+inputProps.name+"_")),_react2.default.createElement("div",{className:className},_react2.default.createElement("input",_extends({className:inputClasses,id:id},inputProps)),_react2.default.createElement("label",{htmlFor:id},children))};exports.Choice=Choice,Choice.defaultProps={type:"checkbox"},Choice.propTypes={children:_propTypes2.default.node.isRequired,checked:_propTypes2.default.bool,className:_propTypes2.default.string,defaultChecked:_propTypes2.default.bool,id:_propTypes2.default.string,inversed:_propTypes2.default.bool,name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,type:_propTypes2.default.oneOf(["checkbox","radio"]),value:_propTypes2.default.oneOfType([_propTypes2.default.number,_propTypes2.default.string]).isRequired},exports.default=Choice},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Select=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),Select=function(props){var children=props.children,className=props.className,id=props.id,inversed=props.inversed,selectProps=_objectWithoutProperties(props,["children","className","id","inversed"]),classes=(0,_classnames2.default)("ds-c-field ds-c-field--select",{"ds-c-field--inverse":inversed},className);return id||(id=(0,_lodash2.default)("select_"+selectProps.name+"_")),_react2.default.createElement("select",_extends({className:classes,id:id},selectProps),children)};exports.Select=Select,Select.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,defaultValue:_propTypes2.default.string,disabled:_propTypes2.default.bool,id:_propTypes2.default.string,inversed:_propTypes2.default.bool,multiple:function(props,propName,componentName){if(props[propName])return new Error("'"+propName+"' supplied to '"+componentName+"'. [A11Y]: Users often don’t understand how to select multiple items from dropdowns. Use checkboxes instead.")},name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,value:_propTypes2.default.string},exports.default=Select},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Tab=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Tab=exports.Tab=function(_React$PureComponent){function Tab(props){_classCallCheck(this,Tab);var _this=_possibleConstructorReturn(this,(Tab.__proto__||Object.getPrototypeOf(Tab)).call(this,props));return _this.handleClick=_this.handleClick.bind(_this),_this.href=_this.props.href||"#"+_this.props.panelId,_this}return _inherits(Tab,_React$PureComponent),_createClass(Tab,[{key:"handleClick",value:function(evt){this.props.onClick&&this.props.onClick(evt,this.props.panelId,this.props.id,this.href)}},{key:"render",value:function(){var classes=(0,_classnames2.default)("ds-c-tabs__item",this.props.className);return _react2.default.createElement("a",{"aria-selected":String(this.props.selected),"aria-controls":this.props.panelId,className:classes,href:this.href,id:this.props.id,onClick:this.handleClick,role:"tab"},this.props.children)}}]),Tab}(_react2.default.PureComponent);Tab.defaultProps={selected:!1},Tab.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,id:_propTypes2.default.string.isRequired,href:_propTypes2.default.string,onClick:_propTypes2.default.func,panelId:_propTypes2.default.string.isRequired,selected:_propTypes2.default.bool},exports.default=Tab},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function TabPanel(props){var classes=(0,_classnames2.default)("ds-c-tabs__panel",props.className);return _react2.default.createElement("div",{"aria-labelledby":props.tabId,"aria-hidden":String(!props.selected),className:classes,id:props.id,role:"tabpanel"},props.children)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.TabPanel=TabPanel;var _propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames);TabPanel.defaultProps={selected:!1},TabPanel.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,id:_propTypes2.default.string.isRequired,selected:_propTypes2.default.bool,tab:_propTypes2.default.string,tabClassName:_propTypes2.default.string,tabHref:_propTypes2.default.string,tabId:_propTypes2.default.string},exports.default=TabPanel},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.VerticalNav=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_VerticalNavItem=__webpack_require__(84),_VerticalNavItem2=_interopRequireDefault(_VerticalNavItem),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),VerticalNav=exports.VerticalNav=function(_React$PureComponent){function VerticalNav(){return _classCallCheck(this,VerticalNav),_possibleConstructorReturn(this,(VerticalNav.__proto__||Object.getPrototypeOf(VerticalNav)).apply(this,arguments))}return _inherits(VerticalNav,_React$PureComponent),_createClass(VerticalNav,[{key:"renderItems",value:function(){var _this2=this;return this.props.items.map(function(item){var onClick=item.onClick||_this2.props.onLinkClick,selected=item.selected||_this2.props.selectedId&&_this2.props.selectedId===item.id;return onClick||(onClick=void 0),_react2.default.createElement(_VerticalNavItem2.default,_extends({},item,{_selectedId:_this2.props.selectedId,key:item.id+item.url+item.label,onClick:onClick,selected:selected}))})}},{key:"render",value:function(){var classes=(0,_classnames2.default)({"ds-c-vertical-nav":!this.props.nested,"ds-c-vertical-nav__subnav":this.props.nested,"ds-u-display--none":this.props.collapsed},this.props.className);return _react2.default.createElement("ul",{className:classes,id:this.props.id},this.renderItems())}}]),VerticalNav}(_react2.default.PureComponent);VerticalNav.defaultProps={collapsed:!1},VerticalNav.propTypes={className:_propTypes2.default.string,collapsed:_propTypes2.default.bool,selectedId:_propTypes2.default.string,id:_propTypes2.default.string,items:_propTypes2.default.arrayOf(_propTypes2.default.object).isRequired,nested:_propTypes2.default.bool,onLinkClick:_propTypes2.default.func},exports.default=VerticalNav},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.VerticalNavItem=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_VerticalNav=__webpack_require__(83),_VerticalNav2=_interopRequireDefault(_VerticalNav),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),VerticalNavItem=exports.VerticalNavItem=function(_React$PureComponent){function VerticalNavItem(props){_classCallCheck(this,VerticalNavItem);var _this=_possibleConstructorReturn(this,(VerticalNavItem.__proto__||Object.getPrototypeOf(VerticalNavItem)).call(this,props));return _this.handleLinkClick=_this.handleLinkClick.bind(_this),_this.handleToggleClick=_this.handleToggleClick.bind(_this),_this.id=_this.props.id||(0,_lodash2.default)("VerticalNavItem_"),_this.subnavId=_this.id+"__subnav",_this.state={collapsed:_this.props.defaultCollapsed},_this}return _inherits(VerticalNavItem,_React$PureComponent),_createClass(VerticalNavItem,[{key:"componentDidUpdate",value:function(prevProps,prevState){this.props.onSubnavToggle&&prevState.collapsed!==this.state.collapsed&&this.props.onSubnavToggle(this.props.id,this.state.collapsed)}},{key:"handleLinkClick",value:function(evt){this.props.onClick&&this.props.onClick(evt,this.id,this.props.url)}},{key:"handleToggleClick",value:function(){this.setState({collapsed:!this.state.collapsed})}},{key:"hasSubnav",value:function(){return this.props.items&&this.props.items.length}},{key:"isSelected",value:function(){return this.props.selected?this.props.selected:this.props._selectedId&&this.hasSubnav()?this.childIsSelected(this.props.items):void 0}},{key:"childIsSelected",value:function(children){var _this2=this;return!(!children||!children.length)&&children.some(function(child){return child.id===_this2.props._selectedId||_this2.childIsSelected(child.items)})}},{key:"renderSubnavToggle",value:function(){if(this.hasSubnav()){var label=this.state.collapsed?this.props.ariaCollapsedStateButtonLabel:this.props.ariaExpandedStateButtonLabel;return _react2.default.createElement("button",{"aria-controls":this.subnavId,"aria-expanded":!this.state.collapsed,className:"ds-c-vertical-nav__subnav-toggle",onClick:this.handleToggleClick},label)}}},{key:"renderSubnav",value:function(){if(this.hasSubnav())return _react2.default.createElement(_VerticalNav2.default,{selectedId:this.props._selectedId,collapsed:this.state.collapsed,id:this.subnavId,items:this.props.items,nested:!0})}},{key:"render",value:function(){var classes=(0,_classnames2.default)("ds-c-vertical-nav__item",this.props.className),LinkComponent=this.props.url?"a":"div",linkProps={className:(0,_classnames2.default)("ds-c-vertical-nav__link",{"ds-c-vertical-nav__link--current":this.isSelected(),"ds-c-vertical-nav__link--parent":this.hasSubnav()}),href:this.props.url?this.props.url:void 0,onClick:this.props.onClick?this.handleLinkClick:void 0};return _react2.default.createElement("li",{className:classes},_react2.default.createElement(LinkComponent,linkProps,this.props.label),this.renderSubnavToggle(),this.renderSubnav())}}]),VerticalNavItem}(_react2.default.PureComponent);VerticalNavItem.defaultProps={ariaCollapsedStateButtonLabel:"Expand sub-navigation",ariaExpandedStateButtonLabel:"Collapse sub-navigation",defaultCollapsed:!1},VerticalNavItem.propTypes={_selectedId:_propTypes2.default.string,ariaCollapsedStateButtonLabel:_propTypes2.default.string,ariaExpandedStateButtonLabel:_propTypes2.default.string,className:_propTypes2.default.string,defaultCollapsed:_propTypes2.default.bool,onClick:_propTypes2.default.func,onSubnavToggle:_propTypes2.default.func,id:_propTypes2.default.string,items:_propTypes2.default.arrayOf(_propTypes2.default.shape(VerticalNavItem.propTypes)),label:_propTypes2.default.node.isRequired,url:_propTypes2.default.string,selected:_propTypes2.default.bool},exports.default=VerticalNavItem},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _components=__webpack_require__(166);Object.keys(_components).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _components[key]}})})},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyObject={};"production"!==process.env.NODE_ENV&&Object.freeze(emptyObject),module.exports=emptyObject}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyFunction=__webpack_require__(34),invariant=__webpack_require__(15),warning=__webpack_require__(19),ReactPropTypesSecret=__webpack_require__(48),checkPropTypes=__webpack_require__(168);module.exports=function(isValidElement,throwOnDirectAccess){function getIteratorFn(maybeIterable){var iteratorFn=maybeIterable&&(ITERATOR_SYMBOL&&maybeIterable[ITERATOR_SYMBOL]||maybeIterable[FAUX_ITERATOR_SYMBOL]);if("function"==typeof iteratorFn)return iteratorFn}function is(x,y){return x===y?0!==x||1/x==1/y:x!==x&&y!==y}function PropTypeError(message){this.message=message,this.stack=""}function createChainableTypeChecker(validate){function checkType(isRequired,props,propName,componentName,location,propFullName,secret){if(componentName=componentName||ANONYMOUS,propFullName=propFullName||propName,secret!==ReactPropTypesSecret)if(throwOnDirectAccess)invariant(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types");else if("production"!==process.env.NODE_ENV&&"undefined"!=typeof console){var cacheKey=componentName+":"+propName;!manualPropTypeCallCache[cacheKey]&&manualPropTypeWarningCount<3&&(warning(!1,"You are manually calling a React.PropTypes validation function for the `%s` prop on `%s`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details.",propFullName,componentName),manualPropTypeCallCache[cacheKey]=!0,manualPropTypeWarningCount++)}return null==props[propName]?isRequired?new PropTypeError(null===props[propName]?"The "+location+" `"+propFullName+"` is marked as required in `"+componentName+"`, but its value is `null`.":"The "+location+" `"+propFullName+"` is marked as required in `"+componentName+"`, but its value is `undefined`."):null:validate(props,propName,componentName,location,propFullName)}if("production"!==process.env.NODE_ENV)var manualPropTypeCallCache={},manualPropTypeWarningCount=0;var chainedCheckType=checkType.bind(null,!1);return chainedCheckType.isRequired=checkType.bind(null,!0),chainedCheckType}function createPrimitiveTypeChecker(expectedType){function validate(props,propName,componentName,location,propFullName,secret){var propValue=props[propName];if(getPropType(propValue)!==expectedType)return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getPreciseType(propValue)+"` supplied to `"+componentName+"`, expected `"+expectedType+"`.");return null}return createChainableTypeChecker(validate)}function createArrayOfTypeChecker(typeChecker){function validate(props,propName,componentName,location,propFullName){if("function"!=typeof typeChecker)return new PropTypeError("Property `"+propFullName+"` of component `"+componentName+"` has invalid PropType notation inside arrayOf.");var propValue=props[propName];if(!Array.isArray(propValue)){return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getPropType(propValue)+"` supplied to `"+componentName+"`, expected an array.")}for(var i=0;i<propValue.length;i++){var error=typeChecker(propValue,i,componentName,location,propFullName+"["+i+"]",ReactPropTypesSecret);if(error instanceof Error)return error}return null}return createChainableTypeChecker(validate)}function createInstanceTypeChecker(expectedClass){function validate(props,propName,componentName,location,propFullName){if(!(props[propName]instanceof expectedClass)){var expectedClassName=expectedClass.name||ANONYMOUS;return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getClassName(props[propName])+"` supplied to `"+componentName+"`, expected instance of `"+expectedClassName+"`.")}return null}return createChainableTypeChecker(validate)}function createEnumTypeChecker(expectedValues){function validate(props,propName,componentName,location,propFullName){for(var propValue=props[propName],i=0;i<expectedValues.length;i++)if(is(propValue,expectedValues[i]))return null;return new PropTypeError("Invalid "+location+" `"+propFullName+"` of value `"+propValue+"` supplied to `"+componentName+"`, expected one of "+JSON.stringify(expectedValues)+".")}return Array.isArray(expectedValues)?createChainableTypeChecker(validate):("production"!==process.env.NODE_ENV&&warning(!1,"Invalid argument supplied to oneOf, expected an instance of array."),emptyFunction.thatReturnsNull)}function createObjectOfTypeChecker(typeChecker){function validate(props,propName,componentName,location,propFullName){if("function"!=typeof typeChecker)return new PropTypeError("Property `"+propFullName+"` of component `"+componentName+"` has invalid PropType notation inside objectOf.");var propValue=props[propName],propType=getPropType(propValue);if("object"!==propType)return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+propType+"` supplied to `"+componentName+"`, expected an object.");for(var key in propValue)if(propValue.hasOwnProperty(key)){var error=typeChecker(propValue,key,componentName,location,propFullName+"."+key,ReactPropTypesSecret);if(error instanceof Error)return error}return null}return createChainableTypeChecker(validate)}function createUnionTypeChecker(arrayOfTypeCheckers){function validate(props,propName,componentName,location,propFullName){for(var i=0;i<arrayOfTypeCheckers.length;i++){if(null==(0,arrayOfTypeCheckers[i])(props,propName,componentName,location,propFullName,ReactPropTypesSecret))return null}return new PropTypeError("Invalid "+location+" `"+propFullName+"` supplied to `"+componentName+"`.")}if(!Array.isArray(arrayOfTypeCheckers))return"production"!==process.env.NODE_ENV&&warning(!1,"Invalid argument supplied to oneOfType, expected an instance of array."),emptyFunction.thatReturnsNull;for(var i=0;i<arrayOfTypeCheckers.length;i++){var checker=arrayOfTypeCheckers[i];if("function"!=typeof checker)return warning(!1,"Invalid argument supplid to oneOfType. Expected an array of check functions, but received %s at index %s.",getPostfixForTypeWarning(checker),i),emptyFunction.thatReturnsNull}return createChainableTypeChecker(validate)}function createShapeTypeChecker(shapeTypes){function validate(props,propName,componentName,location,propFullName){var propValue=props[propName],propType=getPropType(propValue);if("object"!==propType)return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+propType+"` supplied to `"+componentName+"`, expected `object`.");for(var key in shapeTypes){var checker=shapeTypes[key];if(checker){var error=checker(propValue,key,componentName,location,propFullName+"."+key,ReactPropTypesSecret);if(error)return error}}return null}return createChainableTypeChecker(validate)}function isNode(propValue){switch(typeof propValue){case"number":case"string":case"undefined":return!0;case"boolean":return!propValue;case"object":if(Array.isArray(propValue))return propValue.every(isNode);if(null===propValue||isValidElement(propValue))return!0;var iteratorFn=getIteratorFn(propValue);if(!iteratorFn)return!1;var step,iterator=iteratorFn.call(propValue);if(iteratorFn!==propValue.entries){for(;!(step=iterator.next()).done;)if(!isNode(step.value))return!1}else for(;!(step=iterator.next()).done;){var entry=step.value;if(entry&&!isNode(entry[1]))return!1}return!0;default:return!1}}function isSymbol(propType,propValue){return"symbol"===propType||("Symbol"===propValue["@@toStringTag"]||"function"==typeof Symbol&&propValue instanceof Symbol)}function getPropType(propValue){var propType=typeof propValue;return Array.isArray(propValue)?"array":propValue instanceof RegExp?"object":isSymbol(propType,propValue)?"symbol":propType}function getPreciseType(propValue){if(void 0===propValue||null===propValue)return""+propValue;var propType=getPropType(propValue);if("object"===propType){if(propValue instanceof Date)return"date";if(propValue instanceof RegExp)return"regexp"}return propType}function getPostfixForTypeWarning(value){var type=getPreciseType(value);switch(type){case"array":case"object":return"an "+type;case"boolean":case"date":case"regexp":return"a "+type;default:return type}}function getClassName(propValue){return propValue.constructor&&propValue.constructor.name?propValue.constructor.name:ANONYMOUS}var ITERATOR_SYMBOL="function"==typeof Symbol&&Symbol.iterator,FAUX_ITERATOR_SYMBOL="@@iterator",ANONYMOUS="<<anonymous>>",ReactPropTypes={array:createPrimitiveTypeChecker("array"),bool:createPrimitiveTypeChecker("boolean"),func:createPrimitiveTypeChecker("function"),number:createPrimitiveTypeChecker("number"),object:createPrimitiveTypeChecker("object"),string:createPrimitiveTypeChecker("string"),symbol:createPrimitiveTypeChecker("symbol"),any:function(){return createChainableTypeChecker(emptyFunction.thatReturnsNull)}(),arrayOf:createArrayOfTypeChecker,element:function(){function validate(props,propName,componentName,location,propFullName){var propValue=props[propName];if(!isValidElement(propValue)){return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getPropType(propValue)+"` supplied to `"+componentName+"`, expected a single ReactElement.")}return null}return createChainableTypeChecker(validate)}(),instanceOf:createInstanceTypeChecker,node:function(){function validate(props,propName,componentName,location,propFullName){return isNode(props[propName])?null:new PropTypeError("Invalid "+location+" `"+propFullName+"` supplied to `"+componentName+"`, expected a ReactNode.")}return createChainableTypeChecker(validate)}(),objectOf:createObjectOfTypeChecker,oneOf:createEnumTypeChecker,oneOfType:createUnionTypeChecker,shape:createShapeTypeChecker};return PropTypeError.prototype=Error.prototype,ReactPropTypes.checkPropTypes=checkPropTypes,ReactPropTypes.PropTypes=ReactPropTypes,ReactPropTypes}}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function ReactComponent(props,context,updater){this.props=props,this.context=context,this.refs=emptyObject,this.updater=updater||ReactNoopUpdateQueue}function ReactPureComponent(props,context,updater){this.props=props,this.context=context,this.refs=emptyObject,this.updater=updater||ReactNoopUpdateQueue}function ComponentDummy(){}var _prodInvariant=__webpack_require__(25),_assign=__webpack_require__(35),ReactNoopUpdateQueue=__webpack_require__(91),canDefineProperty=__webpack_require__(37),emptyObject=__webpack_require__(86),invariant=__webpack_require__(15),lowPriorityWarning=__webpack_require__(50);if(ReactComponent.prototype.isReactComponent={},ReactComponent.prototype.setState=function(partialState,callback){"object"!=typeof partialState&&"function"!=typeof partialState&&null!=partialState&&("production"!==process.env.NODE_ENV?invariant(!1,"setState(...): takes an object of state variables to update or a function which returns an object of state variables."):_prodInvariant("85")),this.updater.enqueueSetState(this,partialState),callback&&this.updater.enqueueCallback(this,callback,"setState")},ReactComponent.prototype.forceUpdate=function(callback){this.updater.enqueueForceUpdate(this),callback&&this.updater.enqueueCallback(this,callback,"forceUpdate")},"production"!==process.env.NODE_ENV){var deprecatedAPIs={isMounted:["isMounted","Instead, make sure to clean up subscriptions and pending requests in componentWillUnmount to prevent memory leaks."],replaceState:["replaceState","Refactor your code to use setState instead (see https://github.com/facebook/react/issues/3236)."]};for(var fnName in deprecatedAPIs)deprecatedAPIs.hasOwnProperty(fnName)&&function(methodName,info){canDefineProperty&&Object.defineProperty(ReactComponent.prototype,methodName,{get:function(){lowPriorityWarning(!1,"%s(...) is deprecated in plain JavaScript React classes. %s",info[0],info[1])}})}(fnName,deprecatedAPIs[fnName])}ComponentDummy.prototype=ReactComponent.prototype,ReactPureComponent.prototype=new ComponentDummy,ReactPureComponent.prototype.constructor=ReactPureComponent,_assign(ReactPureComponent.prototype,ReactComponent.prototype),ReactPureComponent.prototype.isPureReactComponent=!0,module.exports={Component:ReactComponent,PureComponent:ReactPureComponent}}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var REACT_ELEMENT_TYPE="function"==typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103;module.exports=REACT_ELEMENT_TYPE},function(module,exports,__webpack_require__){"use strict";(function(process){function getDeclarationErrorAddendum(){if(ReactCurrentOwner.current){var name=ReactCurrentOwner.current.getName();if(name)return" Check the render method of `"+name+"`."}return""}function getSourceInfoErrorAddendum(elementProps){if(null!==elementProps&&void 0!==elementProps&&void 0!==elementProps.__source){var source=elementProps.__source;return" Check your code at "+source.fileName.replace(/^.*[\\\/]/,"")+":"+source.lineNumber+"."}return""}function getCurrentComponentErrorInfo(parentType){var info=getDeclarationErrorAddendum();if(!info){var parentName="string"==typeof parentType?parentType:parentType.displayName||parentType.name;parentName&&(info=" Check the top-level render call using <"+parentName+">.")}return info}function validateExplicitKey(element,parentType){if(element._store&&!element._store.validated&&null==element.key){element._store.validated=!0;var memoizer=ownerHasKeyUseWarning.uniqueKey||(ownerHasKeyUseWarning.uniqueKey={}),currentComponentErrorInfo=getCurrentComponentErrorInfo(parentType);if(!memoizer[currentComponentErrorInfo]){memoizer[currentComponentErrorInfo]=!0;var childOwner="";element&&element._owner&&element._owner!==ReactCurrentOwner.current&&(childOwner=" It was passed a child from "+element._owner.getName()+"."),"production"!==process.env.NODE_ENV&&warning(!1,'Each child in an array or iterator should have a unique "key" prop.%s%s See https://fb.me/react-warning-keys for more information.%s',currentComponentErrorInfo,childOwner,ReactComponentTreeHook.getCurrentStackAddendum(element))}}}function validateChildKeys(node,parentType){if("object"==typeof node)if(Array.isArray(node))for(var i=0;i<node.length;i++){var child=node[i];ReactElement.isValidElement(child)&&validateExplicitKey(child,parentType)}else if(ReactElement.isValidElement(node))node._store&&(node._store.validated=!0);else if(node){var iteratorFn=getIteratorFn(node);if(iteratorFn&&iteratorFn!==node.entries)for(var step,iterator=iteratorFn.call(node);!(step=iterator.next()).done;)ReactElement.isValidElement(step.value)&&validateExplicitKey(step.value,parentType)}}function validatePropTypes(element){var componentClass=element.type;if("function"==typeof componentClass){var name=componentClass.displayName||componentClass.name;componentClass.propTypes&&checkReactTypeSpec(componentClass.propTypes,element.props,"prop",name,element,null),"function"==typeof componentClass.getDefaultProps&&"production"!==process.env.NODE_ENV&&warning(componentClass.getDefaultProps.isReactClassApproved,"getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}var ReactCurrentOwner=__webpack_require__(36),ReactComponentTreeHook=__webpack_require__(49),ReactElement=__webpack_require__(22),checkReactTypeSpec=__webpack_require__(180),canDefineProperty=__webpack_require__(37),getIteratorFn=__webpack_require__(92),warning=__webpack_require__(19),lowPriorityWarning=__webpack_require__(50),ownerHasKeyUseWarning={},ReactElementValidator={createElement:function(type,props,children){var validType="string"==typeof type||"function"==typeof type;if(!validType&&"function"!=typeof type&&"string"!=typeof type){var info="";(void 0===type||"object"==typeof type&&null!==type&&0===Object.keys(type).length)&&(info+=" You likely forgot to export your component from the file it's defined in.");var sourceInfo=getSourceInfoErrorAddendum(props);info+=sourceInfo||getDeclarationErrorAddendum(),info+=ReactComponentTreeHook.getCurrentStackAddendum();var currentSource=null!==props&&void 0!==props&&void 0!==props.__source?props.__source:null;ReactComponentTreeHook.pushNonStandardWarningStack(!0,currentSource),"production"!==process.env.NODE_ENV&&warning(!1,"React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",null==type?type:typeof type,info),ReactComponentTreeHook.popNonStandardWarningStack()}var element=ReactElement.createElement.apply(this,arguments);if(null==element)return element;if(validType)for(var i=2;i<arguments.length;i++)validateChildKeys(arguments[i],type);return validatePropTypes(element),element},createFactory:function(type){var validatedFactory=ReactElementValidator.createElement.bind(null,type);return validatedFactory.type=type,"production"!==process.env.NODE_ENV&&canDefineProperty&&Object.defineProperty(validatedFactory,"type",{enumerable:!1,get:function(){return lowPriorityWarning(!1,"Factory.type is deprecated. Access the class directly before passing it to createFactory."),Object.defineProperty(this,"type",{value:type}),type}}),validatedFactory},cloneElement:function(element,props,children){for(var newElement=ReactElement.cloneElement.apply(this,arguments),i=2;i<arguments.length;i++)validateChildKeys(arguments[i],newElement.type);return validatePropTypes(newElement),newElement}};module.exports=ReactElementValidator}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function warnNoop(publicInstance,callerName){if("production"!==process.env.NODE_ENV){var constructor=publicInstance.constructor;"production"!==process.env.NODE_ENV&&warning(!1,"%s(...): Can only update a mounted or mounting component. This usually means you called %s() on an unmounted component. This is a no-op. Please check the code for the %s component.",callerName,callerName,constructor&&(constructor.displayName||constructor.name)||"ReactClass")}}var warning=__webpack_require__(19),ReactNoopUpdateQueue={isMounted:function(publicInstance){return!1},enqueueCallback:function(publicInstance,callback){},enqueueForceUpdate:function(publicInstance){warnNoop(publicInstance,"forceUpdate")},enqueueReplaceState:function(publicInstance,completeState){warnNoop(publicInstance,"replaceState")},enqueueSetState:function(publicInstance,partialState){warnNoop(publicInstance,"setState")}};module.exports=ReactNoopUpdateQueue}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function getIteratorFn(maybeIterable){var iteratorFn=maybeIterable&&(ITERATOR_SYMBOL&&maybeIterable[ITERATOR_SYMBOL]||maybeIterable[FAUX_ITERATOR_SYMBOL]);if("function"==typeof iteratorFn)return iteratorFn}var ITERATOR_SYMBOL="function"==typeof Symbol&&Symbol.iterator,FAUX_ITERATOR_SYMBOL="@@iterator";module.exports=getIteratorFn},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyFunction=__webpack_require__(12),EventListener={listen:function(target,eventType,callback){return target.addEventListener?(target.addEventListener(eventType,callback,!1),{remove:function(){target.removeEventListener(eventType,callback,!1)}}):target.attachEvent?(target.attachEvent("on"+eventType,callback),{remove:function(){target.detachEvent("on"+eventType,callback)}}):void 0},capture:function(target,eventType,callback){return target.addEventListener?(target.addEventListener(eventType,callback,!0),{remove:function(){target.removeEventListener(eventType,callback,!0)}}):(process.env.NODE_ENV,{remove:emptyFunction})},registerDefault:function(){}};module.exports=EventListener}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function focusNode(node){try{node.focus()}catch(e){}}module.exports=focusNode},function(module,exports,__webpack_require__){"use strict";function getActiveElement(){if("undefined"==typeof document)return null;try{return document.activeElement||document.body}catch(e){return document.body}}module.exports=getActiveElement},function(module,exports,__webpack_require__){var root=__webpack_require__(212),Symbol=root.Symbol;module.exports=Symbol},function(module,exports,__webpack_require__){function baseGetTag(value){return null==value?void 0===value?undefinedTag:nullTag:symToStringTag&&symToStringTag in Object(value)?getRawTag(value):objectToString(value)}var Symbol=__webpack_require__(96),getRawTag=__webpack_require__(208),objectToString=__webpack_require__(211),nullTag="[object Null]",undefinedTag="[object Undefined]",symToStringTag=Symbol?Symbol.toStringTag:void 0;module.exports=baseGetTag},function(module,exports,__webpack_require__){function toInteger(value){var result=toFinite(value),remainder=result%1;return result===result?remainder?result-remainder:result:0}var toFinite=__webpack_require__(220);module.exports=toInteger},function(module,exports,__webpack_require__){(function(global){var _self="undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{},Prism=function(){var lang=/\blang(?:uage)?-(\w+)\b/i,uniqueId=0,_=_self.Prism={util:{encode:function(tokens){return tokens instanceof Token?new Token(tokens.type,_.util.encode(tokens.content),tokens.alias):"Array"===_.util.type(tokens)?tokens.map(_.util.encode):tokens.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/\u00a0/g," ")},type:function(o){return Object.prototype.toString.call(o).match(/\[object (\w+)\]/)[1]},objId:function(obj){return obj.__id||Object.defineProperty(obj,"__id",{value:++uniqueId}),obj.__id},clone:function(o){switch(_.util.type(o)){case"Object":var clone={};for(var key in o)o.hasOwnProperty(key)&&(clone[key]=_.util.clone(o[key]));return clone;case"Array":return o.map&&o.map(function(v){return _.util.clone(v)})}return o}},languages:{extend:function(id,redef){var lang=_.util.clone(_.languages[id]);for(var key in redef)lang[key]=redef[key];return lang},insertBefore:function(inside,before,insert,root){root=root||_.languages;var grammar=root[inside];if(2==arguments.length){insert=arguments[1];for(var newToken in insert)insert.hasOwnProperty(newToken)&&(grammar[newToken]=insert[newToken]);return grammar}var ret={};for(var token in grammar)if(grammar.hasOwnProperty(token)){if(token==before)for(var newToken in insert)insert.hasOwnProperty(newToken)&&(ret[newToken]=insert[newToken]);ret[token]=grammar[token]}return _.languages.DFS(_.languages,function(key,value){value===root[inside]&&key!=inside&&(this[key]=ret)}),root[inside]=ret},DFS:function(o,callback,type,visited){visited=visited||{};for(var i in o)o.hasOwnProperty(i)&&(callback.call(o,i,o[i],type||i),"Object"!==_.util.type(o[i])||visited[_.util.objId(o[i])]?"Array"!==_.util.type(o[i])||visited[_.util.objId(o[i])]||(visited[_.util.objId(o[i])]=!0,_.languages.DFS(o[i],callback,i,visited)):(visited[_.util.objId(o[i])]=!0,_.languages.DFS(o[i],callback,null,visited)))}},plugins:{},highlightAll:function(async,callback){var env={callback:callback,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};_.hooks.run("before-highlightall",env);for(var element,elements=env.elements||document.querySelectorAll(env.selector),i=0;element=elements[i++];)_.highlightElement(element,!0===async,env.callback)},highlightElement:function(element,async,callback){for(var language,grammar,parent=element;parent&&!lang.test(parent.className);)parent=parent.parentNode;parent&&(language=(parent.className.match(lang)||[,""])[1].toLowerCase(),grammar=_.languages[language]),element.className=element.className.replace(lang,"").replace(/\s+/g," ")+" language-"+language,parent=element.parentNode,/pre/i.test(parent.nodeName)&&(parent.className=parent.className.replace(lang,"").replace(/\s+/g," ")+" language-"+language);var code=element.textContent,env={element:element,language:language,grammar:grammar,code:code};if(_.hooks.run("before-sanity-check",env),!env.code||!env.grammar)return env.code&&(env.element.textContent=env.code),void _.hooks.run("complete",env);if(_.hooks.run("before-highlight",env),async&&_self.Worker){var worker=new Worker(_.filename);worker.onmessage=function(evt){env.highlightedCode=evt.data,_.hooks.run("before-insert",env),env.element.innerHTML=env.highlightedCode,callback&&callback.call(env.element),_.hooks.run("after-highlight",env),_.hooks.run("complete",env)},worker.postMessage(JSON.stringify({language:env.language,code:env.code,immediateClose:!0}))}else env.highlightedCode=_.highlight(env.code,env.grammar,env.language),_.hooks.run("before-insert",env),env.element.innerHTML=env.highlightedCode,callback&&callback.call(element),_.hooks.run("after-highlight",env),_.hooks.run("complete",env)},highlight:function(text,grammar,language){var tokens=_.tokenize(text,grammar);return Token.stringify(_.util.encode(tokens),language)},tokenize:function(text,grammar,language){var Token=_.Token,strarr=[text],rest=grammar.rest;if(rest){for(var token in rest)grammar[token]=rest[token];delete grammar.rest}tokenloop:for(var token in grammar)if(grammar.hasOwnProperty(token)&&grammar[token]){var patterns=grammar[token];patterns="Array"===_.util.type(patterns)?patterns:[patterns];for(var j=0;j<patterns.length;++j){var pattern=patterns[j],inside=pattern.inside,lookbehind=!!pattern.lookbehind,greedy=!!pattern.greedy,lookbehindLength=0,alias=pattern.alias;if(greedy&&!pattern.pattern.global){var flags=pattern.pattern.toString().match(/[imuy]*$/)[0];pattern.pattern=RegExp(pattern.pattern.source,flags+"g")}pattern=pattern.pattern||pattern;for(var i=0,pos=0;i<strarr.length;pos+=strarr[i].length,++i){var str=strarr[i];if(strarr.length>text.length)break tokenloop;if(!(str instanceof Token)){pattern.lastIndex=0;var match=pattern.exec(str),delNum=1;if(!match&&greedy&&i!=strarr.length-1){if(pattern.lastIndex=pos,!(match=pattern.exec(text)))break;for(var from=match.index+(lookbehind?match[1].length:0),to=match.index+match[0].length,k=i,p=pos,len=strarr.length;k<len&&p<to;++k)p+=strarr[k].length,from>=p&&(++i,pos=p);if(strarr[i]instanceof Token||strarr[k-1].greedy)continue;delNum=k-i,str=text.slice(pos,p),match.index-=pos}if(match){lookbehind&&(lookbehindLength=match[1].length);var from=match.index+lookbehindLength,match=match[0].slice(lookbehindLength),to=from+match.length,before=str.slice(0,from),after=str.slice(to),args=[i,delNum];before&&args.push(before);var wrapped=new Token(token,inside?_.tokenize(match,inside):match,alias,match,greedy);args.push(wrapped),after&&args.push(after),Array.prototype.splice.apply(strarr,args)}}}}}return strarr},hooks:{all:{},add:function(name,callback){var hooks=_.hooks.all;hooks[name]=hooks[name]||[],hooks[name].push(callback)},run:function(name,env){var callbacks=_.hooks.all[name];if(callbacks&&callbacks.length)for(var callback,i=0;callback=callbacks[i++];)callback(env)}}},Token=_.Token=function(type,content,alias,matchedStr,greedy){this.type=type,this.content=content,this.alias=alias,this.length=0|(matchedStr||"").length,this.greedy=!!greedy};if(Token.stringify=function(o,language,parent){if("string"==typeof o)return o;if("Array"===_.util.type(o))return o.map(function(element){return Token.stringify(element,language,o)}).join("");var env={type:o.type,content:Token.stringify(o.content,language,parent),tag:"span",classes:["token",o.type],attributes:{},language:language,parent:parent};if("comment"==env.type&&(env.attributes.spellcheck="true"),o.alias){var aliases="Array"===_.util.type(o.alias)?o.alias:[o.alias];Array.prototype.push.apply(env.classes,aliases)}_.hooks.run("wrap",env);var attributes=Object.keys(env.attributes).map(function(name){return name+'="'+(env.attributes[name]||"").replace(/"/g,"&quot;")+'"'}).join(" ");return"<"+env.tag+' class="'+env.classes.join(" ")+'"'+(attributes?" "+attributes:"")+">"+env.content+"</"+env.tag+">"},!_self.document)return _self.addEventListener?(_self.addEventListener("message",function(evt){var message=JSON.parse(evt.data),lang=message.language,code=message.code,immediateClose=message.immediateClose;_self.postMessage(_.highlight(code,_.languages[lang],lang)),immediateClose&&_self.close()},!1),_self.Prism):_self.Prism;var script=document.currentScript||[].slice.call(document.getElementsByTagName("script")).pop();return script&&(_.filename=script.src,document.addEventListener&&!script.hasAttribute("data-manual")&&("loading"!==document.readyState?window.requestAnimationFrame?window.requestAnimationFrame(_.highlightAll):window.setTimeout(_.highlightAll,16):document.addEventListener("DOMContentLoaded",_.highlightAll))),_self.Prism}();void 0!==module&&module.exports&&(module.exports=Prism),void 0!==global&&(global.Prism=Prism),Prism.languages.markup={comment:/<!--[\w\W]*?-->/,prolog:/<\?[\w\W]+?\?>/,doctype:/<!DOCTYPE[\w\W]+?>/i,cdata:/<!\[CDATA\[[\w\W]*?]]>/i,tag:{pattern:/<\/?(?!\d)[^\s>\/=$<]+(?:\s+[^\s>\/=]+(?:=(?:("|')(?:\\\1|\\?(?!\1)[\w\W])*\1|[^\s'">=]+))?)*\s*\/?>/i,inside:{tag:{pattern:/^<\/?[^\s>\/]+/i,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"attr-value":{pattern:/=(?:('|")[\w\W]*?(\1)|[^\s>]+)/i,inside:{punctuation:/[=>"']/}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:/&#?[\da-z]{1,8};/i},Prism.hooks.add("wrap",function(env){"entity"===env.type&&(env.attributes.title=env.content.replace(/&amp;/,"&"))}),Prism.languages.xml=Prism.languages.markup,Prism.languages.html=Prism.languages.markup,Prism.languages.mathml=Prism.languages.markup,Prism.languages.svg=Prism.languages.markup,Prism.languages.css={comment:/\/\*[\w\W]*?\*\//,atrule:{pattern:/@[\w-]+?.*?(;|(?=\s*\{))/i,inside:{rule:/@[\w-]+/}},url:/url\((?:(["'])(\\(?:\r\n|[\w\W])|(?!\1)[^\\\r\n])*\1|.*?)\)/i,selector:/[^\{\}\s][^\{\};]*?(?=\s*\{)/,string:{pattern:/("|')(\\(?:\r\n|[\w\W])|(?!\1)[^\\\r\n])*\1/,greedy:!0},property:/(\b|\B)[\w-]+(?=\s*:)/i,important:/\B!important\b/i,function:/[-a-z0-9]+(?=\()/i,punctuation:/[(){};:]/},Prism.languages.css.atrule.inside.rest=Prism.util.clone(Prism.languages.css),Prism.languages.markup&&(Prism.languages.insertBefore("markup","tag",{style:{pattern:/(<style[\w\W]*?>)[\w\W]*?(?=<\/style>)/i,lookbehind:!0,inside:Prism.languages.css,alias:"language-css"}}),Prism.languages.insertBefore("inside","attr-value",{"style-attr":{pattern:/\s*style=("|').*?\1/i,inside:{"attr-name":{pattern:/^\s*style/i,inside:Prism.languages.markup.tag.inside},punctuation:/^\s*=\s*['"]|['"]\s*$/,"attr-value":{pattern:/.+/i,inside:Prism.languages.css}},alias:"language-css"}},Prism.languages.markup.tag)),Prism.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\w\W]*?\*\//,lookbehind:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0}],string:{pattern:/(["'])(\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/((?:\b(?:class|interface|extends|implements|trait|instanceof|new)\s+)|(?:catch\s+\())[a-z0-9_\.\\]+/i,lookbehind:!0,inside:{punctuation:/(\.|\\)/}},keyword:/\b(if|else|while|do|for|return|in|instanceof|function|new|try|throw|catch|finally|null|break|continue)\b/,boolean:/\b(true|false)\b/,function:/[a-z0-9_]+(?=\()/i,number:/\b-?(?:0x[\da-f]+|\d*\.?\d+(?:e[+-]?\d+)?)\b/i,operator:/--?|\+\+?|!=?=?|<=?|>=?|==?=?|&&?|\|\|?|\?|\*|\/|~|\^|%/,punctuation:/[{}[\];(),.:]/},Prism.languages.javascript=Prism.languages.extend("clike",{keyword:/\b(as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|var|void|while|with|yield)\b/,number:/\b-?(0x[\dA-Fa-f]+|0b[01]+|0o[0-7]+|\d*\.?\d+([Ee][+-]?\d+)?|NaN|Infinity)\b/,function:/[_$a-zA-Z\xA0-\uFFFF][_$a-zA-Z0-9\xA0-\uFFFF]*(?=\()/i,operator:/--?|\+\+?|!=?=?|<=?|>=?|==?=?|&&?|\|\|?|\?|\*\*?|\/|~|\^|%|\.{3}/}),Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:/(^|[^\/])\/(?!\/)(\[.+?]|\\.|[^\/\\\r\n])+\/[gimyu]{0,5}(?=\s*($|[\r\n,.;})]))/,lookbehind:!0,greedy:!0}}),Prism.languages.insertBefore("javascript","string",{"template-string":{pattern:/`(?:\\\\|\\?[^\\])*?`/,greedy:!0,inside:{interpolation:{pattern:/\$\{[^}]+\}/,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}}}),Prism.languages.markup&&Prism.languages.insertBefore("markup","tag",{script:{pattern:/(<script[\w\W]*?>)[\w\W]*?(?=<\/script>)/i,lookbehind:!0,inside:Prism.languages.javascript,alias:"language-javascript"}}),Prism.languages.js=Prism.languages.javascript,function(){"undefined"!=typeof self&&self.Prism&&self.document&&document.querySelector&&(self.Prism.fileHighlight=function(){var Extensions={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"};Array.prototype.forEach&&Array.prototype.slice.call(document.querySelectorAll("pre[data-src]")).forEach(function(pre){for(var language,src=pre.getAttribute("data-src"),parent=pre,lang=/\blang(?:uage)?-(?!\*)(\w+)\b/i;parent&&!lang.test(parent.className);)parent=parent.parentNode;if(parent&&(language=(pre.className.match(lang)||[,""])[1]),!language){var extension=(src.match(/\.(\w+)$/)||[,""])[1];language=Extensions[extension]||extension}var code=document.createElement("code");code.className="language-"+language,pre.textContent="",code.textContent="Loading…",pre.appendChild(code);var xhr=new XMLHttpRequest;xhr.open("GET",src,!0),xhr.onreadystatechange=function(){4==xhr.readyState&&(xhr.status<400&&xhr.responseText?(code.textContent=xhr.responseText,Prism.highlightElement(code)):xhr.status>=400?code.textContent="✖ Error "+xhr.status+" while fetching file: "+xhr.statusText:code.textContent="✖ Error: File does not exist or is empty")},xhr.send(null)})},document.addEventListener("DOMContentLoaded",self.Prism.fileHighlight))}()}).call(exports,__webpack_require__(46))},function(module,exports,__webpack_require__){"use strict";var factory=__webpack_require__(101);module.exports=function(isValidElement){return factory(isValidElement,!1)}},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyFunction=__webpack_require__(12),invariant=__webpack_require__(1),warning=__webpack_require__(2),ReactPropTypesSecret=__webpack_require__(53),checkPropTypes=__webpack_require__(224);module.exports=function(isValidElement,throwOnDirectAccess){function getIteratorFn(maybeIterable){var iteratorFn=maybeIterable&&(ITERATOR_SYMBOL&&maybeIterable[ITERATOR_SYMBOL]||maybeIterable[FAUX_ITERATOR_SYMBOL]);if("function"==typeof iteratorFn)return iteratorFn}function is(x,y){return x===y?0!==x||1/x==1/y:x!==x&&y!==y}function PropTypeError(message){this.message=message,this.stack=""}function createChainableTypeChecker(validate){function checkType(isRequired,props,propName,componentName,location,propFullName,secret){if(componentName=componentName||ANONYMOUS,propFullName=propFullName||propName,secret!==ReactPropTypesSecret)if(throwOnDirectAccess)invariant(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types");else if("production"!==process.env.NODE_ENV&&"undefined"!=typeof console){var cacheKey=componentName+":"+propName;!manualPropTypeCallCache[cacheKey]&&manualPropTypeWarningCount<3&&(warning(!1,"You are manually calling a React.PropTypes validation function for the `%s` prop on `%s`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details.",propFullName,componentName),manualPropTypeCallCache[cacheKey]=!0,manualPropTypeWarningCount++)}return null==props[propName]?isRequired?new PropTypeError(null===props[propName]?"The "+location+" `"+propFullName+"` is marked as required in `"+componentName+"`, but its value is `null`.":"The "+location+" `"+propFullName+"` is marked as required in `"+componentName+"`, but its value is `undefined`."):null:validate(props,propName,componentName,location,propFullName)}if("production"!==process.env.NODE_ENV)var manualPropTypeCallCache={},manualPropTypeWarningCount=0;var chainedCheckType=checkType.bind(null,!1);return chainedCheckType.isRequired=checkType.bind(null,!0),chainedCheckType}function createPrimitiveTypeChecker(expectedType){function validate(props,propName,componentName,location,propFullName,secret){var propValue=props[propName];if(getPropType(propValue)!==expectedType)return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getPreciseType(propValue)+"` supplied to `"+componentName+"`, expected `"+expectedType+"`.");return null}return createChainableTypeChecker(validate)}function createArrayOfTypeChecker(typeChecker){function validate(props,propName,componentName,location,propFullName){if("function"!=typeof typeChecker)return new PropTypeError("Property `"+propFullName+"` of component `"+componentName+"` has invalid PropType notation inside arrayOf.");var propValue=props[propName];if(!Array.isArray(propValue)){return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getPropType(propValue)+"` supplied to `"+componentName+"`, expected an array.")}for(var i=0;i<propValue.length;i++){var error=typeChecker(propValue,i,componentName,location,propFullName+"["+i+"]",ReactPropTypesSecret);if(error instanceof Error)return error}return null}return createChainableTypeChecker(validate)}function createInstanceTypeChecker(expectedClass){function validate(props,propName,componentName,location,propFullName){if(!(props[propName]instanceof expectedClass)){var expectedClassName=expectedClass.name||ANONYMOUS;return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getClassName(props[propName])+"` supplied to `"+componentName+"`, expected instance of `"+expectedClassName+"`.")}return null}return createChainableTypeChecker(validate)}function createEnumTypeChecker(expectedValues){function validate(props,propName,componentName,location,propFullName){for(var propValue=props[propName],i=0;i<expectedValues.length;i++)if(is(propValue,expectedValues[i]))return null;return new PropTypeError("Invalid "+location+" `"+propFullName+"` of value `"+propValue+"` supplied to `"+componentName+"`, expected one of "+JSON.stringify(expectedValues)+".")}return Array.isArray(expectedValues)?createChainableTypeChecker(validate):("production"!==process.env.NODE_ENV&&warning(!1,"Invalid argument supplied to oneOf, expected an instance of array."),emptyFunction.thatReturnsNull)}function createObjectOfTypeChecker(typeChecker){function validate(props,propName,componentName,location,propFullName){if("function"!=typeof typeChecker)return new PropTypeError("Property `"+propFullName+"` of component `"+componentName+"` has invalid PropType notation inside objectOf.");var propValue=props[propName],propType=getPropType(propValue);if("object"!==propType)return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+propType+"` supplied to `"+componentName+"`, expected an object.");for(var key in propValue)if(propValue.hasOwnProperty(key)){var error=typeChecker(propValue,key,componentName,location,propFullName+"."+key,ReactPropTypesSecret);if(error instanceof Error)return error}return null}return createChainableTypeChecker(validate)}function createUnionTypeChecker(arrayOfTypeCheckers){function validate(props,propName,componentName,location,propFullName){for(var i=0;i<arrayOfTypeCheckers.length;i++){if(null==(0,arrayOfTypeCheckers[i])(props,propName,componentName,location,propFullName,ReactPropTypesSecret))return null}return new PropTypeError("Invalid "+location+" `"+propFullName+"` supplied to `"+componentName+"`.")}if(!Array.isArray(arrayOfTypeCheckers))return"production"!==process.env.NODE_ENV&&warning(!1,"Invalid argument supplied to oneOfType, expected an instance of array."),emptyFunction.thatReturnsNull;for(var i=0;i<arrayOfTypeCheckers.length;i++){var checker=arrayOfTypeCheckers[i];if("function"!=typeof checker)return warning(!1,"Invalid argument supplid to oneOfType. Expected an array of check functions, but received %s at index %s.",getPostfixForTypeWarning(checker),i),emptyFunction.thatReturnsNull}return createChainableTypeChecker(validate)}function createShapeTypeChecker(shapeTypes){function validate(props,propName,componentName,location,propFullName){var propValue=props[propName],propType=getPropType(propValue);if("object"!==propType)return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+propType+"` supplied to `"+componentName+"`, expected `object`.");for(var key in shapeTypes){var checker=shapeTypes[key];if(checker){var error=checker(propValue,key,componentName,location,propFullName+"."+key,ReactPropTypesSecret);if(error)return error}}return null}return createChainableTypeChecker(validate)}function isNode(propValue){switch(typeof propValue){case"number":case"string":case"undefined":return!0;case"boolean":return!propValue;case"object":if(Array.isArray(propValue))return propValue.every(isNode);if(null===propValue||isValidElement(propValue))return!0;var iteratorFn=getIteratorFn(propValue);if(!iteratorFn)return!1;var step,iterator=iteratorFn.call(propValue);if(iteratorFn!==propValue.entries){for(;!(step=iterator.next()).done;)if(!isNode(step.value))return!1}else for(;!(step=iterator.next()).done;){var entry=step.value;if(entry&&!isNode(entry[1]))return!1}return!0;default:return!1}}function isSymbol(propType,propValue){return"symbol"===propType||("Symbol"===propValue["@@toStringTag"]||"function"==typeof Symbol&&propValue instanceof Symbol)}function getPropType(propValue){var propType=typeof propValue;return Array.isArray(propValue)?"array":propValue instanceof RegExp?"object":isSymbol(propType,propValue)?"symbol":propType}function getPreciseType(propValue){if(void 0===propValue||null===propValue)return""+propValue;var propType=getPropType(propValue);if("object"===propType){if(propValue instanceof Date)return"date";if(propValue instanceof RegExp)return"regexp"}return propType}function getPostfixForTypeWarning(value){var type=getPreciseType(value);switch(type){case"array":case"object":return"an "+type;case"boolean":case"date":case"regexp":return"a "+type;default:return type}}function getClassName(propValue){return propValue.constructor&&propValue.constructor.name?propValue.constructor.name:ANONYMOUS}var ITERATOR_SYMBOL="function"==typeof Symbol&&Symbol.iterator,FAUX_ITERATOR_SYMBOL="@@iterator",ANONYMOUS="<<anonymous>>",ReactPropTypes={array:createPrimitiveTypeChecker("array"),bool:createPrimitiveTypeChecker("boolean"),func:createPrimitiveTypeChecker("function"),number:createPrimitiveTypeChecker("number"),object:createPrimitiveTypeChecker("object"),string:createPrimitiveTypeChecker("string"),symbol:createPrimitiveTypeChecker("symbol"),any:function(){return createChainableTypeChecker(emptyFunction.thatReturnsNull)}(),arrayOf:createArrayOfTypeChecker,element:function(){function validate(props,propName,componentName,location,propFullName){var propValue=props[propName];if(!isValidElement(propValue)){return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getPropType(propValue)+"` supplied to `"+componentName+"`, expected a single ReactElement.")}return null}return createChainableTypeChecker(validate)}(),instanceOf:createInstanceTypeChecker,node:function(){function validate(props,propName,componentName,location,propFullName){return isNode(props[propName])?null:new PropTypeError("Invalid "+location+" `"+propFullName+"` supplied to `"+componentName+"`, expected a ReactNode.")}return createChainableTypeChecker(validate)}(),objectOf:createObjectOfTypeChecker,oneOf:createEnumTypeChecker,oneOfType:createUnionTypeChecker,shape:createShapeTypeChecker};return PropTypeError.prototype=Error.prototype,ReactPropTypes.checkPropTypes=checkPropTypes,ReactPropTypes.PropTypes=ReactPropTypes,ReactPropTypes}}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function prefixKey(prefix,key){return prefix+key.charAt(0).toUpperCase()+key.substring(1)}var isUnitlessNumber={animationIterationCount:!0,borderImageOutset:!0,borderImageSlice:!0,borderImageWidth:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,gridRow:!0,gridRowEnd:!0,gridRowSpan:!0,gridRowStart:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnSpan:!0,gridColumnStart:!0,fontWeight:!0,lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0,zoom:!0,fillOpacity:!0,floodOpacity:!0,stopOpacity:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0},prefixes=["Webkit","ms","Moz","O"];Object.keys(isUnitlessNumber).forEach(function(prop){prefixes.forEach(function(prefix){isUnitlessNumber[prefixKey(prefix,prop)]=isUnitlessNumber[prop]})});var shorthandPropertyExpansions={background:{backgroundAttachment:!0,backgroundColor:!0,backgroundImage:!0,backgroundPositionX:!0,backgroundPositionY:!0,backgroundRepeat:!0},backgroundPosition:{backgroundPositionX:!0,backgroundPositionY:!0},border:{borderWidth:!0,borderStyle:!0,borderColor:!0},borderBottom:{borderBottomWidth:!0,borderBottomStyle:!0,borderBottomColor:!0},borderLeft:{borderLeftWidth:!0,borderLeftStyle:!0,borderLeftColor:!0},borderRight:{borderRightWidth:!0,borderRightStyle:!0,borderRightColor:!0},borderTop:{borderTopWidth:!0,borderTopStyle:!0,borderTopColor:!0},font:{fontStyle:!0,fontVariant:!0,fontWeight:!0,fontSize:!0,lineHeight:!0,fontFamily:!0},outline:{outlineWidth:!0,outlineStyle:!0,outlineColor:!0}},CSSProperty={isUnitlessNumber:isUnitlessNumber,shorthandPropertyExpansions:shorthandPropertyExpansions};module.exports=CSSProperty},function(module,exports,__webpack_require__){"use strict";(function(process){function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}var _prodInvariant=__webpack_require__(4),PooledClass=__webpack_require__(23),invariant=__webpack_require__(1),CallbackQueue=function(){function CallbackQueue(arg){_classCallCheck(this,CallbackQueue),this._callbacks=null,this._contexts=null,this._arg=arg}return CallbackQueue.prototype.enqueue=function(callback,context){this._callbacks=this._callbacks||[],this._callbacks.push(callback),this._contexts=this._contexts||[],this._contexts.push(context)},CallbackQueue.prototype.notifyAll=function(){var callbacks=this._callbacks,contexts=this._contexts,arg=this._arg;if(callbacks&&contexts){callbacks.length!==contexts.length&&("production"!==process.env.NODE_ENV?invariant(!1,"Mismatched list of contexts in callback queue"):_prodInvariant("24")),this._callbacks=null,this._contexts=null;for(var i=0;i<callbacks.length;i++)callbacks[i].call(contexts[i],arg);callbacks.length=0,contexts.length=0}},CallbackQueue.prototype.checkpoint=function(){return this._callbacks?this._callbacks.length:0},CallbackQueue.prototype.rollback=function(len){this._callbacks&&this._contexts&&(this._callbacks.length=len,this._contexts.length=len)},CallbackQueue.prototype.reset=function(){this._callbacks=null,this._contexts=null},CallbackQueue.prototype.destructor=function(){this.reset()},CallbackQueue}();module.exports=PooledClass.addPoolingTo(CallbackQueue)}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function isAttributeNameSafe(attributeName){return!!validatedAttributeNameCache.hasOwnProperty(attributeName)||!illegalAttributeNameCache.hasOwnProperty(attributeName)&&(VALID_ATTRIBUTE_NAME_REGEX.test(attributeName)?(validatedAttributeNameCache[attributeName]=!0,!0):(illegalAttributeNameCache[attributeName]=!0,"production"!==process.env.NODE_ENV&&warning(!1,"Invalid attribute name: `%s`",attributeName),!1))}function shouldIgnoreValue(propertyInfo,value){return null==value||propertyInfo.hasBooleanValue&&!value||propertyInfo.hasNumericValue&&isNaN(value)||propertyInfo.hasPositiveNumericValue&&value<1||propertyInfo.hasOverloadedBooleanValue&&!1===value}var DOMProperty=__webpack_require__(21),ReactDOMComponentTree=__webpack_require__(8),ReactInstrumentation=__webpack_require__(14),quoteAttributeValueForBrowser=__webpack_require__(295),warning=__webpack_require__(2),VALID_ATTRIBUTE_NAME_REGEX=new RegExp("^["+DOMProperty.ATTRIBUTE_NAME_START_CHAR+"]["+DOMProperty.ATTRIBUTE_NAME_CHAR+"]*$"),illegalAttributeNameCache={},validatedAttributeNameCache={},DOMPropertyOperations={createMarkupForID:function(id){return DOMProperty.ID_ATTRIBUTE_NAME+"="+quoteAttributeValueForBrowser(id)},setAttributeForID:function(node,id){node.setAttribute(DOMProperty.ID_ATTRIBUTE_NAME,id)},createMarkupForRoot:function(){return DOMProperty.ROOT_ATTRIBUTE_NAME+'=""'},setAttributeForRoot:function(node){node.setAttribute(DOMProperty.ROOT_ATTRIBUTE_NAME,"")},createMarkupForProperty:function(name,value){var propertyInfo=DOMProperty.properties.hasOwnProperty(name)?DOMProperty.properties[name]:null;if(propertyInfo){if(shouldIgnoreValue(propertyInfo,value))return"";var attributeName=propertyInfo.attributeName;return propertyInfo.hasBooleanValue||propertyInfo.hasOverloadedBooleanValue&&!0===value?attributeName+'=""':attributeName+"="+quoteAttributeValueForBrowser(value)}return DOMProperty.isCustomAttribute(name)?null==value?"":name+"="+quoteAttributeValueForBrowser(value):null},createMarkupForCustomAttribute:function(name,value){return isAttributeNameSafe(name)&&null!=value?name+"="+quoteAttributeValueForBrowser(value):""},setValueForProperty:function(node,name,value){var propertyInfo=DOMProperty.properties.hasOwnProperty(name)?DOMProperty.properties[name]:null;if(propertyInfo){var mutationMethod=propertyInfo.mutationMethod;if(mutationMethod)mutationMethod(node,value);else{if(shouldIgnoreValue(propertyInfo,value))return void this.deleteValueForProperty(node,name);if(propertyInfo.mustUseProperty)node[propertyInfo.propertyName]=value;else{var attributeName=propertyInfo.attributeName,namespace=propertyInfo.attributeNamespace;namespace?node.setAttributeNS(namespace,attributeName,""+value):propertyInfo.hasBooleanValue||propertyInfo.hasOverloadedBooleanValue&&!0===value?node.setAttribute(attributeName,""):node.setAttribute(attributeName,""+value)}}}else if(DOMProperty.isCustomAttribute(name))return void DOMPropertyOperations.setValueForAttribute(node,name,value);if("production"!==process.env.NODE_ENV){var payload={};payload[name]=value,ReactInstrumentation.debugTool.onHostOperation({instanceID:ReactDOMComponentTree.getInstanceFromNode(node)._debugID,type:"update attribute",payload:payload})}},setValueForAttribute:function(node,name,value){if(isAttributeNameSafe(name)&&(null==value?node.removeAttribute(name):node.setAttribute(name,""+value),"production"!==process.env.NODE_ENV)){var payload={};payload[name]=value,ReactInstrumentation.debugTool.onHostOperation({instanceID:ReactDOMComponentTree.getInstanceFromNode(node)._debugID,type:"update attribute",payload:payload})}},deleteValueForAttribute:function(node,name){node.removeAttribute(name),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:ReactDOMComponentTree.getInstanceFromNode(node)._debugID,type:"remove attribute",payload:name})},deleteValueForProperty:function(node,name){var propertyInfo=DOMProperty.properties.hasOwnProperty(name)?DOMProperty.properties[name]:null;if(propertyInfo){var mutationMethod=propertyInfo.mutationMethod;if(mutationMethod)mutationMethod(node,void 0);else if(propertyInfo.mustUseProperty){var propName=propertyInfo.propertyName;propertyInfo.hasBooleanValue?node[propName]=!1:node[propName]=""}else node.removeAttribute(propertyInfo.attributeName)}else DOMProperty.isCustomAttribute(name)&&node.removeAttribute(name);"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:ReactDOMComponentTree.getInstanceFromNode(node)._debugID,type:"remove attribute",payload:name})}};module.exports=DOMPropertyOperations}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var ReactDOMComponentFlags={hasCachedChildNodes:1};module.exports=ReactDOMComponentFlags},function(module,exports,__webpack_require__){"use strict";(function(process){function updateOptionsIfPendingUpdateAndMounted(){if(this._rootNodeID&&this._wrapperState.pendingUpdate){this._wrapperState.pendingUpdate=!1;var props=this._currentElement.props,value=LinkedValueUtils.getValue(props);null!=value&&updateOptions(this,Boolean(props.multiple),value)}}function getDeclarationErrorAddendum(owner){if(owner){var name=owner.getName();if(name)return" Check the render method of `"+name+"`."}return""}function checkSelectPropTypes(inst,props){var owner=inst._currentElement._owner;LinkedValueUtils.checkPropTypes("select",props,owner),void 0===props.valueLink||didWarnValueLink||("production"!==process.env.NODE_ENV&&warning(!1,"`valueLink` prop on `select` is deprecated; set `value` and `onChange` instead."),didWarnValueLink=!0);for(var i=0;i<valuePropNames.length;i++){var propName=valuePropNames[i];if(null!=props[propName]){var isArray=Array.isArray(props[propName]);props.multiple&&!isArray?"production"!==process.env.NODE_ENV&&warning(!1,"The `%s` prop supplied to <select> must be an array if `multiple` is true.%s",propName,getDeclarationErrorAddendum(owner)):!props.multiple&&isArray&&"production"!==process.env.NODE_ENV&&warning(!1,"The `%s` prop supplied to <select> must be a scalar value if `multiple` is false.%s",propName,getDeclarationErrorAddendum(owner))}}}function updateOptions(inst,multiple,propValue){var selectedValue,i,options=ReactDOMComponentTree.getNodeFromInstance(inst).options;if(multiple){for(selectedValue={},i=0;i<propValue.length;i++)selectedValue[""+propValue[i]]=!0;for(i=0;i<options.length;i++){var selected=selectedValue.hasOwnProperty(options[i].value);options[i].selected!==selected&&(options[i].selected=selected)}}else{for(selectedValue=""+propValue,i=0;i<options.length;i++)if(options[i].value===selectedValue)return void(options[i].selected=!0);options.length&&(options[0].selected=!0)}}function _handleChange(event){var props=this._currentElement.props,returnValue=LinkedValueUtils.executeOnChange(props,event);return this._rootNodeID&&(this._wrapperState.pendingUpdate=!0),ReactUpdates.asap(updateOptionsIfPendingUpdateAndMounted,this),returnValue}var _assign=__webpack_require__(7),LinkedValueUtils=__webpack_require__(58),ReactDOMComponentTree=__webpack_require__(8),ReactUpdates=__webpack_require__(17),warning=__webpack_require__(2),didWarnValueLink=!1,didWarnValueDefaultValue=!1,valuePropNames=["value","defaultValue"],ReactDOMSelect={getHostProps:function(inst,props){return _assign({},props,{onChange:inst._wrapperState.onChange,value:void 0})},mountWrapper:function(inst,props){"production"!==process.env.NODE_ENV&&checkSelectPropTypes(inst,props);var value=LinkedValueUtils.getValue(props);inst._wrapperState={pendingUpdate:!1,initialValue:null!=value?value:props.defaultValue,listeners:null,onChange:_handleChange.bind(inst),wasMultiple:Boolean(props.multiple)},void 0===props.value||void 0===props.defaultValue||didWarnValueDefaultValue||("production"!==process.env.NODE_ENV&&warning(!1,"Select elements must be either controlled or uncontrolled (specify either the value prop, or the defaultValue prop, but not both). Decide between using a controlled or uncontrolled select element and remove one of these props. More info: https://fb.me/react-controlled-components"),didWarnValueDefaultValue=!0)},getSelectValueContext:function(inst){return inst._wrapperState.initialValue},postUpdateWrapper:function(inst){var props=inst._currentElement.props;inst._wrapperState.initialValue=void 0;var wasMultiple=inst._wrapperState.wasMultiple;inst._wrapperState.wasMultiple=Boolean(props.multiple);var value=LinkedValueUtils.getValue(props);null!=value?(inst._wrapperState.pendingUpdate=!1,updateOptions(inst,Boolean(props.multiple),value)):wasMultiple!==Boolean(props.multiple)&&(null!=props.defaultValue?updateOptions(inst,Boolean(props.multiple),props.defaultValue):updateOptions(inst,Boolean(props.multiple),props.multiple?[]:""))}};module.exports=ReactDOMSelect}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var emptyComponentFactory,ReactEmptyComponentInjection={injectEmptyComponentFactory:function(factory){emptyComponentFactory=factory}},ReactEmptyComponent={create:function(instantiate){return emptyComponentFactory(instantiate)}};ReactEmptyComponent.injection=ReactEmptyComponentInjection,module.exports=ReactEmptyComponent},function(module,exports,__webpack_require__){"use strict";var ReactFeatureFlags={logTopLevelRenders:!1};module.exports=ReactFeatureFlags},function(module,exports,__webpack_require__){"use strict";(function(process){function createInternalComponent(element){return genericComponentClass||("production"!==process.env.NODE_ENV?invariant(!1,"There is no registered component for the tag %s",element.type):_prodInvariant("111",element.type)),new genericComponentClass(element)}function createInstanceForText(text){return new textComponentClass(text)}function isTextComponent(component){return component instanceof textComponentClass}var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),genericComponentClass=null,textComponentClass=null,ReactHostComponentInjection={injectGenericComponentClass:function(componentClass){genericComponentClass=componentClass},injectTextComponentClass:function(componentClass){textComponentClass=componentClass}},ReactHostComponent={createInternalComponent:createInternalComponent,createInstanceForText:createInstanceForText,isTextComponent:isTextComponent,injection:ReactHostComponentInjection};module.exports=ReactHostComponent}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function isInDocument(node){return containsNode(document.documentElement,node)}var ReactDOMSelection=__webpack_require__(250),containsNode=__webpack_require__(189),focusNode=__webpack_require__(94),getActiveElement=__webpack_require__(95),ReactInputSelection={hasSelectionCapabilities:function(elem){var nodeName=elem&&elem.nodeName&&elem.nodeName.toLowerCase();return nodeName&&("input"===nodeName&&"text"===elem.type||"textarea"===nodeName||"true"===elem.contentEditable)},getSelectionInformation:function(){var focusedElem=getActiveElement();return{focusedElem:focusedElem,selectionRange:ReactInputSelection.hasSelectionCapabilities(focusedElem)?ReactInputSelection.getSelection(focusedElem):null}},restoreSelection:function(priorSelectionInformation){var curFocusedElem=getActiveElement(),priorFocusedElem=priorSelectionInformation.focusedElem,priorSelectionRange=priorSelectionInformation.selectionRange;curFocusedElem!==priorFocusedElem&&isInDocument(priorFocusedElem)&&(ReactInputSelection.hasSelectionCapabilities(priorFocusedElem)&&ReactInputSelection.setSelection(priorFocusedElem,priorSelectionRange),focusNode(priorFocusedElem))},getSelection:function(input){var selection;if("selectionStart"in input)selection={start:input.selectionStart,end:input.selectionEnd};else if(document.selection&&input.nodeName&&"input"===input.nodeName.toLowerCase()){var range=document.selection.createRange();range.parentElement()===input&&(selection={start:-range.moveStart("character",-input.value.length),end:-range.moveEnd("character",-input.value.length)})}else selection=ReactDOMSelection.getOffsets(input);return selection||{start:0,end:0}},setSelection:function(input,offsets){var start=offsets.start,end=offsets.end;if(void 0===end&&(end=start),"selectionStart"in input)input.selectionStart=start,input.selectionEnd=Math.min(end,input.value.length);else if(document.selection&&input.nodeName&&"input"===input.nodeName.toLowerCase()){var range=input.createTextRange();range.collapse(!0),range.moveStart("character",start),range.moveEnd("character",end-start),range.select()}else ReactDOMSelection.setOffsets(input,offsets)}};module.exports=ReactInputSelection},function(module,exports,__webpack_require__){"use strict";(function(process){function firstDifferenceIndex(string1,string2){for(var minLen=Math.min(string1.length,string2.length),i=0;i<minLen;i++)if(string1.charAt(i)!==string2.charAt(i))return i;return string1.length===string2.length?-1:minLen}function getReactRootElementInContainer(container){return container?container.nodeType===DOC_NODE_TYPE?container.documentElement:container.firstChild:null}function internalGetID(node){return node.getAttribute&&node.getAttribute(ATTR_NAME)||""}function mountComponentIntoNode(wrapperInstance,container,transaction,shouldReuseMarkup,context){if(ReactFeatureFlags.logTopLevelRenders){var wrappedElement=wrapperInstance._currentElement.props.child,type=wrappedElement.type;"React mount: "+("string"==typeof type?type:type.displayName||type.name)}var markup=ReactReconciler.mountComponent(wrapperInstance,transaction,null,ReactDOMContainerInfo(wrapperInstance,container),context,0);wrapperInstance._renderedComponent._topLevelWrapper=wrapperInstance,ReactMount._mountImageIntoNode(markup,container,wrapperInstance,shouldReuseMarkup,transaction)}function batchedMountComponentIntoNode(componentInstance,container,shouldReuseMarkup,context){var transaction=ReactUpdates.ReactReconcileTransaction.getPooled(!shouldReuseMarkup&&ReactDOMFeatureFlags.useCreateElement);transaction.perform(mountComponentIntoNode,null,componentInstance,container,transaction,shouldReuseMarkup,context),ReactUpdates.ReactReconcileTransaction.release(transaction)}function unmountComponentFromNode(instance,container,safely){for("production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onBeginFlush(),ReactReconciler.unmountComponent(instance,safely),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onEndFlush(),container.nodeType===DOC_NODE_TYPE&&(container=container.documentElement);container.lastChild;)container.removeChild(container.lastChild)}function hasNonRootReactChild(container){var rootEl=getReactRootElementInContainer(container);if(rootEl){var inst=ReactDOMComponentTree.getInstanceFromNode(rootEl);return!(!inst||!inst._hostParent)}}function nodeIsRenderedByOtherInstance(container){var rootEl=getReactRootElementInContainer(container);return!(!rootEl||!isReactNode(rootEl)||ReactDOMComponentTree.getInstanceFromNode(rootEl))}function isValidContainer(node){return!(!node||node.nodeType!==ELEMENT_NODE_TYPE&&node.nodeType!==DOC_NODE_TYPE&&node.nodeType!==DOCUMENT_FRAGMENT_NODE_TYPE)}function isReactNode(node){return isValidContainer(node)&&(node.hasAttribute(ROOT_ATTR_NAME)||node.hasAttribute(ATTR_NAME))}function getHostRootInstanceInContainer(container){var rootEl=getReactRootElementInContainer(container),prevHostInstance=rootEl&&ReactDOMComponentTree.getInstanceFromNode(rootEl);return prevHostInstance&&!prevHostInstance._hostParent?prevHostInstance:null}function getTopLevelWrapperInContainer(container){var root=getHostRootInstanceInContainer(container);return root?root._hostContainerInfo._topLevelWrapper:null}var _prodInvariant=__webpack_require__(4),DOMLazyTree=__webpack_require__(26),DOMProperty=__webpack_require__(21),React=__webpack_require__(28),ReactBrowserEventEmitter=__webpack_require__(40),ReactCurrentOwner=__webpack_require__(18),ReactDOMComponentTree=__webpack_require__(8),ReactDOMContainerInfo=__webpack_require__(242),ReactDOMFeatureFlags=__webpack_require__(244),ReactFeatureFlags=__webpack_require__(108),ReactInstanceMap=__webpack_require__(32),ReactInstrumentation=__webpack_require__(14),ReactMarkupChecksum=__webpack_require__(264),ReactReconciler=__webpack_require__(27),ReactUpdateQueue=__webpack_require__(61),ReactUpdates=__webpack_require__(17),emptyObject=__webpack_require__(38),instantiateReactComponent=__webpack_require__(120),invariant=__webpack_require__(1),setInnerHTML=__webpack_require__(44),shouldUpdateReactComponent=__webpack_require__(67),warning=__webpack_require__(2),ATTR_NAME=DOMProperty.ID_ATTRIBUTE_NAME,ROOT_ATTR_NAME=DOMProperty.ROOT_ATTRIBUTE_NAME,ELEMENT_NODE_TYPE=1,DOC_NODE_TYPE=9,DOCUMENT_FRAGMENT_NODE_TYPE=11,instancesByReactRootID={},topLevelRootCounter=1,TopLevelWrapper=function(){this.rootID=topLevelRootCounter++};TopLevelWrapper.prototype.isReactComponent={},"production"!==process.env.NODE_ENV&&(TopLevelWrapper.displayName="TopLevelWrapper"),TopLevelWrapper.prototype.render=function(){return this.props.child},TopLevelWrapper.isReactTopLevelWrapper=!0;var ReactMount={TopLevelWrapper:TopLevelWrapper,_instancesByReactRootID:instancesByReactRootID,scrollMonitor:function(container,renderCallback){renderCallback()},_updateRootComponent:function(prevComponent,nextElement,nextContext,container,callback){return ReactMount.scrollMonitor(container,function(){ReactUpdateQueue.enqueueElementInternal(prevComponent,nextElement,nextContext),callback&&ReactUpdateQueue.enqueueCallbackInternal(prevComponent,callback)}),prevComponent},_renderNewRootComponent:function(nextElement,container,shouldReuseMarkup,context){"production"!==process.env.NODE_ENV&&warning(null==ReactCurrentOwner.current,"_renderNewRootComponent(): Render methods should be a pure function of props and state; triggering nested component updates from render is not allowed. If necessary, trigger nested updates in componentDidUpdate. Check the render method of %s.",ReactCurrentOwner.current&&ReactCurrentOwner.current.getName()||"ReactCompositeComponent"),isValidContainer(container)||("production"!==process.env.NODE_ENV?invariant(!1,"_registerComponent(...): Target container is not a DOM element."):_prodInvariant("37")),ReactBrowserEventEmitter.ensureScrollValueMonitoring();var componentInstance=instantiateReactComponent(nextElement,!1);ReactUpdates.batchedUpdates(batchedMountComponentIntoNode,componentInstance,container,shouldReuseMarkup,context);var wrapperID=componentInstance._instance.rootID;return instancesByReactRootID[wrapperID]=componentInstance,componentInstance},renderSubtreeIntoContainer:function(parentComponent,nextElement,container,callback){return null!=parentComponent&&ReactInstanceMap.has(parentComponent)||("production"!==process.env.NODE_ENV?invariant(!1,"parentComponent must be a valid React Component"):_prodInvariant("38")),ReactMount._renderSubtreeIntoContainer(parentComponent,nextElement,container,callback)},_renderSubtreeIntoContainer:function(parentComponent,nextElement,container,callback){ReactUpdateQueue.validateCallback(callback,"ReactDOM.render"),React.isValidElement(nextElement)||("production"!==process.env.NODE_ENV?invariant(!1,"ReactDOM.render(): Invalid component element.%s","string"==typeof nextElement?" Instead of passing a string like 'div', pass React.createElement('div') or <div />.":"function"==typeof nextElement?" Instead of passing a class like Foo, pass React.createElement(Foo) or <Foo />.":null!=nextElement&&void 0!==nextElement.props?" This may be caused by unintentionally loading two independent copies of React.":""):_prodInvariant("39","string"==typeof nextElement?" Instead of passing a string like 'div', pass React.createElement('div') or <div />.":"function"==typeof nextElement?" Instead of passing a class like Foo, pass React.createElement(Foo) or <Foo />.":null!=nextElement&&void 0!==nextElement.props?" This may be caused by unintentionally loading two independent copies of React.":"")),"production"!==process.env.NODE_ENV&&warning(!container||!container.tagName||"BODY"!==container.tagName.toUpperCase(),"render(): Rendering components directly into document.body is discouraged, since its children are often manipulated by third-party scripts and browser extensions. This may lead to subtle reconciliation issues. Try rendering into a container element created for your app.");var nextContext,nextWrappedElement=React.createElement(TopLevelWrapper,{child:nextElement});if(parentComponent){var parentInst=ReactInstanceMap.get(parentComponent);nextContext=parentInst._processChildContext(parentInst._context)}else nextContext=emptyObject;var prevComponent=getTopLevelWrapperInContainer(container);if(prevComponent){var prevWrappedElement=prevComponent._currentElement,prevElement=prevWrappedElement.props.child;if(shouldUpdateReactComponent(prevElement,nextElement)){var publicInst=prevComponent._renderedComponent.getPublicInstance(),updatedCallback=callback&&function(){callback.call(publicInst)};return ReactMount._updateRootComponent(prevComponent,nextWrappedElement,nextContext,container,updatedCallback),publicInst}ReactMount.unmountComponentAtNode(container)}var reactRootElement=getReactRootElementInContainer(container),containerHasReactMarkup=reactRootElement&&!!internalGetID(reactRootElement),containerHasNonRootReactChild=hasNonRootReactChild(container);if("production"!==process.env.NODE_ENV&&("production"!==process.env.NODE_ENV&&warning(!containerHasNonRootReactChild,"render(...): Replacing React-rendered children with a new root component. If you intended to update the children of this node, you should instead have the existing children update their state and render the new components instead of calling ReactDOM.render."),!containerHasReactMarkup||reactRootElement.nextSibling))for(var rootElementSibling=reactRootElement;rootElementSibling;){if(internalGetID(rootElementSibling)){"production"!==process.env.NODE_ENV&&warning(!1,"render(): Target node has markup rendered by React, but there are unrelated nodes as well. This is most commonly caused by white-space inserted around server-rendered markup.");break}rootElementSibling=rootElementSibling.nextSibling}var shouldReuseMarkup=containerHasReactMarkup&&!prevComponent&&!containerHasNonRootReactChild,component=ReactMount._renderNewRootComponent(nextWrappedElement,container,shouldReuseMarkup,nextContext)._renderedComponent.getPublicInstance();return callback&&callback.call(component),component},render:function(nextElement,container,callback){return ReactMount._renderSubtreeIntoContainer(null,nextElement,container,callback)},unmountComponentAtNode:function(container){"production"!==process.env.NODE_ENV&&warning(null==ReactCurrentOwner.current,"unmountComponentAtNode(): Render methods should be a pure function of props and state; triggering nested component updates from render is not allowed. If necessary, trigger nested updates in componentDidUpdate. Check the render method of %s.",ReactCurrentOwner.current&&ReactCurrentOwner.current.getName()||"ReactCompositeComponent"),isValidContainer(container)||("production"!==process.env.NODE_ENV?invariant(!1,"unmountComponentAtNode(...): Target container is not a DOM element."):_prodInvariant("40")),"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(!nodeIsRenderedByOtherInstance(container),"unmountComponentAtNode(): The node you're attempting to unmount was rendered by another copy of React.");var prevComponent=getTopLevelWrapperInContainer(container);if(!prevComponent){var containerHasNonRootReactChild=hasNonRootReactChild(container),isContainerReactRoot=1===container.nodeType&&container.hasAttribute(ROOT_ATTR_NAME);return"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(!containerHasNonRootReactChild,"unmountComponentAtNode(): The node you're attempting to unmount was rendered by React and is not a top-level container. %s",isContainerReactRoot?"You may have accidentally passed in a React root node instead of its container.":"Instead, have the parent component update its state and rerender in order to remove this component."),!1}return delete instancesByReactRootID[prevComponent._instance.rootID],ReactUpdates.batchedUpdates(unmountComponentFromNode,prevComponent,container,!1),!0},_mountImageIntoNode:function(markup,container,instance,shouldReuseMarkup,transaction){if(isValidContainer(container)||("production"!==process.env.NODE_ENV?invariant(!1,"mountComponentIntoNode(...): Target container is not valid."):_prodInvariant("41")),shouldReuseMarkup){var rootElement=getReactRootElementInContainer(container);if(ReactMarkupChecksum.canReuseMarkup(markup,rootElement))return void ReactDOMComponentTree.precacheNode(instance,rootElement);var checksum=rootElement.getAttribute(ReactMarkupChecksum.CHECKSUM_ATTR_NAME);rootElement.removeAttribute(ReactMarkupChecksum.CHECKSUM_ATTR_NAME);var rootMarkup=rootElement.outerHTML;rootElement.setAttribute(ReactMarkupChecksum.CHECKSUM_ATTR_NAME,checksum);var normalizedMarkup=markup;if("production"!==process.env.NODE_ENV){var normalizer;container.nodeType===ELEMENT_NODE_TYPE?(normalizer=document.createElement("div"),normalizer.innerHTML=markup,normalizedMarkup=normalizer.innerHTML):(normalizer=document.createElement("iframe"),document.body.appendChild(normalizer),normalizer.contentDocument.write(markup),normalizedMarkup=normalizer.contentDocument.documentElement.outerHTML,document.body.removeChild(normalizer))}var diffIndex=firstDifferenceIndex(normalizedMarkup,rootMarkup),difference=" (client) "+normalizedMarkup.substring(diffIndex-20,diffIndex+20)+"\n (server) "+rootMarkup.substring(diffIndex-20,diffIndex+20);container.nodeType===DOC_NODE_TYPE&&("production"!==process.env.NODE_ENV?invariant(!1,"You're trying to render a component to the document using server rendering but the checksum was invalid. This usually means you rendered a different component type or props on the client from the one on the server, or your render() methods are impure. React cannot handle this case due to cross-browser quirks by rendering at the document root. You should look for environment dependent code in your components and ensure the props are the same client and server side:\n%s",difference):_prodInvariant("42",difference)),"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(!1,"React attempted to reuse markup in a container but the checksum was invalid. This generally means that you are using server rendering and the markup generated on the server was not what the client was expecting. React injected new markup to compensate which works but you have lost many of the benefits of server rendering. Instead, figure out why the markup being generated is different on the client or server:\n%s",difference)}if(container.nodeType===DOC_NODE_TYPE&&("production"!==process.env.NODE_ENV?invariant(!1,"You're trying to render a component to the document but you didn't use server rendering. We can't do this without using server rendering due to cross-browser quirks. See ReactDOMServer.renderToString() for server rendering."):_prodInvariant("43")),transaction.useCreateElement){for(;container.lastChild;)container.removeChild(container.lastChild);DOMLazyTree.insertTreeBefore(container,markup,null)}else setInnerHTML(container,markup),ReactDOMComponentTree.precacheNode(instance,container.firstChild);if("production"!==process.env.NODE_ENV){var hostNode=ReactDOMComponentTree.getInstanceFromNode(container.firstChild);0!==hostNode._debugID&&ReactInstrumentation.debugTool.onHostOperation({instanceID:hostNode._debugID,type:"mount",payload:markup.toString()})}}};module.exports=ReactMount}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(4),React=__webpack_require__(28),invariant=__webpack_require__(1),ReactNodeTypes={HOST:0,COMPOSITE:1,EMPTY:2,getType:function(node){return null===node||!1===node?ReactNodeTypes.EMPTY:React.isValidElement(node)?"function"==typeof node.type?ReactNodeTypes.COMPOSITE:ReactNodeTypes.HOST:void("production"!==process.env.NODE_ENV?invariant(!1,"Unexpected node: %s",node):_prodInvariant("26",node))}};module.exports=ReactNodeTypes}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";module.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(module,exports,__webpack_require__){"use strict";var ViewportMetrics={currentScrollLeft:0,currentScrollTop:0,refreshScrollValues:function(scrollPosition){ViewportMetrics.currentScrollLeft=scrollPosition.x,ViewportMetrics.currentScrollTop=scrollPosition.y}};module.exports=ViewportMetrics},function(module,exports,__webpack_require__){"use strict";(function(process){function accumulateInto(current,next){return null==next&&("production"!==process.env.NODE_ENV?invariant(!1,"accumulateInto(...): Accumulated items must not be null or undefined."):_prodInvariant("30")),null==current?next:Array.isArray(current)?Array.isArray(next)?(current.push.apply(current,next),current):(current.push(next),current):Array.isArray(next)?[current].concat(next):[current,next]}var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1);module.exports=accumulateInto}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function forEachAccumulated(arr,cb,scope){Array.isArray(arr)?arr.forEach(cb,scope):arr&&cb.call(scope,arr)}module.exports=forEachAccumulated},function(module,exports,__webpack_require__){"use strict";function getHostComponentFromComposite(inst){for(var type;(type=inst._renderedNodeType)===ReactNodeTypes.COMPOSITE;)inst=inst._renderedComponent;return type===ReactNodeTypes.HOST?inst._renderedComponent:type===ReactNodeTypes.EMPTY?null:void 0}var ReactNodeTypes=__webpack_require__(112);module.exports=getHostComponentFromComposite},function(module,exports,__webpack_require__){"use strict";function getTextContentAccessor(){return!contentKey&&ExecutionEnvironment.canUseDOM&&(contentKey="textContent"in document.documentElement?"textContent":"innerText"),contentKey}var ExecutionEnvironment=__webpack_require__(9),contentKey=null;module.exports=getTextContentAccessor},function(module,exports,__webpack_require__){"use strict";function isCheckable(elem){var type=elem.type,nodeName=elem.nodeName;return nodeName&&"input"===nodeName.toLowerCase()&&("checkbox"===type||"radio"===type)}function getTracker(inst){return inst._wrapperState.valueTracker}function attachTracker(inst,tracker){inst._wrapperState.valueTracker=tracker}function detachTracker(inst){delete inst._wrapperState.valueTracker}function getValueFromNode(node){var value;return node&&(value=isCheckable(node)?""+node.checked:node.value),value}var ReactDOMComponentTree=__webpack_require__(8),inputValueTracking={_getTrackerFromNode:function(node){return getTracker(ReactDOMComponentTree.getInstanceFromNode(node))},track:function(inst){if(!getTracker(inst)){var node=ReactDOMComponentTree.getNodeFromInstance(inst),valueField=isCheckable(node)?"checked":"value",descriptor=Object.getOwnPropertyDescriptor(node.constructor.prototype,valueField),currentValue=""+node[valueField];node.hasOwnProperty(valueField)||"function"!=typeof descriptor.get||"function"!=typeof descriptor.set||(Object.defineProperty(node,valueField,{enumerable:descriptor.enumerable,configurable:!0,get:function(){return descriptor.get.call(this)},set:function(value){currentValue=""+value,descriptor.set.call(this,value)}}),attachTracker(inst,{getValue:function(){return currentValue},setValue:function(value){currentValue=""+value},stopTracking:function(){detachTracker(inst),delete node[valueField]}}))}},updateValueIfChanged:function(inst){if(!inst)return!1;var tracker=getTracker(inst);if(!tracker)return inputValueTracking.track(inst),!0;var lastValue=tracker.getValue(),nextValue=getValueFromNode(ReactDOMComponentTree.getNodeFromInstance(inst));return nextValue!==lastValue&&(tracker.setValue(nextValue),!0)},stopTracking:function(inst){var tracker=getTracker(inst);tracker&&tracker.stopTracking()}};module.exports=inputValueTracking},function(module,exports,__webpack_require__){"use strict";(function(process){function getDeclarationErrorAddendum(owner){if(owner){var name=owner.getName();if(name)return" Check the render method of `"+name+"`."}return""}function isInternalComponentType(type){return"function"==typeof type&&void 0!==type.prototype&&"function"==typeof type.prototype.mountComponent&&"function"==typeof type.prototype.receiveComponent}function instantiateReactComponent(node,shouldHaveDebugID){var instance;if(null===node||!1===node)instance=ReactEmptyComponent.create(instantiateReactComponent);else if("object"==typeof node){var element=node,type=element.type;if("function"!=typeof type&&"string"!=typeof type){var info="";"production"!==process.env.NODE_ENV&&(void 0===type||"object"==typeof type&&null!==type&&0===Object.keys(type).length)&&(info+=" You likely forgot to export your component from the file it's defined in."),info+=getDeclarationErrorAddendum(element._owner),"production"!==process.env.NODE_ENV?invariant(!1,"Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",null==type?type:typeof type,info):_prodInvariant("130",null==type?type:typeof type,info)}"string"==typeof element.type?instance=ReactHostComponent.createInternalComponent(element):isInternalComponentType(element.type)?(instance=new element.type(element),instance.getHostNode||(instance.getHostNode=instance.getNativeNode)):instance=new ReactCompositeComponentWrapper(element)}else"string"==typeof node||"number"==typeof node?instance=ReactHostComponent.createInstanceForText(node):"production"!==process.env.NODE_ENV?invariant(!1,"Encountered invalid React node of type %s",typeof node):_prodInvariant("131",typeof node);return"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning("function"==typeof instance.mountComponent&&"function"==typeof instance.receiveComponent&&"function"==typeof instance.getHostNode&&"function"==typeof instance.unmountComponent,"Only React Components can be mounted."),instance._mountIndex=0,instance._mountImage=null,"production"!==process.env.NODE_ENV&&(instance._debugID=shouldHaveDebugID?getNextDebugID():0),"production"!==process.env.NODE_ENV&&Object.preventExtensions&&Object.preventExtensions(instance),instance}var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),ReactCompositeComponent=__webpack_require__(239),ReactEmptyComponent=__webpack_require__(107),ReactHostComponent=__webpack_require__(109),getNextDebugID=__webpack_require__(308),invariant=__webpack_require__(1),warning=__webpack_require__(2),ReactCompositeComponentWrapper=function(element){this.construct(element)};_assign(ReactCompositeComponentWrapper.prototype,ReactCompositeComponent,{_instantiateReactComponent:instantiateReactComponent}),module.exports=instantiateReactComponent}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function isTextInputElement(elem){var nodeName=elem&&elem.nodeName&&elem.nodeName.toLowerCase();return"input"===nodeName?!!supportedInputTypes[elem.type]:"textarea"===nodeName}var supportedInputTypes={color:!0,date:!0,datetime:!0,"datetime-local":!0,email:!0,month:!0,number:!0,password:!0,range:!0,search:!0,tel:!0,text:!0,time:!0,url:!0,week:!0};module.exports=isTextInputElement},function(module,exports,__webpack_require__){"use strict";var ExecutionEnvironment=__webpack_require__(9),escapeTextContentForBrowser=__webpack_require__(43),setInnerHTML=__webpack_require__(44),setTextContent=function(node,text){if(text){var firstChild=node.firstChild;if(firstChild&&firstChild===node.lastChild&&3===firstChild.nodeType)return void(firstChild.nodeValue=text)}node.textContent=text};ExecutionEnvironment.canUseDOM&&("textContent"in document.documentElement||(setTextContent=function(node,text){if(3===node.nodeType)return void(node.nodeValue=text);setInnerHTML(node,escapeTextContentForBrowser(text))})),module.exports=setTextContent},function(module,exports,__webpack_require__){"use strict";(function(process){function getComponentKey(component,index){return component&&"object"==typeof component&&null!=component.key?KeyEscapeUtils.escape(component.key):index.toString(36)}function traverseAllChildrenImpl(children,nameSoFar,callback,traverseContext){var type=typeof children;if("undefined"!==type&&"boolean"!==type||(children=null),null===children||"string"===type||"number"===type||"object"===type&&children.$$typeof===REACT_ELEMENT_TYPE)return callback(traverseContext,children,""===nameSoFar?SEPARATOR+getComponentKey(children,0):nameSoFar),1;var child,nextName,subtreeCount=0,nextNamePrefix=""===nameSoFar?SEPARATOR:nameSoFar+SUBSEPARATOR;if(Array.isArray(children))for(var i=0;i<children.length;i++)child=children[i],nextName=nextNamePrefix+getComponentKey(child,i),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext);else{var iteratorFn=getIteratorFn(children);if(iteratorFn){var step,iterator=iteratorFn.call(children);if(iteratorFn!==children.entries)for(var ii=0;!(step=iterator.next()).done;)child=step.value,nextName=nextNamePrefix+getComponentKey(child,ii++),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext);else{if("production"!==process.env.NODE_ENV){var mapsAsChildrenAddendum="";if(ReactCurrentOwner.current){var mapsAsChildrenOwnerName=ReactCurrentOwner.current.getName();mapsAsChildrenOwnerName&&(mapsAsChildrenAddendum=" Check the render method of `"+mapsAsChildrenOwnerName+"`.")}"production"!==process.env.NODE_ENV&&warning(didWarnAboutMaps,"Using Maps as children is not yet fully supported. It is an experimental feature that might be removed. Convert it to a sequence / iterable of keyed ReactElements instead.%s",mapsAsChildrenAddendum),didWarnAboutMaps=!0}for(;!(step=iterator.next()).done;){var entry=step.value;entry&&(child=entry[1],nextName=nextNamePrefix+KeyEscapeUtils.escape(entry[0])+SUBSEPARATOR+getComponentKey(child,0),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext))}}}else if("object"===type){var addendum="";if("production"!==process.env.NODE_ENV&&(addendum=" If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons.",children._isReactElement&&(addendum=" It looks like you're using an element created by a different version of React. Make sure to use only one copy of React."),ReactCurrentOwner.current)){var name=ReactCurrentOwner.current.getName();name&&(addendum+=" Check the render method of `"+name+"`.")}var childrenString=String(children);"production"!==process.env.NODE_ENV?invariant(!1,"Objects are not valid as a React child (found: %s).%s","[object Object]"===childrenString?"object with keys {"+Object.keys(children).join(", ")+"}":childrenString,addendum):_prodInvariant("31","[object Object]"===childrenString?"object with keys {"+Object.keys(children).join(", ")+"}":childrenString,addendum)}}return subtreeCount}function traverseAllChildren(children,callback,traverseContext){return null==children?0:traverseAllChildrenImpl(children,"",callback,traverseContext)}var _prodInvariant=__webpack_require__(4),ReactCurrentOwner=__webpack_require__(18),REACT_ELEMENT_TYPE=__webpack_require__(258),getIteratorFn=__webpack_require__(292),invariant=__webpack_require__(1),KeyEscapeUtils=__webpack_require__(57),warning=__webpack_require__(2),SEPARATOR=".",SUBSEPARATOR=":",didWarnAboutMaps=!1;module.exports=traverseAllChildren}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function ReactComponent(props,context,updater){this.props=props,this.context=context,this.refs=emptyObject,this.updater=updater||ReactNoopUpdateQueue}function ReactPureComponent(props,context,updater){this.props=props,this.context=context,this.refs=emptyObject,this.updater=updater||ReactNoopUpdateQueue}function ComponentDummy(){}var _prodInvariant=__webpack_require__(29),_assign=__webpack_require__(7),ReactNoopUpdateQueue=__webpack_require__(127),canDefineProperty=__webpack_require__(45),emptyObject=__webpack_require__(38),invariant=__webpack_require__(1),lowPriorityWarning=__webpack_require__(69);if(ReactComponent.prototype.isReactComponent={},ReactComponent.prototype.setState=function(partialState,callback){"object"!=typeof partialState&&"function"!=typeof partialState&&null!=partialState&&("production"!==process.env.NODE_ENV?invariant(!1,"setState(...): takes an object of state variables to update or a function which returns an object of state variables."):_prodInvariant("85")),this.updater.enqueueSetState(this,partialState),callback&&this.updater.enqueueCallback(this,callback,"setState")},ReactComponent.prototype.forceUpdate=function(callback){this.updater.enqueueForceUpdate(this),callback&&this.updater.enqueueCallback(this,callback,"forceUpdate")},"production"!==process.env.NODE_ENV){var deprecatedAPIs={isMounted:["isMounted","Instead, make sure to clean up subscriptions and pending requests in componentWillUnmount to prevent memory leaks."],replaceState:["replaceState","Refactor your code to use setState instead (see https://github.com/facebook/react/issues/3236)."]};for(var fnName in deprecatedAPIs)deprecatedAPIs.hasOwnProperty(fnName)&&function(methodName,info){canDefineProperty&&Object.defineProperty(ReactComponent.prototype,methodName,{get:function(){lowPriorityWarning(!1,"%s(...) is deprecated in plain JavaScript React classes. %s",info[0],info[1])}})}(fnName,deprecatedAPIs[fnName])}ComponentDummy.prototype=ReactComponent.prototype,ReactPureComponent.prototype=new ComponentDummy,ReactPureComponent.prototype.constructor=ReactPureComponent,_assign(ReactPureComponent.prototype,ReactComponent.prototype),ReactPureComponent.prototype.isPureReactComponent=!0,module.exports={Component:ReactComponent,PureComponent:ReactPureComponent}}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var REACT_ELEMENT_TYPE="function"==typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103;module.exports=REACT_ELEMENT_TYPE},function(module,exports,__webpack_require__){"use strict";(function(process){function getDeclarationErrorAddendum(){if(ReactCurrentOwner.current){var name=ReactCurrentOwner.current.getName();if(name)return" Check the render method of `"+name+"`."}return""}function getSourceInfoErrorAddendum(elementProps){if(null!==elementProps&&void 0!==elementProps&&void 0!==elementProps.__source){var source=elementProps.__source;return" Check your code at "+source.fileName.replace(/^.*[\\\/]/,"")+":"+source.lineNumber+"."}return""}function getCurrentComponentErrorInfo(parentType){var info=getDeclarationErrorAddendum();if(!info){var parentName="string"==typeof parentType?parentType:parentType.displayName||parentType.name;parentName&&(info=" Check the top-level render call using <"+parentName+">.")}return info}function validateExplicitKey(element,parentType){if(element._store&&!element._store.validated&&null==element.key){element._store.validated=!0;var memoizer=ownerHasKeyUseWarning.uniqueKey||(ownerHasKeyUseWarning.uniqueKey={}),currentComponentErrorInfo=getCurrentComponentErrorInfo(parentType);if(!memoizer[currentComponentErrorInfo]){memoizer[currentComponentErrorInfo]=!0;var childOwner="";element&&element._owner&&element._owner!==ReactCurrentOwner.current&&(childOwner=" It was passed a child from "+element._owner.getName()+"."),"production"!==process.env.NODE_ENV&&warning(!1,'Each child in an array or iterator should have a unique "key" prop.%s%s See https://fb.me/react-warning-keys for more information.%s',currentComponentErrorInfo,childOwner,ReactComponentTreeHook.getCurrentStackAddendum(element))}}}function validateChildKeys(node,parentType){if("object"==typeof node)if(Array.isArray(node))for(var i=0;i<node.length;i++){var child=node[i];ReactElement.isValidElement(child)&&validateExplicitKey(child,parentType)}else if(ReactElement.isValidElement(node))node._store&&(node._store.validated=!0);else if(node){var iteratorFn=getIteratorFn(node);if(iteratorFn&&iteratorFn!==node.entries)for(var step,iterator=iteratorFn.call(node);!(step=iterator.next()).done;)ReactElement.isValidElement(step.value)&&validateExplicitKey(step.value,parentType)}}function validatePropTypes(element){var componentClass=element.type;if("function"==typeof componentClass){var name=componentClass.displayName||componentClass.name;componentClass.propTypes&&checkReactTypeSpec(componentClass.propTypes,element.props,"prop",name,element,null),"function"==typeof componentClass.getDefaultProps&&"production"!==process.env.NODE_ENV&&warning(componentClass.getDefaultProps.isReactClassApproved,"getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}var ReactCurrentOwner=__webpack_require__(18),ReactComponentTreeHook=__webpack_require__(11),ReactElement=__webpack_require__(24),checkReactTypeSpec=__webpack_require__(306),canDefineProperty=__webpack_require__(45),getIteratorFn=__webpack_require__(128),warning=__webpack_require__(2),lowPriorityWarning=__webpack_require__(69),ownerHasKeyUseWarning={},ReactElementValidator={createElement:function(type,props,children){var validType="string"==typeof type||"function"==typeof type;if(!validType&&"function"!=typeof type&&"string"!=typeof type){var info="";(void 0===type||"object"==typeof type&&null!==type&&0===Object.keys(type).length)&&(info+=" You likely forgot to export your component from the file it's defined in.");var sourceInfo=getSourceInfoErrorAddendum(props);info+=sourceInfo||getDeclarationErrorAddendum(),info+=ReactComponentTreeHook.getCurrentStackAddendum();var currentSource=null!==props&&void 0!==props&&void 0!==props.__source?props.__source:null;ReactComponentTreeHook.pushNonStandardWarningStack(!0,currentSource),"production"!==process.env.NODE_ENV&&warning(!1,"React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",null==type?type:typeof type,info),ReactComponentTreeHook.popNonStandardWarningStack()}var element=ReactElement.createElement.apply(this,arguments);if(null==element)return element;if(validType)for(var i=2;i<arguments.length;i++)validateChildKeys(arguments[i],type);return validatePropTypes(element),element},createFactory:function(type){var validatedFactory=ReactElementValidator.createElement.bind(null,type);return validatedFactory.type=type,"production"!==process.env.NODE_ENV&&canDefineProperty&&Object.defineProperty(validatedFactory,"type",{enumerable:!1,get:function(){return lowPriorityWarning(!1,"Factory.type is deprecated. Access the class directly before passing it to createFactory."),Object.defineProperty(this,"type",{value:type}),type}}),validatedFactory},cloneElement:function(element,props,children){for(var newElement=ReactElement.cloneElement.apply(this,arguments),i=2;i<arguments.length;i++)validateChildKeys(arguments[i],newElement.type);return validatePropTypes(newElement),newElement}};module.exports=ReactElementValidator}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function warnNoop(publicInstance,callerName){if("production"!==process.env.NODE_ENV){var constructor=publicInstance.constructor;"production"!==process.env.NODE_ENV&&warning(!1,"%s(...): Can only update a mounted or mounting component. This usually means you called %s() on an unmounted component. This is a no-op. Please check the code for the %s component.",callerName,callerName,constructor&&(constructor.displayName||constructor.name)||"ReactClass")}}var warning=__webpack_require__(2),ReactNoopUpdateQueue={isMounted:function(publicInstance){return!1},enqueueCallback:function(publicInstance,callback){},enqueueForceUpdate:function(publicInstance){warnNoop(publicInstance,"forceUpdate")},enqueueReplaceState:function(publicInstance,completeState){warnNoop(publicInstance,"replaceState")},enqueueSetState:function(publicInstance,partialState){warnNoop(publicInstance,"setState")}};module.exports=ReactNoopUpdateQueue}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function getIteratorFn(maybeIterable){var iteratorFn=maybeIterable&&(ITERATOR_SYMBOL&&maybeIterable[ITERATOR_SYMBOL]||maybeIterable[FAUX_ITERATOR_SYMBOL]);if("function"==typeof iteratorFn)return iteratorFn}var ITERATOR_SYMBOL="function"==typeof Symbol&&Symbol.iterator,FAUX_ITERATOR_SYMBOL="@@iterator";module.exports=getIteratorFn},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}var _Docs=__webpack_require__(149),_Docs2=_interopRequireDefault(_Docs),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react);_interopRequireDefault(__webpack_require__(226)).default.render(_react2.default.createElement(_Docs2.default,{page:page,routes:routes}),document.getElementById("js-root"))},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement(_Alert2.default,{heading:"A react component"},"This is an example of a React Alert component.")};var _Alert=__webpack_require__(131),_Alert2=_interopRequireDefault(_Alert),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Alert=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Alert=exports.Alert=function(_React$PureComponent){function Alert(){return _classCallCheck(this,Alert),_possibleConstructorReturn(this,(Alert.__proto__||Object.getPrototypeOf(Alert)).apply(this,arguments))}return _inherits(Alert,_React$PureComponent),_createClass(Alert,[{key:"heading",value:function(){if(this.props.heading)return _react2.default.createElement("h3",{className:"ds-c-alert__heading"},this.props.heading)}},{key:"render",value:function(){var classes=(0,_classnames2.default)("ds-c-alert",this.props.variation&&"ds-c-alert--"+this.props.variation,this.props.className);return _react2.default.createElement("div",{className:classes,role:this.props.role},_react2.default.createElement("div",{className:"ds-c-alert__body"},this.heading(),this.props.children))}}]),Alert}(_react2.default.PureComponent);Alert.propTypes={children:_propTypes2.default.node.isRequired,heading:_propTypes2.default.string,role:_propTypes2.default.oneOf(["alert","alertdialog"]),variation:_propTypes2.default.oneOf(["error","warn","success"])},exports.default=Alert},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement(_Badge2.default,null,"Today")};var _Badge=__webpack_require__(133),_Badge2=_interopRequireDefault(_Badge),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Badge=void 0;var _propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),Badge=exports.Badge=function(props){return _react2.default.createElement("span",{className:"ds-c-badge"},props.children)};Badge.propTypes={children:_propTypes2.default.oneOfType([_propTypes2.default.node,_propTypes2.default.string]).isRequired},exports.default=Badge},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement("div",null,_react2.default.createElement(_Button2.default,null,"React button"),_react2.default.createElement(_Button2.default,{className:"ds-u-margin-left--1",href:"http://example.com",target:"_blank",variation:"primary"},"React anchor button"))};var _Button=__webpack_require__(135),_Button2=_interopRequireDefault(_Button),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Button=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Button=exports.Button=function(_React$PureComponent){function Button(){return _classCallCheck(this,Button),_possibleConstructorReturn(this,(Button.__proto__||Object.getPrototypeOf(Button)).apply(this,arguments))}return _inherits(Button,_React$PureComponent),_createClass(Button,[{key:"attrs",value:function(){var _props=this.props,props=(_props.className,_props.component,_props.inverse,_props.onClick,_props.size,_props.variation,_objectWithoutProperties(_props,["className","component","inverse","onClick","size","variation"])),attrs=_extends({className:this.classNames()},props);return this.props.onClick&&(attrs.onClick=this.handleClick.bind(this)),attrs}},{key:"classNames",value:function(){var variationClass=this.props.variation&&"ds-c-button--"+this.props.variation,disabledClass=this.props.disabled&&"ds-c-button--disabled";return this.props.inverse&&(disabledClass?disabledClass+="-inverse":variationClass?variationClass+="-inverse":variationClass="ds-c-button--inverse"),(0,_classnames2.default)("ds-c-button",disabledClass,!disabledClass&&variationClass,this.props.size&&"ds-c-button--"+this.props.size,this.props.className)}},{key:"handleClick",value:function(e){this.props.disabled||this.props.onClick(e)}},{key:"render",value:function(){var attrs=this.attrs(),ComponentType="button";return this.props.component?ComponentType=this.props.component:this.props.href&&(ComponentType="a",delete attrs.disabled,delete attrs.type),_react2.default.createElement(ComponentType,attrs,this.props.children)}}]),Button}(_react2.default.PureComponent);Button.defaultProps={type:"button"},Button.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,component:_propTypes2.default.oneOfType([_propTypes2.default.element,_propTypes2.default.func]),disabled:_propTypes2.default.bool,href:_propTypes2.default.string,inverse:_propTypes2.default.bool,onClick:_propTypes2.default.func,size:_propTypes2.default.oneOf(["small","big"]),type:_propTypes2.default.oneOf(["button","submit"]),variation:_propTypes2.default.oneOf(["primary","danger","success","transparent"])},exports.default=Button},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement("div",null,_react2.default.createElement(_Choice2.default,{defaultChecked:!0,name:"checkbox_choice",value:"a"},"Checkbox A"),_react2.default.createElement(_Choice2.default,{name:"checkbox_choice",value:"b"},"Checkbox B"),_react2.default.createElement(_Choice2.default,{disabled:!0,name:"checkbox_choice",value:"c"},"Checkbox B"),_react2.default.createElement(_Choice2.default,{defaultChecked:!0,name:"radio_choice",type:"radio",value:"a"},"Radio A"),_react2.default.createElement(_Choice2.default,{name:"radio_choice",type:"radio",value:"b"},"Radio B"))};var _Choice=__webpack_require__(70),_Choice2=_interopRequireDefault(_Choice),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function generateChoices(length){for(var choices=[],i=0;i<length;i++)choices.push({label:"Choice "+(i+1),value:String(i+1)});return choices}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){var choices=generateChoices(4),options=generateChoices(8);return choices[1].defaultChecked=!0,choices[2].disabled=!0,options[1].defaultChecked=!0,_react2.default.createElement("div",null,_react2.default.createElement(_ChoiceList2.default,{choices:choices,className:"ds-u-margin-top--0",label:"Radio example",name:"choices_field"}),_react2.default.createElement(_ChoiceList2.default,{choices:choices,errorMessage:"Example error message",label:"Checkbox example",multiple:!0,name:"multiple_choices_field"}),_react2.default.createElement(_ChoiceList2.default,{choices:options,hint:"Example hint text",label:"Select example",name:"select_choices_field"}),_react2.default.createElement("div",{className:"ds-base--inverse ds-u-margin-top--4 ds-u-padding--1"},_react2.default.createElement(_ChoiceList2.default,{choices:options,hint:"Example hint text",inversed:!0,label:"Select example",labelClassName:"ds-u-margin-top--0",name:"select_choices_field_inverse"})))};var _ChoiceList=__webpack_require__(138),_ChoiceList2=_interopRequireDefault(_ChoiceList),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.ChoiceList=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_Choice=__webpack_require__(70),_Choice2=_interopRequireDefault(_Choice),_FormLabel=__webpack_require__(72),_FormLabel2=_interopRequireDefault(_FormLabel),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_Select=__webpack_require__(71),_Select2=_interopRequireDefault(_Select),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),ChoiceList=exports.ChoiceList=function(_React$PureComponent){function ChoiceList(){return _classCallCheck(this,ChoiceList),_possibleConstructorReturn(this,(ChoiceList.__proto__||Object.getPrototypeOf(ChoiceList)).apply(this,arguments))}return _inherits(ChoiceList,_React$PureComponent),_createClass(ChoiceList,[{key:"field",value:function(){var _this2=this,type=this.type(),ChoiceComponent="select"===type?"option":_Choice2.default,selectProps={},choices=this.props.choices.map(function(choice){var checked=choice.checked,defaultChecked=choice.defaultChecked,label=choice.label,props=_objectWithoutProperties(choice,["checked","defaultChecked","label"]);return"select"===type?(checked&&(selectProps.value=props.value),defaultChecked&&(selectProps.defaultValue=props.value)):(props.checked=checked,props.defaultChecked=defaultChecked,props.disabled=props.disabled||_this2.props.disabled,props.inversed=_this2.props.inversed,props.name=_this2.props.name,props.onBlur=_this2.props.onBlur,props.onChange=_this2.props.onChange,props.type=type),_react2.default.createElement(ChoiceComponent,_extends({key:choice.value},props),label)});return"select"===type?this.select(selectProps,choices):choices}},{key:"id",value:function(){if("select"===this.type())return this._id||(this._id=(0,_lodash2.default)("select_"+this.props.name+"_")),this._id}},{key:"select",value:function(selectProps,options){return _react2.default.createElement(_Select2.default,_extends({disabled:this.props.disabled,id:this.id(),inversed:this.props.inversed,name:this.props.name,onBlur:this.props.onBlur,onChange:this.props.onChange},selectProps),options)}},{key:"type",value:function(){return this.props.type?this.props.type:this.props.multiple||1===this.props.choices.length?"checkbox":this.props.choices.length>7?"select":"radio"}},{key:"render",value:function(){var type=this.type(),classes=(0,_classnames2.default)({"ds-c-fieldset":"select"!==type},this.props.className),RootComponent="select"===type?"div":"fieldset",FormLabelComponent="select"===type?"label":"legend";return _react2.default.createElement(RootComponent,{className:classes||null},_react2.default.createElement(_FormLabel2.default,{className:this.props.labelClassName,component:FormLabelComponent,errorMessage:this.props.errorMessage,fieldId:this.id(),hint:this.props.hint,inversed:this.props.inversed},this.props.label),this.field())}}]),ChoiceList}(_react2.default.PureComponent);ChoiceList.propTypes={choices:_propTypes2.default.arrayOf(_propTypes2.default.shape({checked:_Choice2.default.propTypes.checked,defaultChecked:_Choice2.default.propTypes.defaultChecked,disabled:_Choice2.default.propTypes.disabled,label:_Choice2.default.propTypes.children,value:_Choice2.default.propTypes.value})).isRequired,className:_propTypes2.default.string,disabled:_propTypes2.default.bool,errorMessage:_propTypes2.default.string,hint:_propTypes2.default.node,inversed:_propTypes2.default.bool,label:_propTypes2.default.node.isRequired,labelClassName:_propTypes2.default.string,multiple:_propTypes2.default.bool,name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,type:_propTypes2.default.oneOf(["checkbox","radio","select"])},exports.default=ChoiceList},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0});var _react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_Select=__webpack_require__(71),_Select2=_interopRequireDefault(_Select);exports.default=function(){return _react2.default.createElement(_Select2.default,{defaultValue:"2",name:"select-demo"},_react2.default.createElement("option",{value:"1"},"Option 1"),_react2.default.createElement("option",{value:"2"},"Option 2"),_react2.default.createElement("option",{value:"3"},"Option 3"))}},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement("div",{className:"ds-c-tabs",role:"tablist"},_react2.default.createElement(_Tab2.default,{id:"tab-example-1",panelId:"tab-example-panel-1",selected:!0},"Selected tab"),_react2.default.createElement(_Tab2.default,{id:"tab-example-2",panelId:"tab-example-panel-2"},"Other tab"))};var _react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_Tab=__webpack_require__(73),_Tab2=_interopRequireDefault(_Tab)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement(_Tabs2.default,null,_react2.default.createElement(_TabPanel2.default,{id:"summary",tab:"Summary"},"The Bill of Rights is the first ten amendments to the United States Constitution."),_react2.default.createElement(_TabPanel2.default,{id:"amendments",tab:"Amendments"},_react2.default.createElement("h2",{className:"ds-h4"},"Bill of Rights"),_react2.default.createElement("ol",{className:"ds-c-list"},_react2.default.createElement("li",null,"Freedoms, Petitions, Assembly"),_react2.default.createElement("li",null,"Right to bear arms"),_react2.default.createElement("li",null,"Quartering of soldiers"),_react2.default.createElement("li",null,"Search and arrest"),_react2.default.createElement("li",null,"Rights in criminal cases"),_react2.default.createElement("li",null,"Right to a fair trial"),_react2.default.createElement("li",null,"Rights in civil cases"),_react2.default.createElement("li",null,"Bail, fines, punishment"),_react2.default.createElement("li",null,"Rights retained by the People"),_react2.default.createElement("li",null,"States’ rights")),_react2.default.createElement("h2",{className:"ds-h4"},"Later Amendments"),_react2.default.createElement("ol",{className:"ds-c-list",start:"11"},_react2.default.createElement("li",null,"Lawsuits against states"),_react2.default.createElement("li",null,"Presidential elections"),_react2.default.createElement("li",null,"Abolition of slavery"),_react2.default.createElement("li",null,"Civil rights"),_react2.default.createElement("li",null,"Black suffrage"),_react2.default.createElement("li",null,"Income taxes"),_react2.default.createElement("li",null,"Senatorial elections"),_react2.default.createElement("li",null,"Prohibition of liquor"),_react2.default.createElement("li",null,"Women’s suffrage"),_react2.default.createElement("li",null,"Terms of office"),_react2.default.createElement("li",null,"Repeal of Prohibition"),_react2.default.createElement("li",null,"Term Limits for the Presidency"),_react2.default.createElement("li",null,"Washington, D.C., suffrage"),_react2.default.createElement("li",null,"Abolition of poll taxes"),_react2.default.createElement("li",null,"Presidential succession"),_react2.default.createElement("li",null,"18-year-old suffrage"),_react2.default.createElement("li",null,"Congressional pay raises"))))};var _react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_TabPanel=__webpack_require__(74),_TabPanel2=_interopRequireDefault(_TabPanel),_Tabs=__webpack_require__(142),_Tabs2=_interopRequireDefault(_Tabs)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}function getDefaultSelectedId(props){var selectedId=void 0;return _react2.default.Children.forEach(props.children,function(child){isTabPanel(child)&&!selectedId&&(selectedId=child.props.id)}),selectedId}function panelTabId(panel){return panel.props.tabId||"ds-c-tabs__item--"+panel.props.id}function isTabPanel(child){return null!=child&&child.type===_TabPanel2.default}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Tabs=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_Tab=__webpack_require__(73),_Tab2=_interopRequireDefault(_Tab),_TabPanel=__webpack_require__(74),_TabPanel2=_interopRequireDefault(_TabPanel),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Tabs=exports.Tabs=function(_React$PureComponent){function Tabs(props){_classCallCheck(this,Tabs);var _this=_possibleConstructorReturn(this,(Tabs.__proto__||Object.getPrototypeOf(Tabs)).call(this,props)),selectedId=void 0;return selectedId="defaultSelectedId"in props?props.defaultSelectedId:getDefaultSelectedId(props),_this.handleTabClick=_this.handleTabClick.bind(_this),_this.state={selectedId:selectedId},_this}return _inherits(Tabs,_React$PureComponent),_createClass(Tabs,[{key:"componentDidUpdate",value:function(_,prevState){"function"==typeof this.props.onChange&&this.state.selectedId!==prevState.selectedId&&this.props.onChange(this.state.selectedId,prevState.selectedId)}},{key:"handleTabClick",value:function(evt,panelId,tabId,href){evt.preventDefault(),this.setState({selectedId:panelId}),this.replaceState(href)}},{key:"panelChildren",value:function(){return _react2.default.Children.toArray(this.props.children).filter(isTabPanel)}},{key:"renderChildren",value:function(){var _this2=this;return _react2.default.Children.map(this.props.children,function(child){return isTabPanel(child)?_react2.default.cloneElement(child,{selected:_this2.state.selectedId===child.props.id,tab:void 0,tabHref:void 0,tabId:panelTabId(child)}):child})}},{key:"renderTabs",value:function(){var _this3=this,panels=this.panelChildren(),listClasses=(0,_classnames2.default)("ds-c-tabs",this.props.tablistClassName),tabs=panels.map(function(panel){return _react2.default.createElement(_Tab2.default,{className:panel.props.tabClassName,href:panel.props.tabHref,id:panelTabId(panel),key:panel.key,onClick:_this3.handleTabClick,panelId:panel.props.id,selected:_this3.state.selectedId===panel.props.id},panel.props.tab)});return _react2.default.createElement("div",{className:listClasses,role:"tablist"},tabs)}},{key:"replaceState",value:function(url){window.history&&window.history.replaceState({},document.title,url)}},{key:"render",value:function(){return _react2.default.createElement("div",null,this.renderTabs(),this.renderChildren())}}]),Tabs}(_react2.default.PureComponent);Tabs.propTypes={children:_propTypes2.default.node.isRequired,defaultSelectedId:_propTypes2.default.string,onChange:_propTypes2.default.func,tablistClassName:_propTypes2.default.string},exports.default=Tabs},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement("div",null,_react2.default.createElement(_TextField2.default,{defaultValue:"Example value",label:"Single line",labelClassName:"ds-u-margin-top--0",name:"single_example"}),_react2.default.createElement(_TextField2.default,{errorMessage:"Error message example",hint:"Example of a multiline field with an error",label:"Multiline",multiline:!0,name:"multiline_example"}),_react2.default.createElement(_TextField2.default,{label:"Disabled field",disabled:!0,name:"disabled_example",value:"Example value"}),_react2.default.createElement(_TextField2.default,{label:"Password field",name:"disabled_example",type:"password"}),_react2.default.createElement("div",{className:"ds-base--inverse ds-u-margin-top--3 ds-u-padding--2"},_react2.default.createElement(_TextField2.default,{inversed:!0,label:"Single line",labelClassName:"ds-u-margin-top--0",name:"inversed_single_example"}),_react2.default.createElement(_TextField2.default,{label:"Disabled field",disabled:!0,inversed:!0,name:"inversed_disabled_example"})))};var _react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_TextField=__webpack_require__(144),_TextField2=_interopRequireDefault(_TextField)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.TextField=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_FormLabel=__webpack_require__(72),_FormLabel2=_interopRequireDefault(_FormLabel),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),TextField=exports.TextField=function(_React$PureComponent){function TextField(props){_classCallCheck(this,TextField);var _this=_possibleConstructorReturn(this,(TextField.__proto__||Object.getPrototypeOf(TextField)).call(this,props));return _this.id=(0,_lodash2.default)("textfield_"),_this}return _inherits(TextField,_React$PureComponent),_createClass(TextField,[{key:"render",value:function(){var FieldComponent=this.props.multiline?"textarea":"input",rows=this.props.multiline&&this.props.rows?this.props.rows:void 0,classes=(0,_classnames2.default)("ds-u-clearfix",this.props.className),fieldClasses=(0,_classnames2.default)("ds-c-field",{"ds-c-field--error":"string"==typeof this.props.errorMessage,"ds-c-field--inverse":this.props.inversed},this.props.fieldClassName);return _react2.default.createElement("div",{className:classes},_react2.default.createElement(_FormLabel2.default,{className:this.props.labelClassName,errorMessage:this.props.errorMessage,fieldId:this.id,hint:this.props.hint,inversed:this.props.inversed},this.props.label),_react2.default.createElement(FieldComponent,{className:fieldClasses,defaultValue:this.props.defaultValue,disabled:this.props.disabled,id:this.id,name:this.props.name,onChange:this.props.onChange,onBlur:this.props.onBlur,rows:rows,type:this.props.multiline?void 0:this.props.type,value:this.props.value}))}}]),TextField}(_react2.default.PureComponent);TextField.defaultProps={type:"text"},TextField.propTypes={className:_propTypes2.default.string,defaultValue:_propTypes2.default.string,disabled:_propTypes2.default.bool,errorMessage:_propTypes2.default.string,fieldClassName:_propTypes2.default.string,hint:_propTypes2.default.node,inversed:_propTypes2.default.bool,label:_propTypes2.default.node.isRequired,labelClassName:_propTypes2.default.string,multiline:_propTypes2.default.bool,name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,rows:_propTypes2.default.oneOfType([_propTypes2.default.number,_propTypes2.default.string]),type:_propTypes2.default.string,value:_propTypes2.default.string},exports.default=TextField},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement(_VerticalNav2.default,{selectedId:"team",items:[{label:"Home",url:"http://example.com"},{label:"About",items:[{id:"team",label:"Team",url:"http://example.com#team"},{id:"company",label:"Company",url:"http://example.com#company"}]},{label:"Contact",url:"http://example.com#contact"}]})};var _react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_VerticalNav=__webpack_require__(75),_VerticalNav2=_interopRequireDefault(_VerticalNav)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.VerticalNavItem=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_VerticalNav=__webpack_require__(75),_VerticalNav2=_interopRequireDefault(_VerticalNav),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),VerticalNavItem=exports.VerticalNavItem=function(_React$PureComponent){function VerticalNavItem(props){_classCallCheck(this,VerticalNavItem);var _this=_possibleConstructorReturn(this,(VerticalNavItem.__proto__||Object.getPrototypeOf(VerticalNavItem)).call(this,props));return _this.handleLinkClick=_this.handleLinkClick.bind(_this),_this.handleToggleClick=_this.handleToggleClick.bind(_this),_this.id=_this.props.id||(0,_lodash2.default)("VerticalNavItem_"),_this.subnavId=_this.id+"__subnav",_this.state={collapsed:_this.props.defaultCollapsed},_this}return _inherits(VerticalNavItem,_React$PureComponent),_createClass(VerticalNavItem,[{key:"componentDidUpdate",value:function(prevProps,prevState){this.props.onSubnavToggle&&prevState.collapsed!==this.state.collapsed&&this.props.onSubnavToggle(this.props.id,this.state.collapsed)}},{key:"handleLinkClick",value:function(evt){this.props.onClick&&this.props.onClick(evt,this.id,this.props.url)}},{key:"handleToggleClick",value:function(){this.setState({collapsed:!this.state.collapsed})}},{key:"hasSubnav",value:function(){return this.props.items&&this.props.items.length}},{key:"isSelected",value:function(){return this.props.selected?this.props.selected:this.props._selectedId&&this.hasSubnav()?this.childIsSelected(this.props.items):void 0}},{key:"childIsSelected",value:function(children){var _this2=this;return!(!children||!children.length)&&children.some(function(child){return child.id===_this2.props._selectedId||_this2.childIsSelected(child.items)})}},{key:"renderSubnavToggle",value:function(){if(this.hasSubnav()){var label=this.state.collapsed?this.props.ariaCollapsedStateButtonLabel:this.props.ariaExpandedStateButtonLabel;return _react2.default.createElement("button",{"aria-controls":this.subnavId,"aria-expanded":!this.state.collapsed,className:"ds-c-vertical-nav__subnav-toggle",onClick:this.handleToggleClick},label)}}},{key:"renderSubnav",value:function(){if(this.hasSubnav())return _react2.default.createElement(_VerticalNav2.default,{selectedId:this.props._selectedId,collapsed:this.state.collapsed,id:this.subnavId,items:this.props.items,nested:!0})}},{key:"render",value:function(){var classes=(0,_classnames2.default)("ds-c-vertical-nav__item",this.props.className),LinkComponent=this.props.url?"a":"div",linkProps={className:(0,_classnames2.default)("ds-c-vertical-nav__link",{"ds-c-vertical-nav__link--current":this.isSelected(),"ds-c-vertical-nav__link--parent":this.hasSubnav()}),href:this.props.url?this.props.url:void 0,onClick:this.props.onClick?this.handleLinkClick:void 0};return _react2.default.createElement("li",{className:classes},_react2.default.createElement(LinkComponent,linkProps,this.props.label),this.renderSubnavToggle(),this.renderSubnav())}}]),VerticalNavItem}(_react2.default.PureComponent);VerticalNavItem.defaultProps={ariaCollapsedStateButtonLabel:"Expand sub-navigation",ariaExpandedStateButtonLabel:"Collapse sub-navigation",defaultCollapsed:!1},VerticalNavItem.propTypes={_selectedId:_propTypes2.default.string,ariaCollapsedStateButtonLabel:_propTypes2.default.string,ariaExpandedStateButtonLabel:_propTypes2.default.string,className:_propTypes2.default.string,defaultCollapsed:_propTypes2.default.bool,onClick:_propTypes2.default.func,onSubnavToggle:_propTypes2.default.func,id:_propTypes2.default.string,items:_propTypes2.default.arrayOf(_propTypes2.default.shape(VerticalNavItem.propTypes)),label:_propTypes2.default.node.isRequired,url:_propTypes2.default.string,selected:_propTypes2.default.bool},exports.default=VerticalNavItem},function(module,exports,__webpack_require__){"use strict";module.exports=function(object){return Object.getOwnPropertySymbols(object).filter(function(keySymbol){return object.propertyIsEnumerable(keySymbol)})}},function(module,exports,__webpack_require__){"use strict";var _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj},isRegexp=__webpack_require__(203),isObj=__webpack_require__(201),getOwnEnumPropSymbols=__webpack_require__(147);module.exports=function(val,opts,pad){var seen=[];return function stringify(val,opts,pad){opts=opts||{},opts.indent=opts.indent||"\t",pad=pad||"";var tokens=void 0;tokens=void 0===opts.inlineCharacterLimit?{newLine:"\n",newLineOrSpace:"\n",pad:pad,indent:pad+opts.indent}:{newLine:"@@__STRINGIFY_OBJECT_NEW_LINE__@@",newLineOrSpace:"@@__STRINGIFY_OBJECT_NEW_LINE_OR_SPACE__@@",pad:"@@__STRINGIFY_OBJECT_PAD__@@",indent:"@@__STRINGIFY_OBJECT_INDENT__@@"};var expandWhiteSpace=function(string){if(void 0===opts.inlineCharacterLimit)return string;var oneLined=string.replace(new RegExp(tokens.newLine,"g"),"").replace(new RegExp(tokens.newLineOrSpace,"g")," ").replace(new RegExp(tokens.pad+"|"+tokens.indent,"g"),"");return oneLined.length<=opts.inlineCharacterLimit?oneLined:string.replace(new RegExp(tokens.newLine+"|"+tokens.newLineOrSpace,"g"),"\n").replace(new RegExp(tokens.pad,"g"),pad).replace(new RegExp(tokens.indent,"g"),pad+opts.indent)};if(-1!==seen.indexOf(val))return'"[Circular]"';if(null===val||void 0===val||"number"==typeof val||"boolean"==typeof val||"function"==typeof val||"symbol"===(void 0===val?"undefined":_typeof(val))||isRegexp(val))return String(val);if(val instanceof Date)return"new Date('"+val.toISOString()+"')";if(Array.isArray(val)){if(0===val.length)return"[]";seen.push(val);var ret="["+tokens.newLine+val.map(function(el,i){var eol=val.length-1===i?tokens.newLine:","+tokens.newLineOrSpace,value=stringify(el,opts,pad+opts.indent);return opts.transform&&(value=opts.transform(val,i,value)),tokens.indent+value+eol}).join("")+tokens.pad+"]";return seen.pop(val),expandWhiteSpace(ret)}if(isObj(val)){var objKeys=Object.keys(val).concat(getOwnEnumPropSymbols(val));if(0===objKeys.length)return"{}";seen.push(val);var _ret="{"+tokens.newLine+objKeys.map(function(el,i){if(opts.filter&&!opts.filter(val,el))return"";var eol=objKeys.length-1===i?tokens.newLine:","+tokens.newLineOrSpace,isSymbol="symbol"===(void 0===el?"undefined":_typeof(el)),isClassic=!isSymbol&&/^[a-z$_][a-z$_0-9]*$/i.test(el),key=isSymbol||isClassic?el:stringify(el,opts),value=stringify(val[el],opts,pad+opts.indent);return opts.transform&&(value=opts.transform(val,el,value)),tokens.indent+String(key)+": "+value+eol}).join("")+tokens.pad+"}";return seen.pop(val),expandWhiteSpace(_ret)}return val=String(val).replace(/[\r\n]/g,function(x){return"\n"===x?"\\n":"\\r"}),!1===opts.singleQuotes?'"'+(val=val.replace(/"/g,'\\"'))+'"':"'"+(val=val.replace(/\\?'/g,"\\'"))+"'"}(val,opts,pad)}},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0});var _Header=__webpack_require__(151),_Header2=_interopRequireDefault(_Header),_Nav=__webpack_require__(152),_Nav2=_interopRequireDefault(_Nav),_Page=__webpack_require__(153),_Page2=_interopRequireDefault(_Page),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),Docs=function(props){return _react2.default.createElement("div",null,_react2.default.createElement(_Header2.default,null),_react2.default.createElement("div",{className:"l-grid"},_react2.default.createElement(_Nav2.default,{items:props.routes,selectedId:props.page.referenceURI}),_react2.default.createElement("main",{className:"l-col-9 l-col-grow"},_react2.default.createElement(_Page2.default,props.page))))};Docs.propTypes={page:_propTypes2.default.shape(_Page2.default.propTypes).isRequired,routes:_Nav2.default.propTypes.items},exports.default=Docs},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_CodeSnippet=__webpack_require__(76),_CodeSnippet2=_interopRequireDefault(_CodeSnippet),_prismjs=__webpack_require__(99),_prismjs2=_interopRequireDefault(_prismjs),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),HTMLExample=function(_React$PureComponent){function HTMLExample(){return _classCallCheck(this,HTMLExample),_possibleConstructorReturn(this,(HTMLExample.__proto__||Object.getPrototypeOf(HTMLExample)).apply(this,arguments))}return _inherits(HTMLExample,_React$PureComponent),_createClass(HTMLExample,[{key:"markup",value:function(){var html=this.props.markup,modifier=this.props.modifier?" "+this.props.modifier.className:"",lorem={s:"We the People of the United States",m:"We the People of the United States, in Order to form a more perfect Union",l:"We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America."};return html.replace(/\s?{{\s?modifier\s?}}/g,modifier).replace(/\s?{{\s?lorem-s\s?}}/g,lorem.s).replace(/\s?{{\s?lorem-m\s?}}/g,lorem.m).replace(/\s?{{\s?lorem-l\s?}}/g,lorem.l)}},{key:"highlightedMarkup",value:function(){return _prismjs2.default.highlight(this.markup(),_prismjs2.default.languages.markup)}},{key:"snippet",value:function(){if(!this.props.hideMarkup)return _react2.default.createElement(_CodeSnippet2.default,null,this.highlightedMarkup())}},{key:"title",value:function(){if(this.props.showTitle){var name=this.props.modifier?this.props.modifier.className:"Default",description=this.props.modifier&&this.props.modifier.description;return _react2.default.createElement("div",{className:"c-markup__header"},_react2.default.createElement("h4",{className:"ds-u-font-size--h5 ds-u-margin-bottom--0"},"Modifier: ",_react2.default.createElement("code",null,name)),_react2.default.createElement("p",{className:"ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted",dangerouslySetInnerHTML:{__html:description}}))}}},{key:"render",value:function(){var markup=this.markup();return _react2.default.createElement("div",{className:"markup markup--html"},this.title(),_react2.default.createElement("div",{className:"ds-u-border--1 ds-u-padding--1",dangerouslySetInnerHTML:{__html:markup}}),this.snippet())}}]),HTMLExample}(_react2.default.PureComponent);HTMLExample.propTypes={hideMarkup:_propTypes2.default.bool,markup:_propTypes2.default.string.isRequired,modifier:_propTypes2.default.shape({className:_propTypes2.default.string,description:_propTypes2.default.string,name:_propTypes2.default.string.isRequired}),showTitle:_propTypes2.default.bool},HTMLExample.defaultProps={showTitle:!0},exports.default=HTMLExample},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _react=__webpack_require__(10),_react2=function(obj){return obj&&obj.__esModule?obj:{default:obj}}(_react),Header=function(){return _react2.default.createElement("header",{className:"ds-base--inverse"},_react2.default.createElement("div",{className:"ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small"},_react2.default.createElement("strong",null,"Alpha status"),": The design system is under active development and working towards a 1.0 release."))};exports.default=Header},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function expandSelectedItems(items,selectedId){return items=[].concat(items),items.some(function(item){if(item.id===selectedId||isParentOfSelectedChild(item.items,selectedId))return item.defaultCollapsed=!1,!0}),items}function isParentOfSelectedChild(items,selectedId){return!(!items||!items.length)&&items.some(function(item){return item.id===selectedId})}Object.defineProperty(exports,"__esModule",{value:!0});var _propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_designSystemCore=__webpack_require__(85),Nav=function(props){return _react2.default.createElement("nav",{className:"l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2"},_react2.default.createElement(_designSystemCore.VerticalNav,{className:"c-nav__list",items:expandSelectedItems(props.items,props.selectedId),selectedId:props.selectedId}))};Nav.propTypes={items:_propTypes2.default.arrayOf(_propTypes2.default.object).isRequired,selectedId:_propTypes2.default.string.isRequired},exports.default=Nav},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}function isGuidanceSection(section){return Boolean(section.reference.match(/\.guidance([a-z-_]+)?$/i))}Object.defineProperty(exports,"__esModule",{value:!0});var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_PageBlock=__webpack_require__(154),_PageBlock2=_interopRequireDefault(_PageBlock),_PageHeader=__webpack_require__(155),_PageHeader2=_interopRequireDefault(_PageHeader),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_designSystemCore=__webpack_require__(85),Page=function(_React$PureComponent){function Page(props){_classCallCheck(this,Page);var _this=_possibleConstructorReturn(this,(Page.__proto__||Object.getPrototypeOf(Page)).call(this,props));return _this.hasTabs=_this.props.sections.length&&_this.props.depth>=2,_this}return _inherits(Page,_React$PureComponent),_createClass(Page,[{key:"usageSections",value:function(){return this.props.sections.filter(function(s){return!isGuidanceSection(s)})}},{key:"guidanceSections",value:function(){return this.props.sections.filter(isGuidanceSection)}},{key:"renderChildPageBlocks",value:function(sections){if(sections.length)return sections.map(function(section){return _react2.default.createElement(_PageBlock2.default,_extends({key:section.referenceURI},section))})}},{key:"renderBody",value:function(){return _react2.default.createElement(_PageBlock2.default,_extends({},this.props,{hideHeader:!0}))}},{key:"renderContent",value:function(){return this.hasTabs?_react2.default.createElement(_designSystemCore.Tabs,{tablistClassName:"ds-u-padding-left--6 ds-u-fill--gray-lightest"},_react2.default.createElement(_designSystemCore.TabPanel,{className:"ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0",id:"usage",tab:"Usage"},this.renderBody(),this.renderChildPageBlocks(this.usageSections())),this.renderGuidanceTabPanel()):_react2.default.createElement("div",{className:"ds-u-border-top--1 ds-u-padding-x--6"},this.renderBody())}},{key:"renderGuidanceTabPanel",value:function(){var sections=this.guidanceSections();if(sections.length)return _react2.default.createElement(_designSystemCore.TabPanel,{className:"ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0",id:"guidance",tab:"Guidance"},this.renderChildPageBlocks(sections))}},{key:"render",value:function(){return _react2.default.createElement("div",null,_react2.default.createElement(_PageHeader2.default,this.props),this.renderContent())}}]),Page}(_react2.default.PureComponent);Page.defaultProps={depth:0,sections:[]},Page.propTypes={depth:_propTypes2.default.number,sections:_propTypes2.default.arrayOf(_propTypes2.default.shape(_PageBlock2.default.propTypes))},exports.default=Page},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_HTMLExample=__webpack_require__(150),_HTMLExample2=_interopRequireDefault(_HTMLExample),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_ReactComponentDoc=__webpack_require__(156),_ReactComponentDoc2=_interopRequireDefault(_ReactComponentDoc),_Source=__webpack_require__(77),_Source2=_interopRequireDefault(_Source),_reactComponentPath=__webpack_require__(78),_reactComponentPath2=_interopRequireDefault(_reactComponentPath),_reactDoc=__webpack_require__(313),PageBlock=function(_React$PureComponent){function PageBlock(){return _classCallCheck(this,PageBlock),_possibleConstructorReturn(this,(PageBlock.__proto__||Object.getPrototypeOf(PageBlock)).apply(this,arguments))}return _inherits(PageBlock,_React$PureComponent),_createClass(PageBlock,[{key:"markupExamples",value:function(){var _this2=this;if(this.props.markup){var modifierMarkup=void 0;return this.props.modifiers.length&&(modifierMarkup=this.props.modifiers.map(function(modifier){return _react2.default.createElement(_HTMLExample2.default,{key:modifier.name,hideMarkup:_this2.props.hideMarkup,markup:_this2.props.markup,modifier:modifier})})),_react2.default.createElement("section",{className:"ds-u-margin-top--3"},_react2.default.createElement(_HTMLExample2.default,{hideMarkup:this.props.hideMarkup,markup:this.props.markup,showTitle:!1}),modifierMarkup)}}},{key:"description",value:function(){if(this.props.description)return _react2.default.createElement("div",{className:"c-details ds-u-margin-top--2 ds-u-measure--wide",dangerouslySetInnerHTML:{__html:this.props.description}})}},{key:"header",value:function(){if(!this.props.hideHeader&&!this.props.header.match(/---/))return _react2.default.createElement("div",null,_react2.default.createElement("h1",{className:"ds-h1",dangerouslySetInnerHTML:{__html:this.props.header},id:this.props.reference}),_react2.default.createElement(_Source2.default,{reactComponent:this.props.reactComponent,source:this.props.source}))}},{key:"packagePath",value:function(path){return"@cmsgov/design-system-"+path}},{key:"reactDoc",value:function(){if(this.props.reactComponent){var path=(0,_reactComponentPath2.default)(this.props.source.path,this.props.reactComponent),docs=_reactDoc[path+".jsx"];if(docs&&docs.length){var doc=docs[0];return _react2.default.createElement(_ReactComponentDoc2.default,{description:doc.description,displayName:doc.displayName,hideExample:this.props.hideExample,packagePath:this.packagePath(path),propDocs:doc.props})}}}},{key:"render",value:function(){return _react2.default.createElement("article",{className:"ds-u-margin-y--6 l-content"},this.header(),this.description(),this.markupExamples(),this.reactDoc())}}]),PageBlock}(_react2.default.PureComponent);PageBlock.propTypes={description:_propTypes2.default.string,header:_propTypes2.default.string.isRequired,hideExample:_propTypes2.default.bool,hideHeader:_propTypes2.default.bool,hideMarkup:_propTypes2.default.bool,markup:_propTypes2.default.string,modifiers:_propTypes2.default.arrayOf(_HTMLExample2.default.propTypes.modifier),reactComponent:_propTypes2.default.string,reference:_propTypes2.default.string,source:_Source2.default.propTypes.source},exports.default=PageBlock},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_Source=__webpack_require__(77),_Source2=_interopRequireDefault(_Source),PageHeader=function(_React$PureComponent){function PageHeader(){return _classCallCheck(this,PageHeader),_possibleConstructorReturn(this,(PageHeader.__proto__||Object.getPrototypeOf(PageHeader)).apply(this,arguments))}return _inherits(PageHeader,_React$PureComponent),_createClass(PageHeader,[{key:"uswdsLink",value:function(){if(this.props.uswdsUrl)return _react2.default.createElement("p",null,_react2.default.createElement("a",{href:this.props.uswdsUrl},"US Web Design Standard"))}},{key:"statusPill",value:function(){if(this.props.status)return _react2.default.createElement("span",{className:"ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize ds-u-fill--warn ds-u-color--base"},this.props.status)}},{key:"render",value:function(){return _react2.default.createElement("heading",{className:"ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest"},this.statusPill(),_react2.default.createElement("h1",{className:"ds-display",dangerouslySetInnerHTML:{__html:this.props.header},id:this.props.reference}),_react2.default.createElement("div",{className:"ds-u-clearfix"}),_react2.default.createElement(_Source2.default,{reactComponent:this.props.reactComponent,source:this.props.source}),this.uswdsLink())}}]),PageHeader}(_react2.default.PureComponent);PageHeader.propTypes={header:_propTypes2.default.string.isRequired,reactComponent:_Source2.default.propTypes.reactComponent,reference:_propTypes2.default.string,source:_Source2.default.propTypes.source,status:_propTypes2.default.string,uswdsUrl:_propTypes2.default.string},exports.default=PageHeader},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_ReactComponentExample=__webpack_require__(157),_ReactComponentExample2=_interopRequireDefault(_ReactComponentExample),_ReactPropDocs=__webpack_require__(159),_ReactPropDocs2=_interopRequireDefault(_ReactPropDocs),ReactComponentDoc=function(_React$PureComponent){function ReactComponentDoc(){return _classCallCheck(this,ReactComponentDoc),_possibleConstructorReturn(this,(ReactComponentDoc.__proto__||Object.getPrototypeOf(ReactComponentDoc)).apply(this,arguments))}return _inherits(ReactComponentDoc,_React$PureComponent),_createClass(ReactComponentDoc,[{key:"renderExample",value:function(){if(!this.props.hideExample){var renderComponent=__webpack_require__(184)("./"+this.props.packagePath+".example.jsx").default;return _react2.default.createElement(_ReactComponentExample2.default,{renderComponent:renderComponent})}}},{key:"render",value:function(){return _react2.default.createElement("section",null,_react2.default.createElement("div",{className:"c-details ds-u-margin-y--2 ds-u-measure--wide",dangerouslySetInnerHTML:{__html:this.props.description}}),this.renderExample(),_react2.default.createElement("h3",null,"Props"),_react2.default.createElement(_ReactPropDocs2.default,{propDocs:this.props.propDocs}))}}]),ReactComponentDoc}(_react2.default.PureComponent);ReactComponentDoc.propTypes={description:_propTypes2.default.string,hideExample:_propTypes2.default.bool,packagePath:_propTypes2.default.string.isRequired,propDocs:_propTypes2.default.object},exports.default=ReactComponentDoc},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_CodeSnippet=__webpack_require__(76),_CodeSnippet2=_interopRequireDefault(_CodeSnippet),_prismjs=__webpack_require__(99),_prismjs2=_interopRequireDefault(_prismjs),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_reactElementToJsxString=__webpack_require__(297),_reactElementToJsxString2=_interopRequireDefault(_reactElementToJsxString);__webpack_require__(223);var ReactComponentExample=function(_React$PureComponent){function ReactComponentExample(){return _classCallCheck(this,ReactComponentExample),_possibleConstructorReturn(this,(ReactComponentExample.__proto__||Object.getPrototypeOf(ReactComponentExample)).apply(this,arguments))}return _inherits(ReactComponentExample,_React$PureComponent),_createClass(ReactComponentExample,[{key:"highlightedMarkup",value:function(){var markup=(0,_reactElementToJsxString2.default)(this.props.renderComponent(),{showDefaultProps:!1,showFunctions:!0});return _prismjs2.default.highlight(markup,_prismjs2.default.languages.jsx)}},{key:"render",value:function(){return _react2.default.createElement("div",{className:"markup markup--react"},_react2.default.createElement("div",{className:"ds-u-border--1 ds-u-padding--1"},this.props.renderComponent()),_react2.default.createElement(_CodeSnippet2.default,{language:"jsx"},this.highlightedMarkup()))}}]),ReactComponentExample}(_react2.default.PureComponent);ReactComponentExample.propTypes={renderComponent:_propTypes2.default.func.isRequired},exports.default=ReactComponentExample},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),ReactPropDoc=function(_React$PureComponent){function ReactPropDoc(){return _classCallCheck(this,ReactPropDoc),_possibleConstructorReturn(this,(ReactPropDoc.__proto__||Object.getPrototypeOf(ReactPropDoc)).apply(this,arguments))}return _inherits(ReactPropDoc,_React$PureComponent),_createClass(ReactPropDoc,[{key:"defaultValue",value:function(){if(this.props.defaultValue)return _react2.default.createElement("code",null,this.props.defaultValue.value)}},{key:"description",value:function(){if(this.props.description)return _react2.default.createElement("div",{dangerouslySetInnerHTML:{__html:this.props.description}})}},{key:"isRequired",value:function(){if(this.props.required)return _react2.default.createElement("p",null,_react2.default.createElement("span",{className:"ds-c-badge ds-u-bg-gray-dark"},"Required"))}},{key:"shape",value:function(){var values=this.props.type.value;if(values&&void 0===values.length)return Object.getOwnPropertyNames(values.value).join(", ")}},{key:"type",value:function(){var propType=this.props.type.name,validValues=this.validValues();if("arrayOf"===propType){var valueType=this.props.type.value.name;return"shape"===valueType&&(valueType=this.props.type.value.computed?this.props.type.value.value:"{"+this.shape()+"}"),propType+"["+valueType+"]"}return validValues||propType}},{key:"validValues",value:function(){var _this2=this,values=this.props.type.value;if(values&&void 0!==values.length)return values.map(function(v){return"enum"===_this2.props.type.name?v.value:v.name}).join(", ")}},{key:"render",value:function(){return _react2.default.createElement("tr",null,_react2.default.createElement("td",null,_react2.default.createElement("code",{className:"ds-u-font-weight--bold"},this.props.name),this.isRequired()),_react2.default.createElement("td",null,_react2.default.createElement("code",null,this.type())),_react2.default.createElement("td",null,this.defaultValue()),_react2.default.createElement("td",null,this.description()))}}]),ReactPropDoc}(_react2.default.PureComponent);ReactPropDoc.propTypes={defaultValue:_propTypes2.default.shape({value:_propTypes2.default.string}),description:_propTypes2.default.string,name:_propTypes2.default.string,required:_propTypes2.default.bool.isRequired,type:_propTypes2.default.shape({name:_propTypes2.default.string.isRequired,value:_propTypes2.default.oneOfType([_propTypes2.default.arrayOf(_propTypes2.default.shape({computed:_propTypes2.default.bool,name:_propTypes2.default.string,value:_propTypes2.default.string})),_propTypes2.default.object])})},exports.default=ReactPropDoc},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_ReactPropDoc=__webpack_require__(158),_ReactPropDoc2=_interopRequireDefault(_ReactPropDoc),ReactPropDocs=function(_React$PureComponent){function ReactPropDocs(){return _classCallCheck(this,ReactPropDocs),_possibleConstructorReturn(this,(ReactPropDocs.__proto__||Object.getPrototypeOf(ReactPropDocs)).apply(this,arguments))}return _inherits(ReactPropDocs,_React$PureComponent),_createClass(ReactPropDocs,[{key:"rows",value:function(){var _this2=this;return Object.getOwnPropertyNames(this.props.propDocs).map(function(prop){return"children"===prop||prop.match(/^_/)?null:_react2.default.createElement(_ReactPropDoc2.default,_extends({key:prop,name:prop},_this2.props.propDocs[prop]))})}},{key:"render",value:function(){return _react2.default.createElement("table",{className:"ds-c-table"},_react2.default.createElement("thead",null,_react2.default.createElement("tr",null,_react2.default.createElement("td",null,"Name"),_react2.default.createElement("td",null,"Type"),_react2.default.createElement("td",null,"Default"),_react2.default.createElement("td",null,"Description"))),_react2.default.createElement("tbody",null,this.rows()))}}]),ReactPropDocs}(_react2.default.PureComponent);ReactPropDocs.propTypes={propDocs:_propTypes2.default.object},exports.default=ReactPropDocs},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Alert=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Alert=exports.Alert=function(_React$PureComponent){function Alert(){return _classCallCheck(this,Alert),_possibleConstructorReturn(this,(Alert.__proto__||Object.getPrototypeOf(Alert)).apply(this,arguments))}return _inherits(Alert,_React$PureComponent),_createClass(Alert,[{key:"heading",value:function(){if(this.props.heading)return _react2.default.createElement("h3",{className:"ds-c-alert__heading"},this.props.heading)}},{key:"render",value:function(){var classes=(0,_classnames2.default)("ds-c-alert",this.props.variation&&"ds-c-alert--"+this.props.variation,this.props.className);return _react2.default.createElement("div",{className:classes,role:this.props.role},_react2.default.createElement("div",{className:"ds-c-alert__body"},this.heading(),this.props.children))}}]),Alert}(_react2.default.PureComponent);Alert.propTypes={children:_propTypes2.default.node.isRequired,heading:_propTypes2.default.string,role:_propTypes2.default.oneOf(["alert","alertdialog"]),variation:_propTypes2.default.oneOf(["error","warn","success"])},exports.default=Alert},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Badge=void 0;var _propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),Badge=exports.Badge=function(props){return _react2.default.createElement("span",{className:"ds-c-badge"},props.children)};Badge.propTypes={children:_propTypes2.default.oneOfType([_propTypes2.default.node,_propTypes2.default.string]).isRequired},exports.default=Badge},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Button=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Button=exports.Button=function(_React$PureComponent){function Button(){return _classCallCheck(this,Button),_possibleConstructorReturn(this,(Button.__proto__||Object.getPrototypeOf(Button)).apply(this,arguments))}return _inherits(Button,_React$PureComponent),_createClass(Button,[{key:"attrs",value:function(){var _props=this.props,props=(_props.className,_props.component,_props.inverse,_props.onClick,_props.size,_props.variation,_objectWithoutProperties(_props,["className","component","inverse","onClick","size","variation"])),attrs=_extends({className:this.classNames()},props);return this.props.onClick&&(attrs.onClick=this.handleClick.bind(this)),attrs}},{key:"classNames",value:function(){var variationClass=this.props.variation&&"ds-c-button--"+this.props.variation,disabledClass=this.props.disabled&&"ds-c-button--disabled";return this.props.inverse&&(disabledClass?disabledClass+="-inverse":variationClass?variationClass+="-inverse":variationClass="ds-c-button--inverse"),(0,_classnames2.default)("ds-c-button",disabledClass,!disabledClass&&variationClass,this.props.size&&"ds-c-button--"+this.props.size,this.props.className)}},{key:"handleClick",value:function(e){this.props.disabled||this.props.onClick(e)}},{key:"render",value:function(){var attrs=this.attrs(),ComponentType="button";return this.props.component?ComponentType=this.props.component:this.props.href&&(ComponentType="a",delete attrs.disabled,delete attrs.type),_react2.default.createElement(ComponentType,attrs,this.props.children)}}]),Button}(_react2.default.PureComponent);Button.defaultProps={type:"button"},Button.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,component:_propTypes2.default.oneOfType([_propTypes2.default.element,_propTypes2.default.func]),disabled:_propTypes2.default.bool,href:_propTypes2.default.string,inverse:_propTypes2.default.bool,onClick:_propTypes2.default.func,size:_propTypes2.default.oneOf(["small","big"]),type:_propTypes2.default.oneOf(["button","submit"]),variation:_propTypes2.default.oneOf(["primary","danger","success","transparent"])},exports.default=Button},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.ChoiceList=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_Choice=__webpack_require__(79),_Choice2=_interopRequireDefault(_Choice),_FormLabel=__webpack_require__(47),_FormLabel2=_interopRequireDefault(_FormLabel),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_Select=__webpack_require__(80),_Select2=_interopRequireDefault(_Select),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),ChoiceList=exports.ChoiceList=function(_React$PureComponent){function ChoiceList(){return _classCallCheck(this,ChoiceList),_possibleConstructorReturn(this,(ChoiceList.__proto__||Object.getPrototypeOf(ChoiceList)).apply(this,arguments))}return _inherits(ChoiceList,_React$PureComponent),_createClass(ChoiceList,[{key:"field",value:function(){var _this2=this,type=this.type(),ChoiceComponent="select"===type?"option":_Choice2.default,selectProps={},choices=this.props.choices.map(function(choice){var checked=choice.checked,defaultChecked=choice.defaultChecked,label=choice.label,props=_objectWithoutProperties(choice,["checked","defaultChecked","label"]);return"select"===type?(checked&&(selectProps.value=props.value),defaultChecked&&(selectProps.defaultValue=props.value)):(props.checked=checked,props.defaultChecked=defaultChecked,props.disabled=props.disabled||_this2.props.disabled,props.inversed=_this2.props.inversed,props.name=_this2.props.name,props.onBlur=_this2.props.onBlur,props.onChange=_this2.props.onChange,props.type=type),_react2.default.createElement(ChoiceComponent,_extends({key:choice.value},props),label)});return"select"===type?this.select(selectProps,choices):choices}},{key:"id",value:function(){if("select"===this.type())return this._id||(this._id=(0,_lodash2.default)("select_"+this.props.name+"_")),this._id}},{key:"select",value:function(selectProps,options){return _react2.default.createElement(_Select2.default,_extends({disabled:this.props.disabled,id:this.id(),inversed:this.props.inversed,name:this.props.name,onBlur:this.props.onBlur,onChange:this.props.onChange},selectProps),options)}},{key:"type",value:function(){return this.props.type?this.props.type:this.props.multiple||1===this.props.choices.length?"checkbox":this.props.choices.length>7?"select":"radio"}},{key:"render",value:function(){var type=this.type(),classes=(0,_classnames2.default)({"ds-c-fieldset":"select"!==type},this.props.className),RootComponent="select"===type?"div":"fieldset",FormLabelComponent="select"===type?"label":"legend";return _react2.default.createElement(RootComponent,{className:classes||null},_react2.default.createElement(_FormLabel2.default,{className:this.props.labelClassName,component:FormLabelComponent,errorMessage:this.props.errorMessage,fieldId:this.id(),hint:this.props.hint,inversed:this.props.inversed},this.props.label),this.field())}}]),ChoiceList}(_react2.default.PureComponent);ChoiceList.propTypes={choices:_propTypes2.default.arrayOf(_propTypes2.default.shape({checked:_Choice2.default.propTypes.checked,defaultChecked:_Choice2.default.propTypes.defaultChecked,disabled:_Choice2.default.propTypes.disabled,label:_Choice2.default.propTypes.children,value:_Choice2.default.propTypes.value})).isRequired,className:_propTypes2.default.string,disabled:_propTypes2.default.bool,errorMessage:_propTypes2.default.string,hint:_propTypes2.default.node,inversed:_propTypes2.default.bool,label:_propTypes2.default.node.isRequired,labelClassName:_propTypes2.default.string,multiple:_propTypes2.default.bool,name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,type:_propTypes2.default.oneOf(["checkbox","radio","select"])},exports.default=ChoiceList},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}function getDefaultSelectedId(props){var selectedId=void 0;return _react2.default.Children.forEach(props.children,function(child){isTabPanel(child)&&!selectedId&&(selectedId=child.props.id)}),selectedId}function panelTabId(panel){return panel.props.tabId||"ds-c-tabs__item--"+panel.props.id}function isTabPanel(child){return null!=child&&child.type===_TabPanel2.default}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Tabs=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_Tab=__webpack_require__(81),_Tab2=_interopRequireDefault(_Tab),_TabPanel=__webpack_require__(82),_TabPanel2=_interopRequireDefault(_TabPanel),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Tabs=exports.Tabs=function(_React$PureComponent){function Tabs(props){_classCallCheck(this,Tabs);var _this=_possibleConstructorReturn(this,(Tabs.__proto__||Object.getPrototypeOf(Tabs)).call(this,props)),selectedId=void 0;return selectedId="defaultSelectedId"in props?props.defaultSelectedId:getDefaultSelectedId(props),_this.handleTabClick=_this.handleTabClick.bind(_this),_this.state={selectedId:selectedId},_this}return _inherits(Tabs,_React$PureComponent),_createClass(Tabs,[{key:"componentDidUpdate",value:function(_,prevState){"function"==typeof this.props.onChange&&this.state.selectedId!==prevState.selectedId&&this.props.onChange(this.state.selectedId,prevState.selectedId)}},{key:"handleTabClick",value:function(evt,panelId,tabId,href){evt.preventDefault(),this.setState({selectedId:panelId}),this.replaceState(href)}},{key:"panelChildren",value:function(){return _react2.default.Children.toArray(this.props.children).filter(isTabPanel)}},{key:"renderChildren",value:function(){var _this2=this;return _react2.default.Children.map(this.props.children,function(child){return isTabPanel(child)?_react2.default.cloneElement(child,{selected:_this2.state.selectedId===child.props.id,tab:void 0,tabHref:void 0,tabId:panelTabId(child)}):child})}},{key:"renderTabs",value:function(){var _this3=this,panels=this.panelChildren(),listClasses=(0,_classnames2.default)("ds-c-tabs",this.props.tablistClassName),tabs=panels.map(function(panel){return _react2.default.createElement(_Tab2.default,{className:panel.props.tabClassName,href:panel.props.tabHref,id:panelTabId(panel),key:panel.key,onClick:_this3.handleTabClick,panelId:panel.props.id,selected:_this3.state.selectedId===panel.props.id},panel.props.tab)});return _react2.default.createElement("div",{className:listClasses,role:"tablist"},tabs)}},{key:"replaceState",value:function(url){window.history&&window.history.replaceState({},document.title,url)}},{key:"render",value:function(){return _react2.default.createElement("div",null,this.renderTabs(),this.renderChildren())}}]),Tabs}(_react2.default.PureComponent);Tabs.propTypes={children:_propTypes2.default.node.isRequired,defaultSelectedId:_propTypes2.default.string,onChange:_propTypes2.default.func,tablistClassName:_propTypes2.default.string},exports.default=Tabs},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.TextField=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_FormLabel=__webpack_require__(47),_FormLabel2=_interopRequireDefault(_FormLabel),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),TextField=exports.TextField=function(_React$PureComponent){function TextField(props){_classCallCheck(this,TextField);var _this=_possibleConstructorReturn(this,(TextField.__proto__||Object.getPrototypeOf(TextField)).call(this,props));return _this.id=(0,_lodash2.default)("textfield_"),_this}return _inherits(TextField,_React$PureComponent),_createClass(TextField,[{key:"render",value:function(){var FieldComponent=this.props.multiline?"textarea":"input",rows=this.props.multiline&&this.props.rows?this.props.rows:void 0,classes=(0,_classnames2.default)("ds-u-clearfix",this.props.className),fieldClasses=(0,_classnames2.default)("ds-c-field",{"ds-c-field--error":"string"==typeof this.props.errorMessage,"ds-c-field--inverse":this.props.inversed},this.props.fieldClassName);return _react2.default.createElement("div",{className:classes},_react2.default.createElement(_FormLabel2.default,{className:this.props.labelClassName,errorMessage:this.props.errorMessage,fieldId:this.id,hint:this.props.hint,inversed:this.props.inversed},this.props.label),_react2.default.createElement(FieldComponent,{className:fieldClasses,defaultValue:this.props.defaultValue,disabled:this.props.disabled,id:this.id,name:this.props.name,onChange:this.props.onChange,onBlur:this.props.onBlur,rows:rows,type:this.props.multiline?void 0:this.props.type,value:this.props.value}))}}]),TextField}(_react2.default.PureComponent);TextField.defaultProps={type:"text"},TextField.propTypes={className:_propTypes2.default.string,defaultValue:_propTypes2.default.string,disabled:_propTypes2.default.bool,errorMessage:_propTypes2.default.string,fieldClassName:_propTypes2.default.string,hint:_propTypes2.default.node,inversed:_propTypes2.default.bool,label:_propTypes2.default.node.isRequired,labelClassName:_propTypes2.default.string,multiline:_propTypes2.default.bool,name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,rows:_propTypes2.default.oneOfType([_propTypes2.default.number,_propTypes2.default.string]),type:_propTypes2.default.string,value:_propTypes2.default.string},exports.default=TextField},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _Alert=__webpack_require__(160);Object.keys(_Alert).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Alert[key]}})});var _Badge=__webpack_require__(161);Object.keys(_Badge).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Badge[key]}})});var _Button=__webpack_require__(162);Object.keys(_Button).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Button[key]}})});var _Choice=__webpack_require__(79);Object.keys(_Choice).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Choice[key]}})});var _ChoiceList=__webpack_require__(163);Object.keys(_ChoiceList).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _ChoiceList[key]}})});var _Select=__webpack_require__(80);Object.keys(_Select).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Select[key]}})});var _FormLabel=__webpack_require__(47);Object.keys(_FormLabel).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _FormLabel[key]}})});var _Tab=__webpack_require__(81);Object.keys(_Tab).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Tab[key]}})});var _Tabs=__webpack_require__(164);Object.keys(_Tabs).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Tabs[key]}})});var _TabPanel=__webpack_require__(82);Object.keys(_TabPanel).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _TabPanel[key]}})});var _TextField=__webpack_require__(165);Object.keys(_TextField).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _TextField[key]}})});var _VerticalNav=__webpack_require__(83);Object.keys(_VerticalNav).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _VerticalNav[key]}})});var _VerticalNavItem=__webpack_require__(84);Object.keys(_VerticalNavItem).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _VerticalNavItem[key]}})})},function(module,exports,__webpack_require__){"use strict";(function(process){function identity(fn){return fn}function factory(ReactComponent,isValidElement,ReactNoopUpdateQueue){function validateTypeDef(Constructor,typeDef,location){for(var propName in typeDef)typeDef.hasOwnProperty(propName)&&"production"!==process.env.NODE_ENV&&warning("function"==typeof typeDef[propName],"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",Constructor.displayName||"ReactClass",ReactPropTypeLocationNames[location],propName)}function validateMethodOverride(isAlreadyDefined,name){var specPolicy=ReactClassInterface.hasOwnProperty(name)?ReactClassInterface[name]:null;ReactClassMixin.hasOwnProperty(name)&&_invariant("OVERRIDE_BASE"===specPolicy,"ReactClassInterface: You are attempting to override `%s` from your class specification. Ensure that your method names do not overlap with React methods.",name),isAlreadyDefined&&_invariant("DEFINE_MANY"===specPolicy||"DEFINE_MANY_MERGED"===specPolicy,"ReactClassInterface: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",name)}function mixSpecIntoComponent(Constructor,spec){if(spec){_invariant("function"!=typeof spec,"ReactClass: You're attempting to use a component class or function as a mixin. Instead, just use a regular object."),_invariant(!isValidElement(spec),"ReactClass: You're attempting to use a component as a mixin. Instead, just use a regular object.");var proto=Constructor.prototype,autoBindPairs=proto.__reactAutoBindPairs;spec.hasOwnProperty(MIXINS_KEY)&&RESERVED_SPEC_KEYS.mixins(Constructor,spec.mixins);for(var name in spec)if(spec.hasOwnProperty(name)&&name!==MIXINS_KEY){var property=spec[name],isAlreadyDefined=proto.hasOwnProperty(name);if(validateMethodOverride(isAlreadyDefined,name),RESERVED_SPEC_KEYS.hasOwnProperty(name))RESERVED_SPEC_KEYS[name](Constructor,property);else{var isReactClassMethod=ReactClassInterface.hasOwnProperty(name),isFunction="function"==typeof property,shouldAutoBind=isFunction&&!isReactClassMethod&&!isAlreadyDefined&&!1!==spec.autobind;if(shouldAutoBind)autoBindPairs.push(name,property),proto[name]=property;else if(isAlreadyDefined){var specPolicy=ReactClassInterface[name];_invariant(isReactClassMethod&&("DEFINE_MANY_MERGED"===specPolicy||"DEFINE_MANY"===specPolicy),"ReactClass: Unexpected spec policy %s for key %s when mixing in component specs.",specPolicy,name),"DEFINE_MANY_MERGED"===specPolicy?proto[name]=createMergedResultFunction(proto[name],property):"DEFINE_MANY"===specPolicy&&(proto[name]=createChainedFunction(proto[name],property))}else proto[name]=property,"production"!==process.env.NODE_ENV&&"function"==typeof property&&spec.displayName&&(proto[name].displayName=spec.displayName+"_"+name)}}}else if("production"!==process.env.NODE_ENV){var typeofSpec=typeof spec,isMixinValid="object"===typeofSpec&&null!==spec;"production"!==process.env.NODE_ENV&&warning(isMixinValid,"%s: You're attempting to include a mixin that is either null or not an object. Check the mixins included by the component, as well as any mixins they include themselves. Expected object but got %s.",Constructor.displayName||"ReactClass",null===spec?null:typeofSpec)}}function mixStaticSpecIntoComponent(Constructor,statics){if(statics)for(var name in statics){var property=statics[name];if(statics.hasOwnProperty(name)){var isReserved=name in RESERVED_SPEC_KEYS;_invariant(!isReserved,'ReactClass: You are attempting to define a reserved property, `%s`, that shouldn\'t be on the "statics" key. Define it as an instance property instead; it will still be accessible on the constructor.',name);var isInherited=name in Constructor;_invariant(!isInherited,"ReactClass: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",name),Constructor[name]=property}}}function mergeIntoWithNoDuplicateKeys(one,two){_invariant(one&&two&&"object"==typeof one&&"object"==typeof two,"mergeIntoWithNoDuplicateKeys(): Cannot merge non-objects.");for(var key in two)two.hasOwnProperty(key)&&(_invariant(void 0===one[key],"mergeIntoWithNoDuplicateKeys(): Tried to merge two objects with the same key: `%s`. This conflict may be due to a mixin; in particular, this may be caused by two getInitialState() or getDefaultProps() methods returning objects with clashing keys.",key),one[key]=two[key]);return one}function createMergedResultFunction(one,two){return function(){var a=one.apply(this,arguments),b=two.apply(this,arguments);if(null==a)return b;if(null==b)return a;var c={};return mergeIntoWithNoDuplicateKeys(c,a),mergeIntoWithNoDuplicateKeys(c,b),c}}function createChainedFunction(one,two){return function(){one.apply(this,arguments),two.apply(this,arguments)}}function bindAutoBindMethod(component,method){var boundMethod=method.bind(component);if("production"!==process.env.NODE_ENV){boundMethod.__reactBoundContext=component,boundMethod.__reactBoundMethod=method,boundMethod.__reactBoundArguments=null;var componentName=component.constructor.displayName,_bind=boundMethod.bind;boundMethod.bind=function(newThis){for(var _len=arguments.length,args=Array(_len>1?_len-1:0),_key=1;_key<_len;_key++)args[_key-1]=arguments[_key];if(newThis!==component&&null!==newThis)"production"!==process.env.NODE_ENV&&warning(!1,"bind(): React component methods may only be bound to the component instance. See %s",componentName);else if(!args.length)return"production"!==process.env.NODE_ENV&&warning(!1,"bind(): You are binding a component method to the component. React does this for you automatically in a high-performance way, so you can safely remove this call. See %s",componentName),boundMethod;var reboundMethod=_bind.apply(boundMethod,arguments);return reboundMethod.__reactBoundContext=component,reboundMethod.__reactBoundMethod=method,reboundMethod.__reactBoundArguments=args,reboundMethod}}return boundMethod}function bindAutoBindMethods(component){for(var pairs=component.__reactAutoBindPairs,i=0;i<pairs.length;i+=2){var autoBindKey=pairs[i],method=pairs[i+1];component[autoBindKey]=bindAutoBindMethod(component,method)}}function createClass(spec){var Constructor=identity(function(props,context,updater){"production"!==process.env.NODE_ENV&&warning(this instanceof Constructor,"Something is calling a React component directly. Use a factory or JSX instead. See: https://fb.me/react-legacyfactory"),this.__reactAutoBindPairs.length&&bindAutoBindMethods(this),this.props=props,this.context=context,this.refs=emptyObject,this.updater=updater||ReactNoopUpdateQueue,this.state=null;var initialState=this.getInitialState?this.getInitialState():null;"production"!==process.env.NODE_ENV&&void 0===initialState&&this.getInitialState._isMockFunction&&(initialState=null),_invariant("object"==typeof initialState&&!Array.isArray(initialState),"%s.getInitialState(): must return an object or null",Constructor.displayName||"ReactCompositeComponent"),this.state=initialState});Constructor.prototype=new ReactClassComponent,Constructor.prototype.constructor=Constructor,Constructor.prototype.__reactAutoBindPairs=[],injectedMixins.forEach(mixSpecIntoComponent.bind(null,Constructor)),mixSpecIntoComponent(Constructor,IsMountedPreMixin),mixSpecIntoComponent(Constructor,spec),mixSpecIntoComponent(Constructor,IsMountedPostMixin),Constructor.getDefaultProps&&(Constructor.defaultProps=Constructor.getDefaultProps()),"production"!==process.env.NODE_ENV&&(Constructor.getDefaultProps&&(Constructor.getDefaultProps.isReactClassApproved={}),Constructor.prototype.getInitialState&&(Constructor.prototype.getInitialState.isReactClassApproved={})),_invariant(Constructor.prototype.render,"createClass(...): Class specification must implement a `render` method."),"production"!==process.env.NODE_ENV&&(warning(!Constructor.prototype.componentShouldUpdate,"%s has a method called componentShouldUpdate(). Did you mean shouldComponentUpdate()? The name is phrased as a question because the function is expected to return a value.",spec.displayName||"A component"),warning(!Constructor.prototype.componentWillRecieveProps,"%s has a method called componentWillRecieveProps(). Did you mean componentWillReceiveProps()?",spec.displayName||"A component"));for(var methodName in ReactClassInterface)Constructor.prototype[methodName]||(Constructor.prototype[methodName]=null);return Constructor}var injectedMixins=[],ReactClassInterface={mixins:"DEFINE_MANY",statics:"DEFINE_MANY",propTypes:"DEFINE_MANY",contextTypes:"DEFINE_MANY",childContextTypes:"DEFINE_MANY",getDefaultProps:"DEFINE_MANY_MERGED",getInitialState:"DEFINE_MANY_MERGED",getChildContext:"DEFINE_MANY_MERGED",render:"DEFINE_ONCE",componentWillMount:"DEFINE_MANY",componentDidMount:"DEFINE_MANY",componentWillReceiveProps:"DEFINE_MANY",shouldComponentUpdate:"DEFINE_ONCE",componentWillUpdate:"DEFINE_MANY",componentDidUpdate:"DEFINE_MANY",componentWillUnmount:"DEFINE_MANY",updateComponent:"OVERRIDE_BASE"},RESERVED_SPEC_KEYS={displayName:function(Constructor,displayName){Constructor.displayName=displayName},mixins:function(Constructor,mixins){if(mixins)for(var i=0;i<mixins.length;i++)mixSpecIntoComponent(Constructor,mixins[i])},childContextTypes:function(Constructor,childContextTypes){"production"!==process.env.NODE_ENV&&validateTypeDef(Constructor,childContextTypes,"childContext"),Constructor.childContextTypes=_assign({},Constructor.childContextTypes,childContextTypes)},contextTypes:function(Constructor,contextTypes){"production"!==process.env.NODE_ENV&&validateTypeDef(Constructor,contextTypes,"context"),Constructor.contextTypes=_assign({},Constructor.contextTypes,contextTypes)},getDefaultProps:function(Constructor,getDefaultProps){Constructor.getDefaultProps?Constructor.getDefaultProps=createMergedResultFunction(Constructor.getDefaultProps,getDefaultProps):Constructor.getDefaultProps=getDefaultProps},propTypes:function(Constructor,propTypes){"production"!==process.env.NODE_ENV&&validateTypeDef(Constructor,propTypes,"prop"),Constructor.propTypes=_assign({},Constructor.propTypes,propTypes)},statics:function(Constructor,statics){mixStaticSpecIntoComponent(Constructor,statics)},autobind:function(){}},IsMountedPreMixin={componentDidMount:function(){this.__isMounted=!0}},IsMountedPostMixin={componentWillUnmount:function(){this.__isMounted=!1}},ReactClassMixin={replaceState:function(newState,callback){this.updater.enqueueReplaceState(this,newState,callback)},isMounted:function(){return"production"!==process.env.NODE_ENV&&(warning(this.__didWarnIsMounted,"%s: isMounted is deprecated. Instead, make sure to clean up subscriptions and pending requests in componentWillUnmount to prevent memory leaks.",this.constructor&&this.constructor.displayName||this.name||"Component"),this.__didWarnIsMounted=!0),!!this.__isMounted}},ReactClassComponent=function(){};return _assign(ReactClassComponent.prototype,ReactComponent.prototype,ReactClassMixin),createClass}var _assign=__webpack_require__(35),emptyObject=__webpack_require__(86),_invariant=__webpack_require__(15);if("production"!==process.env.NODE_ENV)var warning=__webpack_require__(19);var ReactPropTypeLocationNames,MIXINS_KEY="mixins";ReactPropTypeLocationNames="production"!==process.env.NODE_ENV?{prop:"prop",context:"context",childContext:"child context"}:{},module.exports=factory}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function checkPropTypes(typeSpecs,values,location,componentName,getStack){if("production"!==process.env.NODE_ENV)for(var typeSpecName in typeSpecs)if(typeSpecs.hasOwnProperty(typeSpecName)){var error;try{invariant("function"==typeof typeSpecs[typeSpecName],"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",componentName||"React class",location,typeSpecName),error=typeSpecs[typeSpecName](values,typeSpecName,componentName,location,null,ReactPropTypesSecret)}catch(ex){error=ex}if(warning(!error||error instanceof Error,"%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",componentName||"React class",location,typeSpecName,typeof error),error instanceof Error&&!(error.message in loggedTypeFailures)){loggedTypeFailures[error.message]=!0;var stack=getStack?getStack():"";warning(!1,"Failed %s type: %s%s",location,error.message,null!=stack?stack:"")}}}if("production"!==process.env.NODE_ENV)var invariant=__webpack_require__(15),warning=__webpack_require__(19),ReactPropTypesSecret=__webpack_require__(48),loggedTypeFailures={};module.exports=checkPropTypes}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var factory=__webpack_require__(87);module.exports=function(isValidElement){return factory(isValidElement,!1)}},function(module,exports,__webpack_require__){"use strict";var emptyFunction=__webpack_require__(34),invariant=__webpack_require__(15),ReactPropTypesSecret=__webpack_require__(48);module.exports=function(){function shim(props,propName,componentName,location,propFullName,secret){secret!==ReactPropTypesSecret&&invariant(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function getShim(){return shim}shim.isRequired=shim;var ReactPropTypes={array:shim,bool:shim,func:shim,number:shim,object:shim,string:shim,symbol:shim,any:shim,arrayOf:getShim,element:shim,instanceOf:getShim,node:shim,objectOf:getShim,oneOf:getShim,oneOfType:getShim,shape:getShim};return ReactPropTypes.checkPropTypes=emptyFunction,ReactPropTypes.PropTypes=ReactPropTypes,ReactPropTypes}},function(module,exports,__webpack_require__){"use strict";function escape(key){var escaperLookup={"=":"=0",":":"=2"};return"$"+(""+key).replace(/[=:]/g,function(match){return escaperLookup[match]})}function unescape(key){var unescapeRegex=/(=0|=2)/g,unescaperLookup={"=0":"=","=2":":"};return(""+("."===key[0]&&"$"===key[1]?key.substring(2):key.substring(1))).replace(unescapeRegex,function(match){return unescaperLookup[match]})}var KeyEscapeUtils={escape:escape,unescape:unescape};module.exports=KeyEscapeUtils},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(25),invariant=__webpack_require__(15),oneArgumentPooler=function(copyFieldsFrom){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,copyFieldsFrom),instance}return new Klass(copyFieldsFrom)},twoArgumentPooler=function(a1,a2){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2),instance}return new Klass(a1,a2)},threeArgumentPooler=function(a1,a2,a3){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2,a3),instance}return new Klass(a1,a2,a3)},fourArgumentPooler=function(a1,a2,a3,a4){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2,a3,a4),instance}return new Klass(a1,a2,a3,a4)},standardReleaser=function(instance){var Klass=this;instance instanceof Klass||("production"!==process.env.NODE_ENV?invariant(!1,"Trying to release an instance into a pool of a different type."):_prodInvariant("25")),instance.destructor(),Klass.instancePool.length<Klass.poolSize&&Klass.instancePool.push(instance)},DEFAULT_POOLER=oneArgumentPooler,addPoolingTo=function(CopyConstructor,pooler){var NewKlass=CopyConstructor;return NewKlass.instancePool=[],NewKlass.getPooled=pooler||DEFAULT_POOLER,NewKlass.poolSize||(NewKlass.poolSize=10),NewKlass.release=standardReleaser,NewKlass},PooledClass={addPoolingTo:addPoolingTo,oneArgumentPooler:oneArgumentPooler,twoArgumentPooler:twoArgumentPooler,threeArgumentPooler:threeArgumentPooler,fourArgumentPooler:fourArgumentPooler};module.exports=PooledClass}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var _assign=__webpack_require__(35),ReactBaseClasses=__webpack_require__(88),ReactChildren=__webpack_require__(174),ReactDOMFactories=__webpack_require__(175),ReactElement=__webpack_require__(22),ReactPropTypes=__webpack_require__(177),ReactVersion=__webpack_require__(179),createReactClass=__webpack_require__(181),onlyChild=__webpack_require__(182),createElement=ReactElement.createElement,createFactory=ReactElement.createFactory,cloneElement=ReactElement.cloneElement;if("production"!==process.env.NODE_ENV){var lowPriorityWarning=__webpack_require__(50),canDefineProperty=__webpack_require__(37),ReactElementValidator=__webpack_require__(90),didWarnPropTypesDeprecated=!1;createElement=ReactElementValidator.createElement,createFactory=ReactElementValidator.createFactory,cloneElement=ReactElementValidator.cloneElement}var __spread=_assign,createMixin=function(mixin){return mixin};if("production"!==process.env.NODE_ENV){var warnedForSpread=!1,warnedForCreateMixin=!1;__spread=function(){return lowPriorityWarning(warnedForSpread,"React.__spread is deprecated and should not be used. Use Object.assign directly or another helper function with similar semantics. You may be seeing this warning due to your compiler. See https://fb.me/react-spread-deprecation for more details."),warnedForSpread=!0,_assign.apply(null,arguments)},createMixin=function(mixin){return lowPriorityWarning(warnedForCreateMixin,"React.createMixin is deprecated and should not be used. In React v16.0, it will be removed. You can use this mixin directly instead. See https://fb.me/createmixin-was-never-implemented for more info."),warnedForCreateMixin=!0,mixin}}var React={Children:{map:ReactChildren.map,forEach:ReactChildren.forEach,count:ReactChildren.count,toArray:ReactChildren.toArray,only:onlyChild},Component:ReactBaseClasses.Component,PureComponent:ReactBaseClasses.PureComponent,createElement:createElement,cloneElement:cloneElement,isValidElement:ReactElement.isValidElement,PropTypes:ReactPropTypes,createClass:createReactClass,createFactory:createFactory,createMixin:createMixin,DOM:ReactDOMFactories,version:ReactVersion,__spread:__spread};if("production"!==process.env.NODE_ENV){var warnedForCreateClass=!1;canDefineProperty&&(Object.defineProperty(React,"PropTypes",{get:function(){return lowPriorityWarning(didWarnPropTypesDeprecated,"Accessing PropTypes via the main React package is deprecated, and will be removed in  React v16.0. Use the latest available v15.* prop-types package from npm instead. For info on usage, compatibility, migration and more, see https://fb.me/prop-types-docs"),didWarnPropTypesDeprecated=!0,ReactPropTypes}}),Object.defineProperty(React,"createClass",{get:function(){return lowPriorityWarning(warnedForCreateClass,"Accessing createClass via the main React package is deprecated, and will be removed in React v16.0. Use a plain JavaScript class instead. If you're not yet ready to migrate, create-react-class v15.* is available on npm as a temporary, drop-in replacement. For more info see https://fb.me/react-create-class"),warnedForCreateClass=!0,createReactClass}})),React.DOM={};var warnedForFactories=!1;Object.keys(ReactDOMFactories).forEach(function(factory){React.DOM[factory]=function(){return warnedForFactories||(lowPriorityWarning(!1,"Accessing factories like React.DOM.%s has been deprecated and will be removed in v16.0+. Use the react-dom-factories package instead.  Version 1.0 provides a drop-in replacement. For more info, see https://fb.me/react-dom-factories",factory),warnedForFactories=!0),ReactDOMFactories[factory].apply(ReactDOMFactories,arguments)}})}module.exports=React}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function escapeUserProvidedKey(text){return(""+text).replace(userProvidedKeyEscapeRegex,"$&/")}function ForEachBookKeeping(forEachFunction,forEachContext){this.func=forEachFunction,this.context=forEachContext,this.count=0}function forEachSingleChild(bookKeeping,child,name){var func=bookKeeping.func,context=bookKeeping.context;func.call(context,child,bookKeeping.count++)}function forEachChildren(children,forEachFunc,forEachContext){if(null==children)return children;var traverseContext=ForEachBookKeeping.getPooled(forEachFunc,forEachContext);traverseAllChildren(children,forEachSingleChild,traverseContext),ForEachBookKeeping.release(traverseContext)}function MapBookKeeping(mapResult,keyPrefix,mapFunction,mapContext){this.result=mapResult,this.keyPrefix=keyPrefix,this.func=mapFunction,this.context=mapContext,this.count=0}function mapSingleChildIntoContext(bookKeeping,child,childKey){var result=bookKeeping.result,keyPrefix=bookKeeping.keyPrefix,func=bookKeeping.func,context=bookKeeping.context,mappedChild=func.call(context,child,bookKeeping.count++);Array.isArray(mappedChild)?mapIntoWithKeyPrefixInternal(mappedChild,result,childKey,emptyFunction.thatReturnsArgument):null!=mappedChild&&(ReactElement.isValidElement(mappedChild)&&(mappedChild=ReactElement.cloneAndReplaceKey(mappedChild,keyPrefix+(!mappedChild.key||child&&child.key===mappedChild.key?"":escapeUserProvidedKey(mappedChild.key)+"/")+childKey)),result.push(mappedChild))}function mapIntoWithKeyPrefixInternal(children,array,prefix,func,context){var escapedPrefix="";null!=prefix&&(escapedPrefix=escapeUserProvidedKey(prefix)+"/");var traverseContext=MapBookKeeping.getPooled(array,escapedPrefix,func,context);traverseAllChildren(children,mapSingleChildIntoContext,traverseContext),MapBookKeeping.release(traverseContext)}function mapChildren(children,func,context){if(null==children)return children;var result=[];return mapIntoWithKeyPrefixInternal(children,result,null,func,context),result}function forEachSingleChildDummy(traverseContext,child,name){return null}function countChildren(children,context){return traverseAllChildren(children,forEachSingleChildDummy,null)}function toArray(children){var result=[];return mapIntoWithKeyPrefixInternal(children,result,null,emptyFunction.thatReturnsArgument),result}var PooledClass=__webpack_require__(172),ReactElement=__webpack_require__(22),emptyFunction=__webpack_require__(34),traverseAllChildren=__webpack_require__(183),twoArgumentPooler=PooledClass.twoArgumentPooler,fourArgumentPooler=PooledClass.fourArgumentPooler,userProvidedKeyEscapeRegex=/\/+/g;ForEachBookKeeping.prototype.destructor=function(){this.func=null,this.context=null,this.count=0},PooledClass.addPoolingTo(ForEachBookKeeping,twoArgumentPooler),MapBookKeeping.prototype.destructor=function(){this.result=null,this.keyPrefix=null,this.func=null,this.context=null,this.count=0},PooledClass.addPoolingTo(MapBookKeeping,fourArgumentPooler);var ReactChildren={forEach:forEachChildren,map:mapChildren,mapIntoWithKeyPrefixInternal:mapIntoWithKeyPrefixInternal,count:countChildren,toArray:toArray};module.exports=ReactChildren},function(module,exports,__webpack_require__){"use strict";(function(process){var ReactElement=__webpack_require__(22),createDOMFactory=ReactElement.createFactory;if("production"!==process.env.NODE_ENV){createDOMFactory=__webpack_require__(90).createFactory}var ReactDOMFactories={a:createDOMFactory("a"),abbr:createDOMFactory("abbr"),address:createDOMFactory("address"),area:createDOMFactory("area"),article:createDOMFactory("article"),aside:createDOMFactory("aside"),audio:createDOMFactory("audio"),b:createDOMFactory("b"),base:createDOMFactory("base"),bdi:createDOMFactory("bdi"),bdo:createDOMFactory("bdo"),big:createDOMFactory("big"),blockquote:createDOMFactory("blockquote"),body:createDOMFactory("body"),br:createDOMFactory("br"),button:createDOMFactory("button"),canvas:createDOMFactory("canvas"),caption:createDOMFactory("caption"),cite:createDOMFactory("cite"),code:createDOMFactory("code"),col:createDOMFactory("col"),colgroup:createDOMFactory("colgroup"),data:createDOMFactory("data"),datalist:createDOMFactory("datalist"),dd:createDOMFactory("dd"),del:createDOMFactory("del"),details:createDOMFactory("details"),dfn:createDOMFactory("dfn"),dialog:createDOMFactory("dialog"),div:createDOMFactory("div"),dl:createDOMFactory("dl"),dt:createDOMFactory("dt"),em:createDOMFactory("em"),embed:createDOMFactory("embed"),fieldset:createDOMFactory("fieldset"),figcaption:createDOMFactory("figcaption"),figure:createDOMFactory("figure"),footer:createDOMFactory("footer"),form:createDOMFactory("form"),h1:createDOMFactory("h1"),h2:createDOMFactory("h2"),h3:createDOMFactory("h3"),h4:createDOMFactory("h4"),h5:createDOMFactory("h5"),h6:createDOMFactory("h6"),head:createDOMFactory("head"),header:createDOMFactory("header"),hgroup:createDOMFactory("hgroup"),hr:createDOMFactory("hr"),html:createDOMFactory("html"),i:createDOMFactory("i"),iframe:createDOMFactory("iframe"),img:createDOMFactory("img"),input:createDOMFactory("input"),ins:createDOMFactory("ins"),kbd:createDOMFactory("kbd"),keygen:createDOMFactory("keygen"),label:createDOMFactory("label"),legend:createDOMFactory("legend"),li:createDOMFactory("li"),link:createDOMFactory("link"),main:createDOMFactory("main"),map:createDOMFactory("map"),mark:createDOMFactory("mark"),menu:createDOMFactory("menu"),menuitem:createDOMFactory("menuitem"),meta:createDOMFactory("meta"),meter:createDOMFactory("meter"),nav:createDOMFactory("nav"),noscript:createDOMFactory("noscript"),object:createDOMFactory("object"),ol:createDOMFactory("ol"),optgroup:createDOMFactory("optgroup"),option:createDOMFactory("option"),output:createDOMFactory("output"),p:createDOMFactory("p"),param:createDOMFactory("param"),picture:createDOMFactory("picture"),pre:createDOMFactory("pre"),progress:createDOMFactory("progress"),q:createDOMFactory("q"),rp:createDOMFactory("rp"),rt:createDOMFactory("rt"),ruby:createDOMFactory("ruby"),s:createDOMFactory("s"),samp:createDOMFactory("samp"),script:createDOMFactory("script"),section:createDOMFactory("section"),select:createDOMFactory("select"),small:createDOMFactory("small"),source:createDOMFactory("source"),span:createDOMFactory("span"),strong:createDOMFactory("strong"),style:createDOMFactory("style"),sub:createDOMFactory("sub"),summary:createDOMFactory("summary"),sup:createDOMFactory("sup"),table:createDOMFactory("table"),tbody:createDOMFactory("tbody"),td:createDOMFactory("td"),textarea:createDOMFactory("textarea"),tfoot:createDOMFactory("tfoot"),th:createDOMFactory("th"),thead:createDOMFactory("thead"),time:createDOMFactory("time"),title:createDOMFactory("title"),tr:createDOMFactory("tr"),track:createDOMFactory("track"),u:createDOMFactory("u"),ul:createDOMFactory("ul"),var:createDOMFactory("var"),video:createDOMFactory("video"),wbr:createDOMFactory("wbr"),circle:createDOMFactory("circle"),clipPath:createDOMFactory("clipPath"),defs:createDOMFactory("defs"),ellipse:createDOMFactory("ellipse"),g:createDOMFactory("g"),image:createDOMFactory("image"),line:createDOMFactory("line"),linearGradient:createDOMFactory("linearGradient"),mask:createDOMFactory("mask"),path:createDOMFactory("path"),pattern:createDOMFactory("pattern"),polygon:createDOMFactory("polygon"),polyline:createDOMFactory("polyline"),radialGradient:createDOMFactory("radialGradient"),rect:createDOMFactory("rect"),stop:createDOMFactory("stop"),svg:createDOMFactory("svg"),text:createDOMFactory("text"),tspan:createDOMFactory("tspan")};module.exports=ReactDOMFactories}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var ReactPropTypeLocationNames={};"production"!==process.env.NODE_ENV&&(ReactPropTypeLocationNames={prop:"prop",context:"context",childContext:"child context"}),module.exports=ReactPropTypeLocationNames}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var _require=__webpack_require__(22),isValidElement=_require.isValidElement,factory=__webpack_require__(169);module.exports=factory(isValidElement)},function(module,exports,__webpack_require__){"use strict";module.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(module,exports,__webpack_require__){"use strict";module.exports="15.6.1"},function(module,exports,__webpack_require__){"use strict";(function(process){function checkReactTypeSpec(typeSpecs,values,location,componentName,element,debugID){for(var typeSpecName in typeSpecs)if(typeSpecs.hasOwnProperty(typeSpecName)){var error;try{"function"!=typeof typeSpecs[typeSpecName]&&("production"!==process.env.NODE_ENV?invariant(!1,"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName):_prodInvariant("84",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName)),error=typeSpecs[typeSpecName](values,typeSpecName,componentName,location,null,ReactPropTypesSecret)}catch(ex){error=ex}if("production"!==process.env.NODE_ENV&&warning(!error||error instanceof Error,"%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName,typeof error),error instanceof Error&&!(error.message in loggedTypeFailures)){loggedTypeFailures[error.message]=!0;var componentStackInfo="";"production"!==process.env.NODE_ENV&&(ReactComponentTreeHook||(ReactComponentTreeHook=__webpack_require__(49)),null!==debugID?componentStackInfo=ReactComponentTreeHook.getStackAddendumByID(debugID):null!==element&&(componentStackInfo=ReactComponentTreeHook.getCurrentStackAddendum(element))),"production"!==process.env.NODE_ENV&&warning(!1,"Failed %s type: %s%s",location,error.message,componentStackInfo)}}}var ReactComponentTreeHook,_prodInvariant=__webpack_require__(25),ReactPropTypeLocationNames=__webpack_require__(176),ReactPropTypesSecret=__webpack_require__(178),invariant=__webpack_require__(15),warning=__webpack_require__(19);void 0!==process&&process.env&&"test"===process.env.NODE_ENV&&(ReactComponentTreeHook=__webpack_require__(49));var loggedTypeFailures={};module.exports=checkReactTypeSpec}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var _require=__webpack_require__(88),Component=_require.Component,_require2=__webpack_require__(22),isValidElement=_require2.isValidElement,ReactNoopUpdateQueue=__webpack_require__(91),factory=__webpack_require__(167);module.exports=factory(Component,isValidElement,ReactNoopUpdateQueue)},function(module,exports,__webpack_require__){"use strict";(function(process){function onlyChild(children){return ReactElement.isValidElement(children)||("production"!==process.env.NODE_ENV?invariant(!1,"React.Children.only expected to receive a single React element child."):_prodInvariant("143")),children}var _prodInvariant=__webpack_require__(25),ReactElement=__webpack_require__(22),invariant=__webpack_require__(15);module.exports=onlyChild}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function getComponentKey(component,index){return component&&"object"==typeof component&&null!=component.key?KeyEscapeUtils.escape(component.key):index.toString(36)}function traverseAllChildrenImpl(children,nameSoFar,callback,traverseContext){var type=typeof children;if("undefined"!==type&&"boolean"!==type||(children=null),null===children||"string"===type||"number"===type||"object"===type&&children.$$typeof===REACT_ELEMENT_TYPE)return callback(traverseContext,children,""===nameSoFar?SEPARATOR+getComponentKey(children,0):nameSoFar),1;var child,nextName,subtreeCount=0,nextNamePrefix=""===nameSoFar?SEPARATOR:nameSoFar+SUBSEPARATOR;if(Array.isArray(children))for(var i=0;i<children.length;i++)child=children[i],nextName=nextNamePrefix+getComponentKey(child,i),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext);else{var iteratorFn=getIteratorFn(children);if(iteratorFn){var step,iterator=iteratorFn.call(children);if(iteratorFn!==children.entries)for(var ii=0;!(step=iterator.next()).done;)child=step.value,nextName=nextNamePrefix+getComponentKey(child,ii++),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext);else{if("production"!==process.env.NODE_ENV){var mapsAsChildrenAddendum="";if(ReactCurrentOwner.current){var mapsAsChildrenOwnerName=ReactCurrentOwner.current.getName();mapsAsChildrenOwnerName&&(mapsAsChildrenAddendum=" Check the render method of `"+mapsAsChildrenOwnerName+"`.")}"production"!==process.env.NODE_ENV&&warning(didWarnAboutMaps,"Using Maps as children is not yet fully supported. It is an experimental feature that might be removed. Convert it to a sequence / iterable of keyed ReactElements instead.%s",mapsAsChildrenAddendum),didWarnAboutMaps=!0}for(;!(step=iterator.next()).done;){var entry=step.value;entry&&(child=entry[1],nextName=nextNamePrefix+KeyEscapeUtils.escape(entry[0])+SUBSEPARATOR+getComponentKey(child,0),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext))}}}else if("object"===type){var addendum="";if("production"!==process.env.NODE_ENV&&(addendum=" If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons.",children._isReactElement&&(addendum=" It looks like you're using an element created by a different version of React. Make sure to use only one copy of React."),ReactCurrentOwner.current)){var name=ReactCurrentOwner.current.getName();name&&(addendum+=" Check the render method of `"+name+"`.")}var childrenString=String(children);"production"!==process.env.NODE_ENV?invariant(!1,"Objects are not valid as a React child (found: %s).%s","[object Object]"===childrenString?"object with keys {"+Object.keys(children).join(", ")+"}":childrenString,addendum):_prodInvariant("31","[object Object]"===childrenString?"object with keys {"+Object.keys(children).join(", ")+"}":childrenString,addendum)}}return subtreeCount}function traverseAllChildren(children,callback,traverseContext){return null==children?0:traverseAllChildrenImpl(children,"",callback,traverseContext)}var _prodInvariant=__webpack_require__(25),ReactCurrentOwner=__webpack_require__(36),REACT_ELEMENT_TYPE=__webpack_require__(89),getIteratorFn=__webpack_require__(92),invariant=__webpack_require__(15),KeyEscapeUtils=__webpack_require__(171),warning=__webpack_require__(19),SEPARATOR=".",SUBSEPARATOR=":",didWarnAboutMaps=!1;module.exports=traverseAllChildren}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){function webpackContext(req){return __webpack_require__(webpackContextResolve(req))}function webpackContextResolve(req){var id=map[req];if(!(id+1))throw new Error("Cannot find module '"+req+"'.");return id}var map={"./@cmsgov/design-system-core/src/components/Alert/Alert.example.jsx":130,"./@cmsgov/design-system-core/src/components/Badge/Badge.example.jsx":132,"./@cmsgov/design-system-core/src/components/Button/Button.example.jsx":134,"./@cmsgov/design-system-core/src/components/ChoiceList/Choice.example.jsx":136,"./@cmsgov/design-system-core/src/components/ChoiceList/ChoiceList.example.jsx":137,"./@cmsgov/design-system-core/src/components/ChoiceList/Select.example.jsx":139,"./@cmsgov/design-system-core/src/components/Tabs/Tab.example.jsx":140,"./@cmsgov/design-system-core/src/components/Tabs/Tabs.example.jsx":141,"./@cmsgov/design-system-core/src/components/TextField/TextField.example.jsx":143,"./@cmsgov/design-system-core/src/components/VerticalNav/VerticalNav.example.jsx":145};webpackContext.keys=function(){return Object.keys(map)},webpackContext.resolve=webpackContextResolve,module.exports=webpackContext,webpackContext.id=184},function(module,exports,__webpack_require__){"use strict";function collapse(value){return String(value).replace(/\s+/g," ")}/**
+function isEventSupported(eventNameSuffix,capture){if(!ExecutionEnvironment.canUseDOM||capture&&!("addEventListener"in document))return!1;var eventName="on"+eventNameSuffix,isSupported=eventName in document;if(!isSupported){var element=document.createElement("div");element.setAttribute(eventName,"return;"),isSupported="function"==typeof element[eventName]}return!isSupported&&useHasFeature&&"wheel"===eventNameSuffix&&(isSupported=document.implementation.hasFeature("Events.wheel","3.0")),isSupported}var useHasFeature,ExecutionEnvironment=__webpack_require__(9);ExecutionEnvironment.canUseDOM&&(useHasFeature=document.implementation&&document.implementation.hasFeature&&!0!==document.implementation.hasFeature("","")),module.exports=isEventSupported},function(module,exports,__webpack_require__){"use strict";function shouldUpdateReactComponent(prevElement,nextElement){var prevEmpty=null===prevElement||!1===prevElement,nextEmpty=null===nextElement||!1===nextElement;if(prevEmpty||nextEmpty)return prevEmpty===nextEmpty;var prevType=typeof prevElement,nextType=typeof nextElement;return"string"===prevType||"number"===prevType?"string"===nextType||"number"===nextType:"object"===nextType&&prevElement.type===nextElement.type&&prevElement.key===nextElement.key}module.exports=shouldUpdateReactComponent},function(module,exports,__webpack_require__){"use strict";(function(process){var _assign=__webpack_require__(7),emptyFunction=__webpack_require__(12),warning=__webpack_require__(2),validateDOMNesting=emptyFunction;if("production"!==process.env.NODE_ENV){var specialTags=["address","applet","area","article","aside","base","basefont","bgsound","blockquote","body","br","button","caption","center","col","colgroup","dd","details","dir","div","dl","dt","embed","fieldset","figcaption","figure","footer","form","frame","frameset","h1","h2","h3","h4","h5","h6","head","header","hgroup","hr","html","iframe","img","input","isindex","li","link","listing","main","marquee","menu","menuitem","meta","nav","noembed","noframes","noscript","object","ol","p","param","plaintext","pre","script","section","select","source","style","summary","table","tbody","td","template","textarea","tfoot","th","thead","title","tr","track","ul","wbr","xmp"],inScopeTags=["applet","caption","html","table","td","th","marquee","object","template","foreignObject","desc","title"],buttonScopeTags=inScopeTags.concat(["button"]),impliedEndTags=["dd","dt","li","option","optgroup","p","rp","rt"],emptyAncestorInfo={current:null,formTag:null,aTagInScope:null,buttonTagInScope:null,nobrTagInScope:null,pTagInButtonScope:null,listItemTagAutoclosing:null,dlItemTagAutoclosing:null},updatedAncestorInfo=function(oldInfo,tag,instance){var ancestorInfo=_assign({},oldInfo||emptyAncestorInfo),info={tag:tag,instance:instance};return-1!==inScopeTags.indexOf(tag)&&(ancestorInfo.aTagInScope=null,ancestorInfo.buttonTagInScope=null,ancestorInfo.nobrTagInScope=null),-1!==buttonScopeTags.indexOf(tag)&&(ancestorInfo.pTagInButtonScope=null),-1!==specialTags.indexOf(tag)&&"address"!==tag&&"div"!==tag&&"p"!==tag&&(ancestorInfo.listItemTagAutoclosing=null,ancestorInfo.dlItemTagAutoclosing=null),ancestorInfo.current=info,"form"===tag&&(ancestorInfo.formTag=info),"a"===tag&&(ancestorInfo.aTagInScope=info),"button"===tag&&(ancestorInfo.buttonTagInScope=info),"nobr"===tag&&(ancestorInfo.nobrTagInScope=info),"p"===tag&&(ancestorInfo.pTagInButtonScope=info),"li"===tag&&(ancestorInfo.listItemTagAutoclosing=info),"dd"!==tag&&"dt"!==tag||(ancestorInfo.dlItemTagAutoclosing=info),ancestorInfo},isTagValidWithParent=function(tag,parentTag){switch(parentTag){case"select":return"option"===tag||"optgroup"===tag||"#text"===tag;case"optgroup":return"option"===tag||"#text"===tag;case"option":return"#text"===tag;case"tr":return"th"===tag||"td"===tag||"style"===tag||"script"===tag||"template"===tag;case"tbody":case"thead":case"tfoot":return"tr"===tag||"style"===tag||"script"===tag||"template"===tag;case"colgroup":return"col"===tag||"template"===tag;case"table":return"caption"===tag||"colgroup"===tag||"tbody"===tag||"tfoot"===tag||"thead"===tag||"style"===tag||"script"===tag||"template"===tag;case"head":return"base"===tag||"basefont"===tag||"bgsound"===tag||"link"===tag||"meta"===tag||"title"===tag||"noscript"===tag||"noframes"===tag||"style"===tag||"script"===tag||"template"===tag;case"html":return"head"===tag||"body"===tag;case"#document":return"html"===tag}switch(tag){case"h1":case"h2":case"h3":case"h4":case"h5":case"h6":return"h1"!==parentTag&&"h2"!==parentTag&&"h3"!==parentTag&&"h4"!==parentTag&&"h5"!==parentTag&&"h6"!==parentTag;case"rp":case"rt":return-1===impliedEndTags.indexOf(parentTag);case"body":case"caption":case"col":case"colgroup":case"frame":case"head":case"html":case"tbody":case"td":case"tfoot":case"th":case"thead":case"tr":return null==parentTag}return!0},findInvalidAncestorForTag=function(tag,ancestorInfo){switch(tag){case"address":case"article":case"aside":case"blockquote":case"center":case"details":case"dialog":case"dir":case"div":case"dl":case"fieldset":case"figcaption":case"figure":case"footer":case"header":case"hgroup":case"main":case"menu":case"nav":case"ol":case"p":case"section":case"summary":case"ul":case"pre":case"listing":case"table":case"hr":case"xmp":case"h1":case"h2":case"h3":case"h4":case"h5":case"h6":return ancestorInfo.pTagInButtonScope;case"form":return ancestorInfo.formTag||ancestorInfo.pTagInButtonScope;case"li":return ancestorInfo.listItemTagAutoclosing;case"dd":case"dt":return ancestorInfo.dlItemTagAutoclosing;case"button":return ancestorInfo.buttonTagInScope;case"a":return ancestorInfo.aTagInScope;case"nobr":return ancestorInfo.nobrTagInScope}return null},findOwnerStack=function(instance){if(!instance)return[];var stack=[];do{stack.push(instance)}while(instance=instance._currentElement._owner);return stack.reverse(),stack},didWarn={};validateDOMNesting=function(childTag,childText,childInstance,ancestorInfo){ancestorInfo=ancestorInfo||emptyAncestorInfo;var parentInfo=ancestorInfo.current,parentTag=parentInfo&&parentInfo.tag;null!=childText&&("production"!==process.env.NODE_ENV&&warning(null==childTag,"validateDOMNesting: when childText is passed, childTag should be null"),childTag="#text");var invalidParent=isTagValidWithParent(childTag,parentTag)?null:parentInfo,invalidAncestor=invalidParent?null:findInvalidAncestorForTag(childTag,ancestorInfo),problematic=invalidParent||invalidAncestor;if(problematic){var i,ancestorTag=problematic.tag,ancestorInstance=problematic.instance,childOwner=childInstance&&childInstance._currentElement._owner,ancestorOwner=ancestorInstance&&ancestorInstance._currentElement._owner,childOwners=findOwnerStack(childOwner),ancestorOwners=findOwnerStack(ancestorOwner),minStackLen=Math.min(childOwners.length,ancestorOwners.length),deepestCommon=-1;for(i=0;i<minStackLen&&childOwners[i]===ancestorOwners[i];i++)deepestCommon=i;var childOwnerNames=childOwners.slice(deepestCommon+1).map(function(inst){return inst.getName()||"(unknown)"}),ancestorOwnerNames=ancestorOwners.slice(deepestCommon+1).map(function(inst){return inst.getName()||"(unknown)"}),ownerInfo=[].concat(-1!==deepestCommon?childOwners[deepestCommon].getName()||"(unknown)":[],ancestorOwnerNames,ancestorTag,invalidAncestor?["..."]:[],childOwnerNames,childTag).join(" > "),warnKey=!!invalidParent+"|"+childTag+"|"+ancestorTag+"|"+ownerInfo;if(didWarn[warnKey])return;didWarn[warnKey]=!0;var tagDisplayName=childTag,whitespaceInfo="";if("#text"===childTag?/\S/.test(childText)?tagDisplayName="Text nodes":(tagDisplayName="Whitespace text nodes",whitespaceInfo=" Make sure you don't have any extra whitespace between tags on each line of your source code."):tagDisplayName="<"+childTag+">",invalidParent){var info="";"table"===ancestorTag&&"tr"===childTag&&(info+=" Add a <tbody> to your code to match the DOM tree generated by the browser."),"production"!==process.env.NODE_ENV&&warning(!1,"validateDOMNesting(...): %s cannot appear as a child of <%s>.%s See %s.%s",tagDisplayName,ancestorTag,whitespaceInfo,ownerInfo,info)}else"production"!==process.env.NODE_ENV&&warning(!1,"validateDOMNesting(...): %s cannot appear as a descendant of <%s>. See %s.",tagDisplayName,ancestorTag,ownerInfo)}},validateDOMNesting.updatedAncestorInfo=updatedAncestorInfo,validateDOMNesting.isTagValidInContext=function(tag,ancestorInfo){ancestorInfo=ancestorInfo||emptyAncestorInfo;var parentInfo=ancestorInfo.current,parentTag=parentInfo&&parentInfo.tag;return isTagValidWithParent(tag,parentTag)&&!findInvalidAncestorForTag(tag,ancestorInfo)}}module.exports=validateDOMNesting}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var lowPriorityWarning=function(){};if("production"!==process.env.NODE_ENV){var printWarning=function(format){for(var _len=arguments.length,args=Array(_len>1?_len-1:0),_key=1;_key<_len;_key++)args[_key-1]=arguments[_key];var argIndex=0,message="Warning: "+format.replace(/%s/g,function(){return args[argIndex++]});try{throw new Error(message)}catch(x){}};lowPriorityWarning=function(condition,format){if(void 0===format)throw new Error("`warning(condition, format, ...args)` requires a warning message argument");if(!condition){for(var _len2=arguments.length,args=Array(_len2>2?_len2-2:0),_key2=2;_key2<_len2;_key2++)args[_key2-2]=arguments[_key2];printWarning.apply(void 0,[format].concat(args))}}}module.exports=lowPriorityWarning}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Choice=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),Choice=function(props){var children=props.children,className=props.className,id=props.id,inversed=props.inversed,inputProps=_objectWithoutProperties(props,["children","className","id","inversed"]),inputClasses=(0,_classnames2.default)("ds-c-choice",{"ds-c-choice--inverse":inversed});return id||(id=(0,_lodash2.default)(inputProps.type+"_"+inputProps.name+"_")),_react2.default.createElement("div",{className:className},_react2.default.createElement("input",_extends({className:inputClasses,id:id},inputProps)),_react2.default.createElement("label",{htmlFor:id},children))};exports.Choice=Choice,Choice.defaultProps={type:"checkbox"},Choice.propTypes={children:_propTypes2.default.node.isRequired,checked:_propTypes2.default.bool,className:_propTypes2.default.string,defaultChecked:_propTypes2.default.bool,id:_propTypes2.default.string,inversed:_propTypes2.default.bool,name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,type:_propTypes2.default.oneOf(["checkbox","radio"]),value:_propTypes2.default.oneOfType([_propTypes2.default.number,_propTypes2.default.string]).isRequired},exports.default=Choice},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Select=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),Select=function(props){var children=props.children,className=props.className,id=props.id,inversed=props.inversed,selectProps=_objectWithoutProperties(props,["children","className","id","inversed"]),classes=(0,_classnames2.default)("ds-c-field ds-c-field--select",{"ds-c-field--inverse":inversed},className);return id||(id=(0,_lodash2.default)("select_"+selectProps.name+"_")),_react2.default.createElement("select",_extends({className:classes,id:id},selectProps),children)};exports.Select=Select,Select.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,defaultValue:_propTypes2.default.string,disabled:_propTypes2.default.bool,id:_propTypes2.default.string,inversed:_propTypes2.default.bool,multiple:function(props,propName,componentName){if(props[propName])return new Error("'"+propName+"' supplied to '"+componentName+"'. [A11Y]: Users often don’t understand how to select multiple items from dropdowns. Use checkboxes instead.")},name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,value:_propTypes2.default.string},exports.default=Select},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.FormLabel=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),FormLabel=exports.FormLabel=function(_React$PureComponent){function FormLabel(){return _classCallCheck(this,FormLabel),_possibleConstructorReturn(this,(FormLabel.__proto__||Object.getPrototypeOf(FormLabel)).apply(this,arguments))}return _inherits(FormLabel,_React$PureComponent),_createClass(FormLabel,[{key:"errorMessage",value:function(){if(this.props.errorMessage)return _react2.default.createElement("span",{className:"ds-c-field__hint ds-u-color--error",id:this.props.fieldId+"-message",role:"alert"},this.props.errorMessage)}},{key:"hint",value:function(){if(this.props.hint){var classes=(0,_classnames2.default)("ds-c-field__hint",{"ds-c-field__hint--inverse":this.props.inversed});return _react2.default.createElement("span",{className:classes},this.props.hint)}}},{key:"render",value:function(){var ComponentType=this.props.component,labelTextClasses=this.props.errorMessage&&"ds-u-font-weight--bold",classes=(0,_classnames2.default)("ds-c-label",this.props.className);return _react2.default.createElement(ComponentType,{className:classes,htmlFor:this.props.fieldId},_react2.default.createElement("span",{className:labelTextClasses},this.props.children),this.errorMessage(),this.hint())}}]),FormLabel}(_react2.default.PureComponent);FormLabel.defaultProps={component:"label"},FormLabel.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,component:_propTypes2.default.oneOf(["label","legend"]),errorMessage:_propTypes2.default.string,fieldId:_propTypes2.default.string,hint:_propTypes2.default.node,inversed:_propTypes2.default.bool},exports.default=FormLabel},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Tab=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Tab=exports.Tab=function(_React$PureComponent){function Tab(props){_classCallCheck(this,Tab);var _this=_possibleConstructorReturn(this,(Tab.__proto__||Object.getPrototypeOf(Tab)).call(this,props));return _this.handleClick=_this.handleClick.bind(_this),_this.href=_this.props.href||"#"+_this.props.panelId,_this}return _inherits(Tab,_React$PureComponent),_createClass(Tab,[{key:"handleClick",value:function(evt){this.props.onClick&&this.props.onClick(evt,this.props.panelId,this.props.id,this.href)}},{key:"render",value:function(){var classes=(0,_classnames2.default)("ds-c-tabs__item",this.props.className);return _react2.default.createElement("a",{"aria-selected":String(this.props.selected),"aria-controls":this.props.panelId,className:classes,href:this.href,id:this.props.id,onClick:this.handleClick,role:"tab"},this.props.children)}}]),Tab}(_react2.default.PureComponent);Tab.defaultProps={selected:!1},Tab.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,id:_propTypes2.default.string.isRequired,href:_propTypes2.default.string,onClick:_propTypes2.default.func,panelId:_propTypes2.default.string.isRequired,selected:_propTypes2.default.bool},exports.default=Tab},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function TabPanel(props){var classes=(0,_classnames2.default)("ds-c-tabs__panel",props.className);return _react2.default.createElement("div",{"aria-labelledby":props.tabId,"aria-hidden":String(!props.selected),className:classes,id:props.id,role:"tabpanel"},props.children)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.TabPanel=TabPanel;var _propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames);TabPanel.defaultProps={selected:!1},TabPanel.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,id:_propTypes2.default.string.isRequired,selected:_propTypes2.default.bool,tab:_propTypes2.default.string,tabClassName:_propTypes2.default.string,tabHref:_propTypes2.default.string,tabId:_propTypes2.default.string},exports.default=TabPanel},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.VerticalNav=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_VerticalNavItem=__webpack_require__(146),_VerticalNavItem2=_interopRequireDefault(_VerticalNavItem),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),VerticalNav=exports.VerticalNav=function(_React$PureComponent){function VerticalNav(){return _classCallCheck(this,VerticalNav),_possibleConstructorReturn(this,(VerticalNav.__proto__||Object.getPrototypeOf(VerticalNav)).apply(this,arguments))}return _inherits(VerticalNav,_React$PureComponent),_createClass(VerticalNav,[{key:"renderItems",value:function(){var _this2=this;return this.props.items.map(function(item){var onClick=item.onClick||_this2.props.onLinkClick,selected=item.selected||_this2.props.selectedId&&_this2.props.selectedId===item.id;return onClick||(onClick=void 0),_react2.default.createElement(_VerticalNavItem2.default,_extends({},item,{_selectedId:_this2.props.selectedId,key:item.id+item.url+item.label,onClick:onClick,selected:selected}))})}},{key:"render",value:function(){var classes=(0,_classnames2.default)({"ds-c-vertical-nav":!this.props.nested,"ds-c-vertical-nav__subnav":this.props.nested,"ds-u-display--none":this.props.collapsed},this.props.className);return _react2.default.createElement("ul",{className:classes,id:this.props.id},this.renderItems())}}]),VerticalNav}(_react2.default.PureComponent);VerticalNav.defaultProps={collapsed:!1},VerticalNav.propTypes={className:_propTypes2.default.string,collapsed:_propTypes2.default.bool,selectedId:_propTypes2.default.string,id:_propTypes2.default.string,items:_propTypes2.default.arrayOf(_propTypes2.default.object).isRequired,nested:_propTypes2.default.bool,onLinkClick:_propTypes2.default.func},exports.default=VerticalNav},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0});var _propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),CodeSnippet=function(props){return _react2.default.createElement("details",{className:"ds-u-margin-bottom--2",open:props.open},_react2.default.createElement("summary",{className:"ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1"},"Code snippet"),_react2.default.createElement("pre",{className:"language-"+props.language},_react2.default.createElement("code",{dangerouslySetInnerHTML:{__html:props.children}})))};CodeSnippet.defaultProps={language:"markup",open:!1},CodeSnippet.propTypes={children:_propTypes2.default.node.isRequired,language:_propTypes2.default.oneOf(["markup","jsx"]),open:_propTypes2.default.bool},exports.default=CodeSnippet},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0});var _propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_reactComponentPath=__webpack_require__(78),_reactComponentPath2=_interopRequireDefault(_reactComponentPath),Source=function(props){if(props.reactComponent||props.source){var reactPath=props.reactComponent&&(0,_reactComponentPath2.default)(props.source.path,props.reactComponent).replace(/[a-z-]+\/src\//,""),path=props.reactComponent?reactPath+".jsx":props.source.filename;return _react2.default.createElement("code",{className:"ds-u-font-size--small"},path)}return null};Source.propTypes={reactComponent:_propTypes2.default.string,source:_propTypes2.default.shape({filename:_propTypes2.default.string.isRequired,path:_propTypes2.default.string.isRequired})},exports.default=Source},function(module,exports,__webpack_require__){"use strict";function reactComponentPath(path,name){return path=path.match(/packages\/([a-z0-9_\-\/]+)/i)[1],path.replace(/\/([a-z0-9_-]+)$/i,"/"+name)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=reactComponentPath},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Choice=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),Choice=function(props){var children=props.children,className=props.className,id=props.id,inversed=props.inversed,inputProps=_objectWithoutProperties(props,["children","className","id","inversed"]),inputClasses=(0,_classnames2.default)("ds-c-choice",{"ds-c-choice--inverse":inversed});return id||(id=(0,_lodash2.default)(inputProps.type+"_"+inputProps.name+"_")),_react2.default.createElement("div",{className:className},_react2.default.createElement("input",_extends({className:inputClasses,id:id},inputProps)),_react2.default.createElement("label",{htmlFor:id},children))};exports.Choice=Choice,Choice.defaultProps={type:"checkbox"},Choice.propTypes={children:_propTypes2.default.node.isRequired,checked:_propTypes2.default.bool,className:_propTypes2.default.string,defaultChecked:_propTypes2.default.bool,id:_propTypes2.default.string,inversed:_propTypes2.default.bool,name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,type:_propTypes2.default.oneOf(["checkbox","radio"]),value:_propTypes2.default.oneOfType([_propTypes2.default.number,_propTypes2.default.string]).isRequired},exports.default=Choice},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Select=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),Select=function(props){var children=props.children,className=props.className,id=props.id,inversed=props.inversed,selectProps=_objectWithoutProperties(props,["children","className","id","inversed"]),classes=(0,_classnames2.default)("ds-c-field ds-c-field--select",{"ds-c-field--inverse":inversed},className);return id||(id=(0,_lodash2.default)("select_"+selectProps.name+"_")),_react2.default.createElement("select",_extends({className:classes,id:id},selectProps),children)};exports.Select=Select,Select.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,defaultValue:_propTypes2.default.string,disabled:_propTypes2.default.bool,id:_propTypes2.default.string,inversed:_propTypes2.default.bool,multiple:function(props,propName,componentName){if(props[propName])return new Error("'"+propName+"' supplied to '"+componentName+"'. [A11Y]: Users often don’t understand how to select multiple items from dropdowns. Use checkboxes instead.")},name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,value:_propTypes2.default.string},exports.default=Select},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Tab=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Tab=exports.Tab=function(_React$PureComponent){function Tab(props){_classCallCheck(this,Tab);var _this=_possibleConstructorReturn(this,(Tab.__proto__||Object.getPrototypeOf(Tab)).call(this,props));return _this.handleClick=_this.handleClick.bind(_this),_this.href=_this.props.href||"#"+_this.props.panelId,_this}return _inherits(Tab,_React$PureComponent),_createClass(Tab,[{key:"handleClick",value:function(evt){this.props.onClick&&this.props.onClick(evt,this.props.panelId,this.props.id,this.href)}},{key:"render",value:function(){var classes=(0,_classnames2.default)("ds-c-tabs__item",this.props.className);return _react2.default.createElement("a",{"aria-selected":String(this.props.selected),"aria-controls":this.props.panelId,className:classes,href:this.href,id:this.props.id,onClick:this.handleClick,role:"tab"},this.props.children)}}]),Tab}(_react2.default.PureComponent);Tab.defaultProps={selected:!1},Tab.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,id:_propTypes2.default.string.isRequired,href:_propTypes2.default.string,onClick:_propTypes2.default.func,panelId:_propTypes2.default.string.isRequired,selected:_propTypes2.default.bool},exports.default=Tab},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function TabPanel(props){var classes=(0,_classnames2.default)("ds-c-tabs__panel",props.className);return _react2.default.createElement("div",{"aria-labelledby":props.tabId,"aria-hidden":String(!props.selected),className:classes,id:props.id,role:"tabpanel"},props.children)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.TabPanel=TabPanel;var _propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames);TabPanel.defaultProps={selected:!1},TabPanel.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,id:_propTypes2.default.string.isRequired,selected:_propTypes2.default.bool,tab:_propTypes2.default.string,tabClassName:_propTypes2.default.string,tabHref:_propTypes2.default.string,tabId:_propTypes2.default.string},exports.default=TabPanel},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.VerticalNav=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_VerticalNavItem=__webpack_require__(84),_VerticalNavItem2=_interopRequireDefault(_VerticalNavItem),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),VerticalNav=exports.VerticalNav=function(_React$PureComponent){function VerticalNav(){return _classCallCheck(this,VerticalNav),_possibleConstructorReturn(this,(VerticalNav.__proto__||Object.getPrototypeOf(VerticalNav)).apply(this,arguments))}return _inherits(VerticalNav,_React$PureComponent),_createClass(VerticalNav,[{key:"renderItems",value:function(){var _this2=this;return this.props.items.map(function(item){var onClick=item.onClick||_this2.props.onLinkClick,selected=item.selected||_this2.props.selectedId&&_this2.props.selectedId===item.id;return onClick||(onClick=void 0),_react2.default.createElement(_VerticalNavItem2.default,_extends({},item,{_selectedId:_this2.props.selectedId,key:item.id+item.url+item.label,onClick:onClick,selected:selected}))})}},{key:"render",value:function(){var classes=(0,_classnames2.default)({"ds-c-vertical-nav":!this.props.nested,"ds-c-vertical-nav__subnav":this.props.nested,"ds-u-display--none":this.props.collapsed},this.props.className);return _react2.default.createElement("ul",{className:classes,id:this.props.id},this.renderItems())}}]),VerticalNav}(_react2.default.PureComponent);VerticalNav.defaultProps={collapsed:!1},VerticalNav.propTypes={className:_propTypes2.default.string,collapsed:_propTypes2.default.bool,selectedId:_propTypes2.default.string,id:_propTypes2.default.string,items:_propTypes2.default.arrayOf(_propTypes2.default.object).isRequired,nested:_propTypes2.default.bool,onLinkClick:_propTypes2.default.func},exports.default=VerticalNav},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.VerticalNavItem=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_VerticalNav=__webpack_require__(83),_VerticalNav2=_interopRequireDefault(_VerticalNav),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),VerticalNavItem=exports.VerticalNavItem=function(_React$PureComponent){function VerticalNavItem(props){_classCallCheck(this,VerticalNavItem);var _this=_possibleConstructorReturn(this,(VerticalNavItem.__proto__||Object.getPrototypeOf(VerticalNavItem)).call(this,props));return _this.handleLinkClick=_this.handleLinkClick.bind(_this),_this.handleToggleClick=_this.handleToggleClick.bind(_this),_this.id=_this.props.id||(0,_lodash2.default)("VerticalNavItem_"),_this.subnavId=_this.id+"__subnav",_this.state={collapsed:_this.props.defaultCollapsed},_this}return _inherits(VerticalNavItem,_React$PureComponent),_createClass(VerticalNavItem,[{key:"componentDidUpdate",value:function(prevProps,prevState){this.props.onSubnavToggle&&prevState.collapsed!==this.state.collapsed&&this.props.onSubnavToggle(this.props.id,this.state.collapsed)}},{key:"handleLinkClick",value:function(evt){this.props.onClick&&this.props.onClick(evt,this.id,this.props.url)}},{key:"handleToggleClick",value:function(){this.setState({collapsed:!this.state.collapsed})}},{key:"hasSubnav",value:function(){return this.props.items&&this.props.items.length}},{key:"isSelected",value:function(){return this.props.selected?this.props.selected:this.props._selectedId&&this.hasSubnav()?this.childIsSelected(this.props.items):void 0}},{key:"childIsSelected",value:function(children){var _this2=this;return!(!children||!children.length)&&children.some(function(child){return child.id===_this2.props._selectedId||_this2.childIsSelected(child.items)})}},{key:"renderSubnavToggle",value:function(){if(this.hasSubnav()){var label=this.state.collapsed?this.props.ariaCollapsedStateButtonLabel:this.props.ariaExpandedStateButtonLabel;return _react2.default.createElement("button",{"aria-controls":this.subnavId,"aria-expanded":!this.state.collapsed,className:"ds-c-vertical-nav__subnav-toggle",onClick:this.handleToggleClick},label)}}},{key:"renderSubnav",value:function(){if(this.hasSubnav())return _react2.default.createElement(_VerticalNav2.default,{selectedId:this.props._selectedId,collapsed:this.state.collapsed,id:this.subnavId,items:this.props.items,nested:!0})}},{key:"render",value:function(){var classes=(0,_classnames2.default)("ds-c-vertical-nav__item",this.props.className),LinkComponent=this.props.url?"a":"div",linkProps={className:(0,_classnames2.default)("ds-c-vertical-nav__link",{"ds-c-vertical-nav__link--current":this.isSelected(),"ds-c-vertical-nav__link--parent":this.hasSubnav()}),href:this.props.url?this.props.url:void 0,onClick:this.props.onClick?this.handleLinkClick:void 0};return _react2.default.createElement("li",{className:classes},_react2.default.createElement(LinkComponent,linkProps,this.props.label),this.renderSubnavToggle(),this.renderSubnav())}}]),VerticalNavItem}(_react2.default.PureComponent);VerticalNavItem.defaultProps={ariaCollapsedStateButtonLabel:"Expand sub-navigation",ariaExpandedStateButtonLabel:"Collapse sub-navigation",defaultCollapsed:!1},VerticalNavItem.propTypes={_selectedId:_propTypes2.default.string,ariaCollapsedStateButtonLabel:_propTypes2.default.string,ariaExpandedStateButtonLabel:_propTypes2.default.string,className:_propTypes2.default.string,defaultCollapsed:_propTypes2.default.bool,onClick:_propTypes2.default.func,onSubnavToggle:_propTypes2.default.func,id:_propTypes2.default.string,items:_propTypes2.default.arrayOf(_propTypes2.default.shape(VerticalNavItem.propTypes)),label:_propTypes2.default.node.isRequired,url:_propTypes2.default.string,selected:_propTypes2.default.bool},exports.default=VerticalNavItem},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _components=__webpack_require__(166);Object.keys(_components).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _components[key]}})})},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyObject={};"production"!==process.env.NODE_ENV&&Object.freeze(emptyObject),module.exports=emptyObject}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyFunction=__webpack_require__(34),invariant=__webpack_require__(15),warning=__webpack_require__(19),ReactPropTypesSecret=__webpack_require__(48),checkPropTypes=__webpack_require__(168);module.exports=function(isValidElement,throwOnDirectAccess){function getIteratorFn(maybeIterable){var iteratorFn=maybeIterable&&(ITERATOR_SYMBOL&&maybeIterable[ITERATOR_SYMBOL]||maybeIterable[FAUX_ITERATOR_SYMBOL]);if("function"==typeof iteratorFn)return iteratorFn}function is(x,y){return x===y?0!==x||1/x==1/y:x!==x&&y!==y}function PropTypeError(message){this.message=message,this.stack=""}function createChainableTypeChecker(validate){function checkType(isRequired,props,propName,componentName,location,propFullName,secret){if(componentName=componentName||ANONYMOUS,propFullName=propFullName||propName,secret!==ReactPropTypesSecret)if(throwOnDirectAccess)invariant(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types");else if("production"!==process.env.NODE_ENV&&"undefined"!=typeof console){var cacheKey=componentName+":"+propName;!manualPropTypeCallCache[cacheKey]&&manualPropTypeWarningCount<3&&(warning(!1,"You are manually calling a React.PropTypes validation function for the `%s` prop on `%s`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details.",propFullName,componentName),manualPropTypeCallCache[cacheKey]=!0,manualPropTypeWarningCount++)}return null==props[propName]?isRequired?new PropTypeError(null===props[propName]?"The "+location+" `"+propFullName+"` is marked as required in `"+componentName+"`, but its value is `null`.":"The "+location+" `"+propFullName+"` is marked as required in `"+componentName+"`, but its value is `undefined`."):null:validate(props,propName,componentName,location,propFullName)}if("production"!==process.env.NODE_ENV)var manualPropTypeCallCache={},manualPropTypeWarningCount=0;var chainedCheckType=checkType.bind(null,!1);return chainedCheckType.isRequired=checkType.bind(null,!0),chainedCheckType}function createPrimitiveTypeChecker(expectedType){function validate(props,propName,componentName,location,propFullName,secret){var propValue=props[propName];if(getPropType(propValue)!==expectedType)return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getPreciseType(propValue)+"` supplied to `"+componentName+"`, expected `"+expectedType+"`.");return null}return createChainableTypeChecker(validate)}function createArrayOfTypeChecker(typeChecker){function validate(props,propName,componentName,location,propFullName){if("function"!=typeof typeChecker)return new PropTypeError("Property `"+propFullName+"` of component `"+componentName+"` has invalid PropType notation inside arrayOf.");var propValue=props[propName];if(!Array.isArray(propValue)){return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getPropType(propValue)+"` supplied to `"+componentName+"`, expected an array.")}for(var i=0;i<propValue.length;i++){var error=typeChecker(propValue,i,componentName,location,propFullName+"["+i+"]",ReactPropTypesSecret);if(error instanceof Error)return error}return null}return createChainableTypeChecker(validate)}function createInstanceTypeChecker(expectedClass){function validate(props,propName,componentName,location,propFullName){if(!(props[propName]instanceof expectedClass)){var expectedClassName=expectedClass.name||ANONYMOUS;return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getClassName(props[propName])+"` supplied to `"+componentName+"`, expected instance of `"+expectedClassName+"`.")}return null}return createChainableTypeChecker(validate)}function createEnumTypeChecker(expectedValues){function validate(props,propName,componentName,location,propFullName){for(var propValue=props[propName],i=0;i<expectedValues.length;i++)if(is(propValue,expectedValues[i]))return null;return new PropTypeError("Invalid "+location+" `"+propFullName+"` of value `"+propValue+"` supplied to `"+componentName+"`, expected one of "+JSON.stringify(expectedValues)+".")}return Array.isArray(expectedValues)?createChainableTypeChecker(validate):("production"!==process.env.NODE_ENV&&warning(!1,"Invalid argument supplied to oneOf, expected an instance of array."),emptyFunction.thatReturnsNull)}function createObjectOfTypeChecker(typeChecker){function validate(props,propName,componentName,location,propFullName){if("function"!=typeof typeChecker)return new PropTypeError("Property `"+propFullName+"` of component `"+componentName+"` has invalid PropType notation inside objectOf.");var propValue=props[propName],propType=getPropType(propValue);if("object"!==propType)return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+propType+"` supplied to `"+componentName+"`, expected an object.");for(var key in propValue)if(propValue.hasOwnProperty(key)){var error=typeChecker(propValue,key,componentName,location,propFullName+"."+key,ReactPropTypesSecret);if(error instanceof Error)return error}return null}return createChainableTypeChecker(validate)}function createUnionTypeChecker(arrayOfTypeCheckers){function validate(props,propName,componentName,location,propFullName){for(var i=0;i<arrayOfTypeCheckers.length;i++){if(null==(0,arrayOfTypeCheckers[i])(props,propName,componentName,location,propFullName,ReactPropTypesSecret))return null}return new PropTypeError("Invalid "+location+" `"+propFullName+"` supplied to `"+componentName+"`.")}if(!Array.isArray(arrayOfTypeCheckers))return"production"!==process.env.NODE_ENV&&warning(!1,"Invalid argument supplied to oneOfType, expected an instance of array."),emptyFunction.thatReturnsNull;for(var i=0;i<arrayOfTypeCheckers.length;i++){var checker=arrayOfTypeCheckers[i];if("function"!=typeof checker)return warning(!1,"Invalid argument supplid to oneOfType. Expected an array of check functions, but received %s at index %s.",getPostfixForTypeWarning(checker),i),emptyFunction.thatReturnsNull}return createChainableTypeChecker(validate)}function createShapeTypeChecker(shapeTypes){function validate(props,propName,componentName,location,propFullName){var propValue=props[propName],propType=getPropType(propValue);if("object"!==propType)return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+propType+"` supplied to `"+componentName+"`, expected `object`.");for(var key in shapeTypes){var checker=shapeTypes[key];if(checker){var error=checker(propValue,key,componentName,location,propFullName+"."+key,ReactPropTypesSecret);if(error)return error}}return null}return createChainableTypeChecker(validate)}function isNode(propValue){switch(typeof propValue){case"number":case"string":case"undefined":return!0;case"boolean":return!propValue;case"object":if(Array.isArray(propValue))return propValue.every(isNode);if(null===propValue||isValidElement(propValue))return!0;var iteratorFn=getIteratorFn(propValue);if(!iteratorFn)return!1;var step,iterator=iteratorFn.call(propValue);if(iteratorFn!==propValue.entries){for(;!(step=iterator.next()).done;)if(!isNode(step.value))return!1}else for(;!(step=iterator.next()).done;){var entry=step.value;if(entry&&!isNode(entry[1]))return!1}return!0;default:return!1}}function isSymbol(propType,propValue){return"symbol"===propType||("Symbol"===propValue["@@toStringTag"]||"function"==typeof Symbol&&propValue instanceof Symbol)}function getPropType(propValue){var propType=typeof propValue;return Array.isArray(propValue)?"array":propValue instanceof RegExp?"object":isSymbol(propType,propValue)?"symbol":propType}function getPreciseType(propValue){if(void 0===propValue||null===propValue)return""+propValue;var propType=getPropType(propValue);if("object"===propType){if(propValue instanceof Date)return"date";if(propValue instanceof RegExp)return"regexp"}return propType}function getPostfixForTypeWarning(value){var type=getPreciseType(value);switch(type){case"array":case"object":return"an "+type;case"boolean":case"date":case"regexp":return"a "+type;default:return type}}function getClassName(propValue){return propValue.constructor&&propValue.constructor.name?propValue.constructor.name:ANONYMOUS}var ITERATOR_SYMBOL="function"==typeof Symbol&&Symbol.iterator,FAUX_ITERATOR_SYMBOL="@@iterator",ANONYMOUS="<<anonymous>>",ReactPropTypes={array:createPrimitiveTypeChecker("array"),bool:createPrimitiveTypeChecker("boolean"),func:createPrimitiveTypeChecker("function"),number:createPrimitiveTypeChecker("number"),object:createPrimitiveTypeChecker("object"),string:createPrimitiveTypeChecker("string"),symbol:createPrimitiveTypeChecker("symbol"),any:function(){return createChainableTypeChecker(emptyFunction.thatReturnsNull)}(),arrayOf:createArrayOfTypeChecker,element:function(){function validate(props,propName,componentName,location,propFullName){var propValue=props[propName];if(!isValidElement(propValue)){return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getPropType(propValue)+"` supplied to `"+componentName+"`, expected a single ReactElement.")}return null}return createChainableTypeChecker(validate)}(),instanceOf:createInstanceTypeChecker,node:function(){function validate(props,propName,componentName,location,propFullName){return isNode(props[propName])?null:new PropTypeError("Invalid "+location+" `"+propFullName+"` supplied to `"+componentName+"`, expected a ReactNode.")}return createChainableTypeChecker(validate)}(),objectOf:createObjectOfTypeChecker,oneOf:createEnumTypeChecker,oneOfType:createUnionTypeChecker,shape:createShapeTypeChecker};return PropTypeError.prototype=Error.prototype,ReactPropTypes.checkPropTypes=checkPropTypes,ReactPropTypes.PropTypes=ReactPropTypes,ReactPropTypes}}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function ReactComponent(props,context,updater){this.props=props,this.context=context,this.refs=emptyObject,this.updater=updater||ReactNoopUpdateQueue}function ReactPureComponent(props,context,updater){this.props=props,this.context=context,this.refs=emptyObject,this.updater=updater||ReactNoopUpdateQueue}function ComponentDummy(){}var _prodInvariant=__webpack_require__(25),_assign=__webpack_require__(35),ReactNoopUpdateQueue=__webpack_require__(91),canDefineProperty=__webpack_require__(37),emptyObject=__webpack_require__(86),invariant=__webpack_require__(15),lowPriorityWarning=__webpack_require__(50);if(ReactComponent.prototype.isReactComponent={},ReactComponent.prototype.setState=function(partialState,callback){"object"!=typeof partialState&&"function"!=typeof partialState&&null!=partialState&&("production"!==process.env.NODE_ENV?invariant(!1,"setState(...): takes an object of state variables to update or a function which returns an object of state variables."):_prodInvariant("85")),this.updater.enqueueSetState(this,partialState),callback&&this.updater.enqueueCallback(this,callback,"setState")},ReactComponent.prototype.forceUpdate=function(callback){this.updater.enqueueForceUpdate(this),callback&&this.updater.enqueueCallback(this,callback,"forceUpdate")},"production"!==process.env.NODE_ENV){var deprecatedAPIs={isMounted:["isMounted","Instead, make sure to clean up subscriptions and pending requests in componentWillUnmount to prevent memory leaks."],replaceState:["replaceState","Refactor your code to use setState instead (see https://github.com/facebook/react/issues/3236)."]};for(var fnName in deprecatedAPIs)deprecatedAPIs.hasOwnProperty(fnName)&&function(methodName,info){canDefineProperty&&Object.defineProperty(ReactComponent.prototype,methodName,{get:function(){lowPriorityWarning(!1,"%s(...) is deprecated in plain JavaScript React classes. %s",info[0],info[1])}})}(fnName,deprecatedAPIs[fnName])}ComponentDummy.prototype=ReactComponent.prototype,ReactPureComponent.prototype=new ComponentDummy,ReactPureComponent.prototype.constructor=ReactPureComponent,_assign(ReactPureComponent.prototype,ReactComponent.prototype),ReactPureComponent.prototype.isPureReactComponent=!0,module.exports={Component:ReactComponent,PureComponent:ReactPureComponent}}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var REACT_ELEMENT_TYPE="function"==typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103;module.exports=REACT_ELEMENT_TYPE},function(module,exports,__webpack_require__){"use strict";(function(process){function getDeclarationErrorAddendum(){if(ReactCurrentOwner.current){var name=ReactCurrentOwner.current.getName();if(name)return" Check the render method of `"+name+"`."}return""}function getSourceInfoErrorAddendum(elementProps){if(null!==elementProps&&void 0!==elementProps&&void 0!==elementProps.__source){var source=elementProps.__source;return" Check your code at "+source.fileName.replace(/^.*[\\\/]/,"")+":"+source.lineNumber+"."}return""}function getCurrentComponentErrorInfo(parentType){var info=getDeclarationErrorAddendum();if(!info){var parentName="string"==typeof parentType?parentType:parentType.displayName||parentType.name;parentName&&(info=" Check the top-level render call using <"+parentName+">.")}return info}function validateExplicitKey(element,parentType){if(element._store&&!element._store.validated&&null==element.key){element._store.validated=!0;var memoizer=ownerHasKeyUseWarning.uniqueKey||(ownerHasKeyUseWarning.uniqueKey={}),currentComponentErrorInfo=getCurrentComponentErrorInfo(parentType);if(!memoizer[currentComponentErrorInfo]){memoizer[currentComponentErrorInfo]=!0;var childOwner="";element&&element._owner&&element._owner!==ReactCurrentOwner.current&&(childOwner=" It was passed a child from "+element._owner.getName()+"."),"production"!==process.env.NODE_ENV&&warning(!1,'Each child in an array or iterator should have a unique "key" prop.%s%s See https://fb.me/react-warning-keys for more information.%s',currentComponentErrorInfo,childOwner,ReactComponentTreeHook.getCurrentStackAddendum(element))}}}function validateChildKeys(node,parentType){if("object"==typeof node)if(Array.isArray(node))for(var i=0;i<node.length;i++){var child=node[i];ReactElement.isValidElement(child)&&validateExplicitKey(child,parentType)}else if(ReactElement.isValidElement(node))node._store&&(node._store.validated=!0);else if(node){var iteratorFn=getIteratorFn(node);if(iteratorFn&&iteratorFn!==node.entries)for(var step,iterator=iteratorFn.call(node);!(step=iterator.next()).done;)ReactElement.isValidElement(step.value)&&validateExplicitKey(step.value,parentType)}}function validatePropTypes(element){var componentClass=element.type;if("function"==typeof componentClass){var name=componentClass.displayName||componentClass.name;componentClass.propTypes&&checkReactTypeSpec(componentClass.propTypes,element.props,"prop",name,element,null),"function"==typeof componentClass.getDefaultProps&&"production"!==process.env.NODE_ENV&&warning(componentClass.getDefaultProps.isReactClassApproved,"getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}var ReactCurrentOwner=__webpack_require__(36),ReactComponentTreeHook=__webpack_require__(49),ReactElement=__webpack_require__(22),checkReactTypeSpec=__webpack_require__(180),canDefineProperty=__webpack_require__(37),getIteratorFn=__webpack_require__(92),warning=__webpack_require__(19),lowPriorityWarning=__webpack_require__(50),ownerHasKeyUseWarning={},ReactElementValidator={createElement:function(type,props,children){var validType="string"==typeof type||"function"==typeof type;if(!validType&&"function"!=typeof type&&"string"!=typeof type){var info="";(void 0===type||"object"==typeof type&&null!==type&&0===Object.keys(type).length)&&(info+=" You likely forgot to export your component from the file it's defined in.");var sourceInfo=getSourceInfoErrorAddendum(props);info+=sourceInfo||getDeclarationErrorAddendum(),info+=ReactComponentTreeHook.getCurrentStackAddendum();var currentSource=null!==props&&void 0!==props&&void 0!==props.__source?props.__source:null;ReactComponentTreeHook.pushNonStandardWarningStack(!0,currentSource),"production"!==process.env.NODE_ENV&&warning(!1,"React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",null==type?type:typeof type,info),ReactComponentTreeHook.popNonStandardWarningStack()}var element=ReactElement.createElement.apply(this,arguments);if(null==element)return element;if(validType)for(var i=2;i<arguments.length;i++)validateChildKeys(arguments[i],type);return validatePropTypes(element),element},createFactory:function(type){var validatedFactory=ReactElementValidator.createElement.bind(null,type);return validatedFactory.type=type,"production"!==process.env.NODE_ENV&&canDefineProperty&&Object.defineProperty(validatedFactory,"type",{enumerable:!1,get:function(){return lowPriorityWarning(!1,"Factory.type is deprecated. Access the class directly before passing it to createFactory."),Object.defineProperty(this,"type",{value:type}),type}}),validatedFactory},cloneElement:function(element,props,children){for(var newElement=ReactElement.cloneElement.apply(this,arguments),i=2;i<arguments.length;i++)validateChildKeys(arguments[i],newElement.type);return validatePropTypes(newElement),newElement}};module.exports=ReactElementValidator}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function warnNoop(publicInstance,callerName){if("production"!==process.env.NODE_ENV){var constructor=publicInstance.constructor;"production"!==process.env.NODE_ENV&&warning(!1,"%s(...): Can only update a mounted or mounting component. This usually means you called %s() on an unmounted component. This is a no-op. Please check the code for the %s component.",callerName,callerName,constructor&&(constructor.displayName||constructor.name)||"ReactClass")}}var warning=__webpack_require__(19),ReactNoopUpdateQueue={isMounted:function(publicInstance){return!1},enqueueCallback:function(publicInstance,callback){},enqueueForceUpdate:function(publicInstance){warnNoop(publicInstance,"forceUpdate")},enqueueReplaceState:function(publicInstance,completeState){warnNoop(publicInstance,"replaceState")},enqueueSetState:function(publicInstance,partialState){warnNoop(publicInstance,"setState")}};module.exports=ReactNoopUpdateQueue}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function getIteratorFn(maybeIterable){var iteratorFn=maybeIterable&&(ITERATOR_SYMBOL&&maybeIterable[ITERATOR_SYMBOL]||maybeIterable[FAUX_ITERATOR_SYMBOL]);if("function"==typeof iteratorFn)return iteratorFn}var ITERATOR_SYMBOL="function"==typeof Symbol&&Symbol.iterator,FAUX_ITERATOR_SYMBOL="@@iterator";module.exports=getIteratorFn},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyFunction=__webpack_require__(12),EventListener={listen:function(target,eventType,callback){return target.addEventListener?(target.addEventListener(eventType,callback,!1),{remove:function(){target.removeEventListener(eventType,callback,!1)}}):target.attachEvent?(target.attachEvent("on"+eventType,callback),{remove:function(){target.detachEvent("on"+eventType,callback)}}):void 0},capture:function(target,eventType,callback){return target.addEventListener?(target.addEventListener(eventType,callback,!0),{remove:function(){target.removeEventListener(eventType,callback,!0)}}):(process.env.NODE_ENV,{remove:emptyFunction})},registerDefault:function(){}};module.exports=EventListener}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function focusNode(node){try{node.focus()}catch(e){}}module.exports=focusNode},function(module,exports,__webpack_require__){"use strict";function getActiveElement(){if("undefined"==typeof document)return null;try{return document.activeElement||document.body}catch(e){return document.body}}module.exports=getActiveElement},function(module,exports,__webpack_require__){var root=__webpack_require__(213),Symbol=root.Symbol;module.exports=Symbol},function(module,exports,__webpack_require__){function baseGetTag(value){return null==value?void 0===value?undefinedTag:nullTag:symToStringTag&&symToStringTag in Object(value)?getRawTag(value):objectToString(value)}var Symbol=__webpack_require__(96),getRawTag=__webpack_require__(209),objectToString=__webpack_require__(212),nullTag="[object Null]",undefinedTag="[object Undefined]",symToStringTag=Symbol?Symbol.toStringTag:void 0;module.exports=baseGetTag},function(module,exports,__webpack_require__){function toInteger(value){var result=toFinite(value),remainder=result%1;return result===result?remainder?result-remainder:result:0}var toFinite=__webpack_require__(221);module.exports=toInteger},function(module,exports,__webpack_require__){(function(global){var _self="undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{},Prism=function(){var lang=/\blang(?:uage)?-(\w+)\b/i,uniqueId=0,_=_self.Prism={util:{encode:function(tokens){return tokens instanceof Token?new Token(tokens.type,_.util.encode(tokens.content),tokens.alias):"Array"===_.util.type(tokens)?tokens.map(_.util.encode):tokens.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/\u00a0/g," ")},type:function(o){return Object.prototype.toString.call(o).match(/\[object (\w+)\]/)[1]},objId:function(obj){return obj.__id||Object.defineProperty(obj,"__id",{value:++uniqueId}),obj.__id},clone:function(o){switch(_.util.type(o)){case"Object":var clone={};for(var key in o)o.hasOwnProperty(key)&&(clone[key]=_.util.clone(o[key]));return clone;case"Array":return o.map&&o.map(function(v){return _.util.clone(v)})}return o}},languages:{extend:function(id,redef){var lang=_.util.clone(_.languages[id]);for(var key in redef)lang[key]=redef[key];return lang},insertBefore:function(inside,before,insert,root){root=root||_.languages;var grammar=root[inside];if(2==arguments.length){insert=arguments[1];for(var newToken in insert)insert.hasOwnProperty(newToken)&&(grammar[newToken]=insert[newToken]);return grammar}var ret={};for(var token in grammar)if(grammar.hasOwnProperty(token)){if(token==before)for(var newToken in insert)insert.hasOwnProperty(newToken)&&(ret[newToken]=insert[newToken]);ret[token]=grammar[token]}return _.languages.DFS(_.languages,function(key,value){value===root[inside]&&key!=inside&&(this[key]=ret)}),root[inside]=ret},DFS:function(o,callback,type,visited){visited=visited||{};for(var i in o)o.hasOwnProperty(i)&&(callback.call(o,i,o[i],type||i),"Object"!==_.util.type(o[i])||visited[_.util.objId(o[i])]?"Array"!==_.util.type(o[i])||visited[_.util.objId(o[i])]||(visited[_.util.objId(o[i])]=!0,_.languages.DFS(o[i],callback,i,visited)):(visited[_.util.objId(o[i])]=!0,_.languages.DFS(o[i],callback,null,visited)))}},plugins:{},highlightAll:function(async,callback){var env={callback:callback,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};_.hooks.run("before-highlightall",env);for(var element,elements=env.elements||document.querySelectorAll(env.selector),i=0;element=elements[i++];)_.highlightElement(element,!0===async,env.callback)},highlightElement:function(element,async,callback){for(var language,grammar,parent=element;parent&&!lang.test(parent.className);)parent=parent.parentNode;parent&&(language=(parent.className.match(lang)||[,""])[1].toLowerCase(),grammar=_.languages[language]),element.className=element.className.replace(lang,"").replace(/\s+/g," ")+" language-"+language,parent=element.parentNode,/pre/i.test(parent.nodeName)&&(parent.className=parent.className.replace(lang,"").replace(/\s+/g," ")+" language-"+language);var code=element.textContent,env={element:element,language:language,grammar:grammar,code:code};if(_.hooks.run("before-sanity-check",env),!env.code||!env.grammar)return env.code&&(env.element.textContent=env.code),void _.hooks.run("complete",env);if(_.hooks.run("before-highlight",env),async&&_self.Worker){var worker=new Worker(_.filename);worker.onmessage=function(evt){env.highlightedCode=evt.data,_.hooks.run("before-insert",env),env.element.innerHTML=env.highlightedCode,callback&&callback.call(env.element),_.hooks.run("after-highlight",env),_.hooks.run("complete",env)},worker.postMessage(JSON.stringify({language:env.language,code:env.code,immediateClose:!0}))}else env.highlightedCode=_.highlight(env.code,env.grammar,env.language),_.hooks.run("before-insert",env),env.element.innerHTML=env.highlightedCode,callback&&callback.call(element),_.hooks.run("after-highlight",env),_.hooks.run("complete",env)},highlight:function(text,grammar,language){var tokens=_.tokenize(text,grammar);return Token.stringify(_.util.encode(tokens),language)},tokenize:function(text,grammar,language){var Token=_.Token,strarr=[text],rest=grammar.rest;if(rest){for(var token in rest)grammar[token]=rest[token];delete grammar.rest}tokenloop:for(var token in grammar)if(grammar.hasOwnProperty(token)&&grammar[token]){var patterns=grammar[token];patterns="Array"===_.util.type(patterns)?patterns:[patterns];for(var j=0;j<patterns.length;++j){var pattern=patterns[j],inside=pattern.inside,lookbehind=!!pattern.lookbehind,greedy=!!pattern.greedy,lookbehindLength=0,alias=pattern.alias;if(greedy&&!pattern.pattern.global){var flags=pattern.pattern.toString().match(/[imuy]*$/)[0];pattern.pattern=RegExp(pattern.pattern.source,flags+"g")}pattern=pattern.pattern||pattern;for(var i=0,pos=0;i<strarr.length;pos+=strarr[i].length,++i){var str=strarr[i];if(strarr.length>text.length)break tokenloop;if(!(str instanceof Token)){pattern.lastIndex=0;var match=pattern.exec(str),delNum=1;if(!match&&greedy&&i!=strarr.length-1){if(pattern.lastIndex=pos,!(match=pattern.exec(text)))break;for(var from=match.index+(lookbehind?match[1].length:0),to=match.index+match[0].length,k=i,p=pos,len=strarr.length;k<len&&p<to;++k)p+=strarr[k].length,from>=p&&(++i,pos=p);if(strarr[i]instanceof Token||strarr[k-1].greedy)continue;delNum=k-i,str=text.slice(pos,p),match.index-=pos}if(match){lookbehind&&(lookbehindLength=match[1].length);var from=match.index+lookbehindLength,match=match[0].slice(lookbehindLength),to=from+match.length,before=str.slice(0,from),after=str.slice(to),args=[i,delNum];before&&args.push(before);var wrapped=new Token(token,inside?_.tokenize(match,inside):match,alias,match,greedy);args.push(wrapped),after&&args.push(after),Array.prototype.splice.apply(strarr,args)}}}}}return strarr},hooks:{all:{},add:function(name,callback){var hooks=_.hooks.all;hooks[name]=hooks[name]||[],hooks[name].push(callback)},run:function(name,env){var callbacks=_.hooks.all[name];if(callbacks&&callbacks.length)for(var callback,i=0;callback=callbacks[i++];)callback(env)}}},Token=_.Token=function(type,content,alias,matchedStr,greedy){this.type=type,this.content=content,this.alias=alias,this.length=0|(matchedStr||"").length,this.greedy=!!greedy};if(Token.stringify=function(o,language,parent){if("string"==typeof o)return o;if("Array"===_.util.type(o))return o.map(function(element){return Token.stringify(element,language,o)}).join("");var env={type:o.type,content:Token.stringify(o.content,language,parent),tag:"span",classes:["token",o.type],attributes:{},language:language,parent:parent};if("comment"==env.type&&(env.attributes.spellcheck="true"),o.alias){var aliases="Array"===_.util.type(o.alias)?o.alias:[o.alias];Array.prototype.push.apply(env.classes,aliases)}_.hooks.run("wrap",env);var attributes=Object.keys(env.attributes).map(function(name){return name+'="'+(env.attributes[name]||"").replace(/"/g,"&quot;")+'"'}).join(" ");return"<"+env.tag+' class="'+env.classes.join(" ")+'"'+(attributes?" "+attributes:"")+">"+env.content+"</"+env.tag+">"},!_self.document)return _self.addEventListener?(_self.addEventListener("message",function(evt){var message=JSON.parse(evt.data),lang=message.language,code=message.code,immediateClose=message.immediateClose;_self.postMessage(_.highlight(code,_.languages[lang],lang)),immediateClose&&_self.close()},!1),_self.Prism):_self.Prism;var script=document.currentScript||[].slice.call(document.getElementsByTagName("script")).pop();return script&&(_.filename=script.src,document.addEventListener&&!script.hasAttribute("data-manual")&&("loading"!==document.readyState?window.requestAnimationFrame?window.requestAnimationFrame(_.highlightAll):window.setTimeout(_.highlightAll,16):document.addEventListener("DOMContentLoaded",_.highlightAll))),_self.Prism}();void 0!==module&&module.exports&&(module.exports=Prism),void 0!==global&&(global.Prism=Prism),Prism.languages.markup={comment:/<!--[\w\W]*?-->/,prolog:/<\?[\w\W]+?\?>/,doctype:/<!DOCTYPE[\w\W]+?>/i,cdata:/<!\[CDATA\[[\w\W]*?]]>/i,tag:{pattern:/<\/?(?!\d)[^\s>\/=$<]+(?:\s+[^\s>\/=]+(?:=(?:("|')(?:\\\1|\\?(?!\1)[\w\W])*\1|[^\s'">=]+))?)*\s*\/?>/i,inside:{tag:{pattern:/^<\/?[^\s>\/]+/i,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"attr-value":{pattern:/=(?:('|")[\w\W]*?(\1)|[^\s>]+)/i,inside:{punctuation:/[=>"']/}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:/&#?[\da-z]{1,8};/i},Prism.hooks.add("wrap",function(env){"entity"===env.type&&(env.attributes.title=env.content.replace(/&amp;/,"&"))}),Prism.languages.xml=Prism.languages.markup,Prism.languages.html=Prism.languages.markup,Prism.languages.mathml=Prism.languages.markup,Prism.languages.svg=Prism.languages.markup,Prism.languages.css={comment:/\/\*[\w\W]*?\*\//,atrule:{pattern:/@[\w-]+?.*?(;|(?=\s*\{))/i,inside:{rule:/@[\w-]+/}},url:/url\((?:(["'])(\\(?:\r\n|[\w\W])|(?!\1)[^\\\r\n])*\1|.*?)\)/i,selector:/[^\{\}\s][^\{\};]*?(?=\s*\{)/,string:{pattern:/("|')(\\(?:\r\n|[\w\W])|(?!\1)[^\\\r\n])*\1/,greedy:!0},property:/(\b|\B)[\w-]+(?=\s*:)/i,important:/\B!important\b/i,function:/[-a-z0-9]+(?=\()/i,punctuation:/[(){};:]/},Prism.languages.css.atrule.inside.rest=Prism.util.clone(Prism.languages.css),Prism.languages.markup&&(Prism.languages.insertBefore("markup","tag",{style:{pattern:/(<style[\w\W]*?>)[\w\W]*?(?=<\/style>)/i,lookbehind:!0,inside:Prism.languages.css,alias:"language-css"}}),Prism.languages.insertBefore("inside","attr-value",{"style-attr":{pattern:/\s*style=("|').*?\1/i,inside:{"attr-name":{pattern:/^\s*style/i,inside:Prism.languages.markup.tag.inside},punctuation:/^\s*=\s*['"]|['"]\s*$/,"attr-value":{pattern:/.+/i,inside:Prism.languages.css}},alias:"language-css"}},Prism.languages.markup.tag)),Prism.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\w\W]*?\*\//,lookbehind:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0}],string:{pattern:/(["'])(\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/((?:\b(?:class|interface|extends|implements|trait|instanceof|new)\s+)|(?:catch\s+\())[a-z0-9_\.\\]+/i,lookbehind:!0,inside:{punctuation:/(\.|\\)/}},keyword:/\b(if|else|while|do|for|return|in|instanceof|function|new|try|throw|catch|finally|null|break|continue)\b/,boolean:/\b(true|false)\b/,function:/[a-z0-9_]+(?=\()/i,number:/\b-?(?:0x[\da-f]+|\d*\.?\d+(?:e[+-]?\d+)?)\b/i,operator:/--?|\+\+?|!=?=?|<=?|>=?|==?=?|&&?|\|\|?|\?|\*|\/|~|\^|%/,punctuation:/[{}[\];(),.:]/},Prism.languages.javascript=Prism.languages.extend("clike",{keyword:/\b(as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|var|void|while|with|yield)\b/,number:/\b-?(0x[\dA-Fa-f]+|0b[01]+|0o[0-7]+|\d*\.?\d+([Ee][+-]?\d+)?|NaN|Infinity)\b/,function:/[_$a-zA-Z\xA0-\uFFFF][_$a-zA-Z0-9\xA0-\uFFFF]*(?=\()/i,operator:/--?|\+\+?|!=?=?|<=?|>=?|==?=?|&&?|\|\|?|\?|\*\*?|\/|~|\^|%|\.{3}/}),Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:/(^|[^\/])\/(?!\/)(\[.+?]|\\.|[^\/\\\r\n])+\/[gimyu]{0,5}(?=\s*($|[\r\n,.;})]))/,lookbehind:!0,greedy:!0}}),Prism.languages.insertBefore("javascript","string",{"template-string":{pattern:/`(?:\\\\|\\?[^\\])*?`/,greedy:!0,inside:{interpolation:{pattern:/\$\{[^}]+\}/,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}}}),Prism.languages.markup&&Prism.languages.insertBefore("markup","tag",{script:{pattern:/(<script[\w\W]*?>)[\w\W]*?(?=<\/script>)/i,lookbehind:!0,inside:Prism.languages.javascript,alias:"language-javascript"}}),Prism.languages.js=Prism.languages.javascript,function(){"undefined"!=typeof self&&self.Prism&&self.document&&document.querySelector&&(self.Prism.fileHighlight=function(){var Extensions={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"};Array.prototype.forEach&&Array.prototype.slice.call(document.querySelectorAll("pre[data-src]")).forEach(function(pre){for(var language,src=pre.getAttribute("data-src"),parent=pre,lang=/\blang(?:uage)?-(?!\*)(\w+)\b/i;parent&&!lang.test(parent.className);)parent=parent.parentNode;if(parent&&(language=(pre.className.match(lang)||[,""])[1]),!language){var extension=(src.match(/\.(\w+)$/)||[,""])[1];language=Extensions[extension]||extension}var code=document.createElement("code");code.className="language-"+language,pre.textContent="",code.textContent="Loading…",pre.appendChild(code);var xhr=new XMLHttpRequest;xhr.open("GET",src,!0),xhr.onreadystatechange=function(){4==xhr.readyState&&(xhr.status<400&&xhr.responseText?(code.textContent=xhr.responseText,Prism.highlightElement(code)):xhr.status>=400?code.textContent="✖ Error "+xhr.status+" while fetching file: "+xhr.statusText:code.textContent="✖ Error: File does not exist or is empty")},xhr.send(null)})},document.addEventListener("DOMContentLoaded",self.Prism.fileHighlight))}()}).call(exports,__webpack_require__(46))},function(module,exports,__webpack_require__){"use strict";var factory=__webpack_require__(101);module.exports=function(isValidElement){return factory(isValidElement,!1)}},function(module,exports,__webpack_require__){"use strict";(function(process){var emptyFunction=__webpack_require__(12),invariant=__webpack_require__(1),warning=__webpack_require__(2),ReactPropTypesSecret=__webpack_require__(53),checkPropTypes=__webpack_require__(225);module.exports=function(isValidElement,throwOnDirectAccess){function getIteratorFn(maybeIterable){var iteratorFn=maybeIterable&&(ITERATOR_SYMBOL&&maybeIterable[ITERATOR_SYMBOL]||maybeIterable[FAUX_ITERATOR_SYMBOL]);if("function"==typeof iteratorFn)return iteratorFn}function is(x,y){return x===y?0!==x||1/x==1/y:x!==x&&y!==y}function PropTypeError(message){this.message=message,this.stack=""}function createChainableTypeChecker(validate){function checkType(isRequired,props,propName,componentName,location,propFullName,secret){if(componentName=componentName||ANONYMOUS,propFullName=propFullName||propName,secret!==ReactPropTypesSecret)if(throwOnDirectAccess)invariant(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types");else if("production"!==process.env.NODE_ENV&&"undefined"!=typeof console){var cacheKey=componentName+":"+propName;!manualPropTypeCallCache[cacheKey]&&manualPropTypeWarningCount<3&&(warning(!1,"You are manually calling a React.PropTypes validation function for the `%s` prop on `%s`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details.",propFullName,componentName),manualPropTypeCallCache[cacheKey]=!0,manualPropTypeWarningCount++)}return null==props[propName]?isRequired?new PropTypeError(null===props[propName]?"The "+location+" `"+propFullName+"` is marked as required in `"+componentName+"`, but its value is `null`.":"The "+location+" `"+propFullName+"` is marked as required in `"+componentName+"`, but its value is `undefined`."):null:validate(props,propName,componentName,location,propFullName)}if("production"!==process.env.NODE_ENV)var manualPropTypeCallCache={},manualPropTypeWarningCount=0;var chainedCheckType=checkType.bind(null,!1);return chainedCheckType.isRequired=checkType.bind(null,!0),chainedCheckType}function createPrimitiveTypeChecker(expectedType){function validate(props,propName,componentName,location,propFullName,secret){var propValue=props[propName];if(getPropType(propValue)!==expectedType)return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getPreciseType(propValue)+"` supplied to `"+componentName+"`, expected `"+expectedType+"`.");return null}return createChainableTypeChecker(validate)}function createArrayOfTypeChecker(typeChecker){function validate(props,propName,componentName,location,propFullName){if("function"!=typeof typeChecker)return new PropTypeError("Property `"+propFullName+"` of component `"+componentName+"` has invalid PropType notation inside arrayOf.");var propValue=props[propName];if(!Array.isArray(propValue)){return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getPropType(propValue)+"` supplied to `"+componentName+"`, expected an array.")}for(var i=0;i<propValue.length;i++){var error=typeChecker(propValue,i,componentName,location,propFullName+"["+i+"]",ReactPropTypesSecret);if(error instanceof Error)return error}return null}return createChainableTypeChecker(validate)}function createInstanceTypeChecker(expectedClass){function validate(props,propName,componentName,location,propFullName){if(!(props[propName]instanceof expectedClass)){var expectedClassName=expectedClass.name||ANONYMOUS;return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getClassName(props[propName])+"` supplied to `"+componentName+"`, expected instance of `"+expectedClassName+"`.")}return null}return createChainableTypeChecker(validate)}function createEnumTypeChecker(expectedValues){function validate(props,propName,componentName,location,propFullName){for(var propValue=props[propName],i=0;i<expectedValues.length;i++)if(is(propValue,expectedValues[i]))return null;return new PropTypeError("Invalid "+location+" `"+propFullName+"` of value `"+propValue+"` supplied to `"+componentName+"`, expected one of "+JSON.stringify(expectedValues)+".")}return Array.isArray(expectedValues)?createChainableTypeChecker(validate):("production"!==process.env.NODE_ENV&&warning(!1,"Invalid argument supplied to oneOf, expected an instance of array."),emptyFunction.thatReturnsNull)}function createObjectOfTypeChecker(typeChecker){function validate(props,propName,componentName,location,propFullName){if("function"!=typeof typeChecker)return new PropTypeError("Property `"+propFullName+"` of component `"+componentName+"` has invalid PropType notation inside objectOf.");var propValue=props[propName],propType=getPropType(propValue);if("object"!==propType)return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+propType+"` supplied to `"+componentName+"`, expected an object.");for(var key in propValue)if(propValue.hasOwnProperty(key)){var error=typeChecker(propValue,key,componentName,location,propFullName+"."+key,ReactPropTypesSecret);if(error instanceof Error)return error}return null}return createChainableTypeChecker(validate)}function createUnionTypeChecker(arrayOfTypeCheckers){function validate(props,propName,componentName,location,propFullName){for(var i=0;i<arrayOfTypeCheckers.length;i++){if(null==(0,arrayOfTypeCheckers[i])(props,propName,componentName,location,propFullName,ReactPropTypesSecret))return null}return new PropTypeError("Invalid "+location+" `"+propFullName+"` supplied to `"+componentName+"`.")}if(!Array.isArray(arrayOfTypeCheckers))return"production"!==process.env.NODE_ENV&&warning(!1,"Invalid argument supplied to oneOfType, expected an instance of array."),emptyFunction.thatReturnsNull;for(var i=0;i<arrayOfTypeCheckers.length;i++){var checker=arrayOfTypeCheckers[i];if("function"!=typeof checker)return warning(!1,"Invalid argument supplid to oneOfType. Expected an array of check functions, but received %s at index %s.",getPostfixForTypeWarning(checker),i),emptyFunction.thatReturnsNull}return createChainableTypeChecker(validate)}function createShapeTypeChecker(shapeTypes){function validate(props,propName,componentName,location,propFullName){var propValue=props[propName],propType=getPropType(propValue);if("object"!==propType)return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+propType+"` supplied to `"+componentName+"`, expected `object`.");for(var key in shapeTypes){var checker=shapeTypes[key];if(checker){var error=checker(propValue,key,componentName,location,propFullName+"."+key,ReactPropTypesSecret);if(error)return error}}return null}return createChainableTypeChecker(validate)}function isNode(propValue){switch(typeof propValue){case"number":case"string":case"undefined":return!0;case"boolean":return!propValue;case"object":if(Array.isArray(propValue))return propValue.every(isNode);if(null===propValue||isValidElement(propValue))return!0;var iteratorFn=getIteratorFn(propValue);if(!iteratorFn)return!1;var step,iterator=iteratorFn.call(propValue);if(iteratorFn!==propValue.entries){for(;!(step=iterator.next()).done;)if(!isNode(step.value))return!1}else for(;!(step=iterator.next()).done;){var entry=step.value;if(entry&&!isNode(entry[1]))return!1}return!0;default:return!1}}function isSymbol(propType,propValue){return"symbol"===propType||("Symbol"===propValue["@@toStringTag"]||"function"==typeof Symbol&&propValue instanceof Symbol)}function getPropType(propValue){var propType=typeof propValue;return Array.isArray(propValue)?"array":propValue instanceof RegExp?"object":isSymbol(propType,propValue)?"symbol":propType}function getPreciseType(propValue){if(void 0===propValue||null===propValue)return""+propValue;var propType=getPropType(propValue);if("object"===propType){if(propValue instanceof Date)return"date";if(propValue instanceof RegExp)return"regexp"}return propType}function getPostfixForTypeWarning(value){var type=getPreciseType(value);switch(type){case"array":case"object":return"an "+type;case"boolean":case"date":case"regexp":return"a "+type;default:return type}}function getClassName(propValue){return propValue.constructor&&propValue.constructor.name?propValue.constructor.name:ANONYMOUS}var ITERATOR_SYMBOL="function"==typeof Symbol&&Symbol.iterator,FAUX_ITERATOR_SYMBOL="@@iterator",ANONYMOUS="<<anonymous>>",ReactPropTypes={array:createPrimitiveTypeChecker("array"),bool:createPrimitiveTypeChecker("boolean"),func:createPrimitiveTypeChecker("function"),number:createPrimitiveTypeChecker("number"),object:createPrimitiveTypeChecker("object"),string:createPrimitiveTypeChecker("string"),symbol:createPrimitiveTypeChecker("symbol"),any:function(){return createChainableTypeChecker(emptyFunction.thatReturnsNull)}(),arrayOf:createArrayOfTypeChecker,element:function(){function validate(props,propName,componentName,location,propFullName){var propValue=props[propName];if(!isValidElement(propValue)){return new PropTypeError("Invalid "+location+" `"+propFullName+"` of type `"+getPropType(propValue)+"` supplied to `"+componentName+"`, expected a single ReactElement.")}return null}return createChainableTypeChecker(validate)}(),instanceOf:createInstanceTypeChecker,node:function(){function validate(props,propName,componentName,location,propFullName){return isNode(props[propName])?null:new PropTypeError("Invalid "+location+" `"+propFullName+"` supplied to `"+componentName+"`, expected a ReactNode.")}return createChainableTypeChecker(validate)}(),objectOf:createObjectOfTypeChecker,oneOf:createEnumTypeChecker,oneOfType:createUnionTypeChecker,shape:createShapeTypeChecker};return PropTypeError.prototype=Error.prototype,ReactPropTypes.checkPropTypes=checkPropTypes,ReactPropTypes.PropTypes=ReactPropTypes,ReactPropTypes}}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function prefixKey(prefix,key){return prefix+key.charAt(0).toUpperCase()+key.substring(1)}var isUnitlessNumber={animationIterationCount:!0,borderImageOutset:!0,borderImageSlice:!0,borderImageWidth:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,gridRow:!0,gridRowEnd:!0,gridRowSpan:!0,gridRowStart:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnSpan:!0,gridColumnStart:!0,fontWeight:!0,lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0,zoom:!0,fillOpacity:!0,floodOpacity:!0,stopOpacity:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0},prefixes=["Webkit","ms","Moz","O"];Object.keys(isUnitlessNumber).forEach(function(prop){prefixes.forEach(function(prefix){isUnitlessNumber[prefixKey(prefix,prop)]=isUnitlessNumber[prop]})});var shorthandPropertyExpansions={background:{backgroundAttachment:!0,backgroundColor:!0,backgroundImage:!0,backgroundPositionX:!0,backgroundPositionY:!0,backgroundRepeat:!0},backgroundPosition:{backgroundPositionX:!0,backgroundPositionY:!0},border:{borderWidth:!0,borderStyle:!0,borderColor:!0},borderBottom:{borderBottomWidth:!0,borderBottomStyle:!0,borderBottomColor:!0},borderLeft:{borderLeftWidth:!0,borderLeftStyle:!0,borderLeftColor:!0},borderRight:{borderRightWidth:!0,borderRightStyle:!0,borderRightColor:!0},borderTop:{borderTopWidth:!0,borderTopStyle:!0,borderTopColor:!0},font:{fontStyle:!0,fontVariant:!0,fontWeight:!0,fontSize:!0,lineHeight:!0,fontFamily:!0},outline:{outlineWidth:!0,outlineStyle:!0,outlineColor:!0}},CSSProperty={isUnitlessNumber:isUnitlessNumber,shorthandPropertyExpansions:shorthandPropertyExpansions};module.exports=CSSProperty},function(module,exports,__webpack_require__){"use strict";(function(process){function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}var _prodInvariant=__webpack_require__(4),PooledClass=__webpack_require__(23),invariant=__webpack_require__(1),CallbackQueue=function(){function CallbackQueue(arg){_classCallCheck(this,CallbackQueue),this._callbacks=null,this._contexts=null,this._arg=arg}return CallbackQueue.prototype.enqueue=function(callback,context){this._callbacks=this._callbacks||[],this._callbacks.push(callback),this._contexts=this._contexts||[],this._contexts.push(context)},CallbackQueue.prototype.notifyAll=function(){var callbacks=this._callbacks,contexts=this._contexts,arg=this._arg;if(callbacks&&contexts){callbacks.length!==contexts.length&&("production"!==process.env.NODE_ENV?invariant(!1,"Mismatched list of contexts in callback queue"):_prodInvariant("24")),this._callbacks=null,this._contexts=null;for(var i=0;i<callbacks.length;i++)callbacks[i].call(contexts[i],arg);callbacks.length=0,contexts.length=0}},CallbackQueue.prototype.checkpoint=function(){return this._callbacks?this._callbacks.length:0},CallbackQueue.prototype.rollback=function(len){this._callbacks&&this._contexts&&(this._callbacks.length=len,this._contexts.length=len)},CallbackQueue.prototype.reset=function(){this._callbacks=null,this._contexts=null},CallbackQueue.prototype.destructor=function(){this.reset()},CallbackQueue}();module.exports=PooledClass.addPoolingTo(CallbackQueue)}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function isAttributeNameSafe(attributeName){return!!validatedAttributeNameCache.hasOwnProperty(attributeName)||!illegalAttributeNameCache.hasOwnProperty(attributeName)&&(VALID_ATTRIBUTE_NAME_REGEX.test(attributeName)?(validatedAttributeNameCache[attributeName]=!0,!0):(illegalAttributeNameCache[attributeName]=!0,"production"!==process.env.NODE_ENV&&warning(!1,"Invalid attribute name: `%s`",attributeName),!1))}function shouldIgnoreValue(propertyInfo,value){return null==value||propertyInfo.hasBooleanValue&&!value||propertyInfo.hasNumericValue&&isNaN(value)||propertyInfo.hasPositiveNumericValue&&value<1||propertyInfo.hasOverloadedBooleanValue&&!1===value}var DOMProperty=__webpack_require__(21),ReactDOMComponentTree=__webpack_require__(8),ReactInstrumentation=__webpack_require__(14),quoteAttributeValueForBrowser=__webpack_require__(296),warning=__webpack_require__(2),VALID_ATTRIBUTE_NAME_REGEX=new RegExp("^["+DOMProperty.ATTRIBUTE_NAME_START_CHAR+"]["+DOMProperty.ATTRIBUTE_NAME_CHAR+"]*$"),illegalAttributeNameCache={},validatedAttributeNameCache={},DOMPropertyOperations={createMarkupForID:function(id){return DOMProperty.ID_ATTRIBUTE_NAME+"="+quoteAttributeValueForBrowser(id)},setAttributeForID:function(node,id){node.setAttribute(DOMProperty.ID_ATTRIBUTE_NAME,id)},createMarkupForRoot:function(){return DOMProperty.ROOT_ATTRIBUTE_NAME+'=""'},setAttributeForRoot:function(node){node.setAttribute(DOMProperty.ROOT_ATTRIBUTE_NAME,"")},createMarkupForProperty:function(name,value){var propertyInfo=DOMProperty.properties.hasOwnProperty(name)?DOMProperty.properties[name]:null;if(propertyInfo){if(shouldIgnoreValue(propertyInfo,value))return"";var attributeName=propertyInfo.attributeName;return propertyInfo.hasBooleanValue||propertyInfo.hasOverloadedBooleanValue&&!0===value?attributeName+'=""':attributeName+"="+quoteAttributeValueForBrowser(value)}return DOMProperty.isCustomAttribute(name)?null==value?"":name+"="+quoteAttributeValueForBrowser(value):null},createMarkupForCustomAttribute:function(name,value){return isAttributeNameSafe(name)&&null!=value?name+"="+quoteAttributeValueForBrowser(value):""},setValueForProperty:function(node,name,value){var propertyInfo=DOMProperty.properties.hasOwnProperty(name)?DOMProperty.properties[name]:null;if(propertyInfo){var mutationMethod=propertyInfo.mutationMethod;if(mutationMethod)mutationMethod(node,value);else{if(shouldIgnoreValue(propertyInfo,value))return void this.deleteValueForProperty(node,name);if(propertyInfo.mustUseProperty)node[propertyInfo.propertyName]=value;else{var attributeName=propertyInfo.attributeName,namespace=propertyInfo.attributeNamespace;namespace?node.setAttributeNS(namespace,attributeName,""+value):propertyInfo.hasBooleanValue||propertyInfo.hasOverloadedBooleanValue&&!0===value?node.setAttribute(attributeName,""):node.setAttribute(attributeName,""+value)}}}else if(DOMProperty.isCustomAttribute(name))return void DOMPropertyOperations.setValueForAttribute(node,name,value);if("production"!==process.env.NODE_ENV){var payload={};payload[name]=value,ReactInstrumentation.debugTool.onHostOperation({instanceID:ReactDOMComponentTree.getInstanceFromNode(node)._debugID,type:"update attribute",payload:payload})}},setValueForAttribute:function(node,name,value){if(isAttributeNameSafe(name)&&(null==value?node.removeAttribute(name):node.setAttribute(name,""+value),"production"!==process.env.NODE_ENV)){var payload={};payload[name]=value,ReactInstrumentation.debugTool.onHostOperation({instanceID:ReactDOMComponentTree.getInstanceFromNode(node)._debugID,type:"update attribute",payload:payload})}},deleteValueForAttribute:function(node,name){node.removeAttribute(name),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:ReactDOMComponentTree.getInstanceFromNode(node)._debugID,type:"remove attribute",payload:name})},deleteValueForProperty:function(node,name){var propertyInfo=DOMProperty.properties.hasOwnProperty(name)?DOMProperty.properties[name]:null;if(propertyInfo){var mutationMethod=propertyInfo.mutationMethod;if(mutationMethod)mutationMethod(node,void 0);else if(propertyInfo.mustUseProperty){var propName=propertyInfo.propertyName;propertyInfo.hasBooleanValue?node[propName]=!1:node[propName]=""}else node.removeAttribute(propertyInfo.attributeName)}else DOMProperty.isCustomAttribute(name)&&node.removeAttribute(name);"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:ReactDOMComponentTree.getInstanceFromNode(node)._debugID,type:"remove attribute",payload:name})}};module.exports=DOMPropertyOperations}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var ReactDOMComponentFlags={hasCachedChildNodes:1};module.exports=ReactDOMComponentFlags},function(module,exports,__webpack_require__){"use strict";(function(process){function updateOptionsIfPendingUpdateAndMounted(){if(this._rootNodeID&&this._wrapperState.pendingUpdate){this._wrapperState.pendingUpdate=!1;var props=this._currentElement.props,value=LinkedValueUtils.getValue(props);null!=value&&updateOptions(this,Boolean(props.multiple),value)}}function getDeclarationErrorAddendum(owner){if(owner){var name=owner.getName();if(name)return" Check the render method of `"+name+"`."}return""}function checkSelectPropTypes(inst,props){var owner=inst._currentElement._owner;LinkedValueUtils.checkPropTypes("select",props,owner),void 0===props.valueLink||didWarnValueLink||("production"!==process.env.NODE_ENV&&warning(!1,"`valueLink` prop on `select` is deprecated; set `value` and `onChange` instead."),didWarnValueLink=!0);for(var i=0;i<valuePropNames.length;i++){var propName=valuePropNames[i];if(null!=props[propName]){var isArray=Array.isArray(props[propName]);props.multiple&&!isArray?"production"!==process.env.NODE_ENV&&warning(!1,"The `%s` prop supplied to <select> must be an array if `multiple` is true.%s",propName,getDeclarationErrorAddendum(owner)):!props.multiple&&isArray&&"production"!==process.env.NODE_ENV&&warning(!1,"The `%s` prop supplied to <select> must be a scalar value if `multiple` is false.%s",propName,getDeclarationErrorAddendum(owner))}}}function updateOptions(inst,multiple,propValue){var selectedValue,i,options=ReactDOMComponentTree.getNodeFromInstance(inst).options;if(multiple){for(selectedValue={},i=0;i<propValue.length;i++)selectedValue[""+propValue[i]]=!0;for(i=0;i<options.length;i++){var selected=selectedValue.hasOwnProperty(options[i].value);options[i].selected!==selected&&(options[i].selected=selected)}}else{for(selectedValue=""+propValue,i=0;i<options.length;i++)if(options[i].value===selectedValue)return void(options[i].selected=!0);options.length&&(options[0].selected=!0)}}function _handleChange(event){var props=this._currentElement.props,returnValue=LinkedValueUtils.executeOnChange(props,event);return this._rootNodeID&&(this._wrapperState.pendingUpdate=!0),ReactUpdates.asap(updateOptionsIfPendingUpdateAndMounted,this),returnValue}var _assign=__webpack_require__(7),LinkedValueUtils=__webpack_require__(58),ReactDOMComponentTree=__webpack_require__(8),ReactUpdates=__webpack_require__(17),warning=__webpack_require__(2),didWarnValueLink=!1,didWarnValueDefaultValue=!1,valuePropNames=["value","defaultValue"],ReactDOMSelect={getHostProps:function(inst,props){return _assign({},props,{onChange:inst._wrapperState.onChange,value:void 0})},mountWrapper:function(inst,props){"production"!==process.env.NODE_ENV&&checkSelectPropTypes(inst,props);var value=LinkedValueUtils.getValue(props);inst._wrapperState={pendingUpdate:!1,initialValue:null!=value?value:props.defaultValue,listeners:null,onChange:_handleChange.bind(inst),wasMultiple:Boolean(props.multiple)},void 0===props.value||void 0===props.defaultValue||didWarnValueDefaultValue||("production"!==process.env.NODE_ENV&&warning(!1,"Select elements must be either controlled or uncontrolled (specify either the value prop, or the defaultValue prop, but not both). Decide between using a controlled or uncontrolled select element and remove one of these props. More info: https://fb.me/react-controlled-components"),didWarnValueDefaultValue=!0)},getSelectValueContext:function(inst){return inst._wrapperState.initialValue},postUpdateWrapper:function(inst){var props=inst._currentElement.props;inst._wrapperState.initialValue=void 0;var wasMultiple=inst._wrapperState.wasMultiple;inst._wrapperState.wasMultiple=Boolean(props.multiple);var value=LinkedValueUtils.getValue(props);null!=value?(inst._wrapperState.pendingUpdate=!1,updateOptions(inst,Boolean(props.multiple),value)):wasMultiple!==Boolean(props.multiple)&&(null!=props.defaultValue?updateOptions(inst,Boolean(props.multiple),props.defaultValue):updateOptions(inst,Boolean(props.multiple),props.multiple?[]:""))}};module.exports=ReactDOMSelect}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var emptyComponentFactory,ReactEmptyComponentInjection={injectEmptyComponentFactory:function(factory){emptyComponentFactory=factory}},ReactEmptyComponent={create:function(instantiate){return emptyComponentFactory(instantiate)}};ReactEmptyComponent.injection=ReactEmptyComponentInjection,module.exports=ReactEmptyComponent},function(module,exports,__webpack_require__){"use strict";var ReactFeatureFlags={logTopLevelRenders:!1};module.exports=ReactFeatureFlags},function(module,exports,__webpack_require__){"use strict";(function(process){function createInternalComponent(element){return genericComponentClass||("production"!==process.env.NODE_ENV?invariant(!1,"There is no registered component for the tag %s",element.type):_prodInvariant("111",element.type)),new genericComponentClass(element)}function createInstanceForText(text){return new textComponentClass(text)}function isTextComponent(component){return component instanceof textComponentClass}var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),genericComponentClass=null,textComponentClass=null,ReactHostComponentInjection={injectGenericComponentClass:function(componentClass){genericComponentClass=componentClass},injectTextComponentClass:function(componentClass){textComponentClass=componentClass}},ReactHostComponent={createInternalComponent:createInternalComponent,createInstanceForText:createInstanceForText,isTextComponent:isTextComponent,injection:ReactHostComponentInjection};module.exports=ReactHostComponent}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function isInDocument(node){return containsNode(document.documentElement,node)}var ReactDOMSelection=__webpack_require__(251),containsNode=__webpack_require__(190),focusNode=__webpack_require__(94),getActiveElement=__webpack_require__(95),ReactInputSelection={hasSelectionCapabilities:function(elem){var nodeName=elem&&elem.nodeName&&elem.nodeName.toLowerCase();return nodeName&&("input"===nodeName&&"text"===elem.type||"textarea"===nodeName||"true"===elem.contentEditable)},getSelectionInformation:function(){var focusedElem=getActiveElement();return{focusedElem:focusedElem,selectionRange:ReactInputSelection.hasSelectionCapabilities(focusedElem)?ReactInputSelection.getSelection(focusedElem):null}},restoreSelection:function(priorSelectionInformation){var curFocusedElem=getActiveElement(),priorFocusedElem=priorSelectionInformation.focusedElem,priorSelectionRange=priorSelectionInformation.selectionRange;curFocusedElem!==priorFocusedElem&&isInDocument(priorFocusedElem)&&(ReactInputSelection.hasSelectionCapabilities(priorFocusedElem)&&ReactInputSelection.setSelection(priorFocusedElem,priorSelectionRange),focusNode(priorFocusedElem))},getSelection:function(input){var selection;if("selectionStart"in input)selection={start:input.selectionStart,end:input.selectionEnd};else if(document.selection&&input.nodeName&&"input"===input.nodeName.toLowerCase()){var range=document.selection.createRange();range.parentElement()===input&&(selection={start:-range.moveStart("character",-input.value.length),end:-range.moveEnd("character",-input.value.length)})}else selection=ReactDOMSelection.getOffsets(input);return selection||{start:0,end:0}},setSelection:function(input,offsets){var start=offsets.start,end=offsets.end;if(void 0===end&&(end=start),"selectionStart"in input)input.selectionStart=start,input.selectionEnd=Math.min(end,input.value.length);else if(document.selection&&input.nodeName&&"input"===input.nodeName.toLowerCase()){var range=input.createTextRange();range.collapse(!0),range.moveStart("character",start),range.moveEnd("character",end-start),range.select()}else ReactDOMSelection.setOffsets(input,offsets)}};module.exports=ReactInputSelection},function(module,exports,__webpack_require__){"use strict";(function(process){function firstDifferenceIndex(string1,string2){for(var minLen=Math.min(string1.length,string2.length),i=0;i<minLen;i++)if(string1.charAt(i)!==string2.charAt(i))return i;return string1.length===string2.length?-1:minLen}function getReactRootElementInContainer(container){return container?container.nodeType===DOC_NODE_TYPE?container.documentElement:container.firstChild:null}function internalGetID(node){return node.getAttribute&&node.getAttribute(ATTR_NAME)||""}function mountComponentIntoNode(wrapperInstance,container,transaction,shouldReuseMarkup,context){if(ReactFeatureFlags.logTopLevelRenders){var wrappedElement=wrapperInstance._currentElement.props.child,type=wrappedElement.type;"React mount: "+("string"==typeof type?type:type.displayName||type.name)}var markup=ReactReconciler.mountComponent(wrapperInstance,transaction,null,ReactDOMContainerInfo(wrapperInstance,container),context,0);wrapperInstance._renderedComponent._topLevelWrapper=wrapperInstance,ReactMount._mountImageIntoNode(markup,container,wrapperInstance,shouldReuseMarkup,transaction)}function batchedMountComponentIntoNode(componentInstance,container,shouldReuseMarkup,context){var transaction=ReactUpdates.ReactReconcileTransaction.getPooled(!shouldReuseMarkup&&ReactDOMFeatureFlags.useCreateElement);transaction.perform(mountComponentIntoNode,null,componentInstance,container,transaction,shouldReuseMarkup,context),ReactUpdates.ReactReconcileTransaction.release(transaction)}function unmountComponentFromNode(instance,container,safely){for("production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onBeginFlush(),ReactReconciler.unmountComponent(instance,safely),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onEndFlush(),container.nodeType===DOC_NODE_TYPE&&(container=container.documentElement);container.lastChild;)container.removeChild(container.lastChild)}function hasNonRootReactChild(container){var rootEl=getReactRootElementInContainer(container);if(rootEl){var inst=ReactDOMComponentTree.getInstanceFromNode(rootEl);return!(!inst||!inst._hostParent)}}function nodeIsRenderedByOtherInstance(container){var rootEl=getReactRootElementInContainer(container);return!(!rootEl||!isReactNode(rootEl)||ReactDOMComponentTree.getInstanceFromNode(rootEl))}function isValidContainer(node){return!(!node||node.nodeType!==ELEMENT_NODE_TYPE&&node.nodeType!==DOC_NODE_TYPE&&node.nodeType!==DOCUMENT_FRAGMENT_NODE_TYPE)}function isReactNode(node){return isValidContainer(node)&&(node.hasAttribute(ROOT_ATTR_NAME)||node.hasAttribute(ATTR_NAME))}function getHostRootInstanceInContainer(container){var rootEl=getReactRootElementInContainer(container),prevHostInstance=rootEl&&ReactDOMComponentTree.getInstanceFromNode(rootEl);return prevHostInstance&&!prevHostInstance._hostParent?prevHostInstance:null}function getTopLevelWrapperInContainer(container){var root=getHostRootInstanceInContainer(container);return root?root._hostContainerInfo._topLevelWrapper:null}var _prodInvariant=__webpack_require__(4),DOMLazyTree=__webpack_require__(26),DOMProperty=__webpack_require__(21),React=__webpack_require__(28),ReactBrowserEventEmitter=__webpack_require__(40),ReactCurrentOwner=__webpack_require__(18),ReactDOMComponentTree=__webpack_require__(8),ReactDOMContainerInfo=__webpack_require__(243),ReactDOMFeatureFlags=__webpack_require__(245),ReactFeatureFlags=__webpack_require__(108),ReactInstanceMap=__webpack_require__(32),ReactInstrumentation=__webpack_require__(14),ReactMarkupChecksum=__webpack_require__(265),ReactReconciler=__webpack_require__(27),ReactUpdateQueue=__webpack_require__(61),ReactUpdates=__webpack_require__(17),emptyObject=__webpack_require__(38),instantiateReactComponent=__webpack_require__(120),invariant=__webpack_require__(1),setInnerHTML=__webpack_require__(44),shouldUpdateReactComponent=__webpack_require__(67),warning=__webpack_require__(2),ATTR_NAME=DOMProperty.ID_ATTRIBUTE_NAME,ROOT_ATTR_NAME=DOMProperty.ROOT_ATTRIBUTE_NAME,ELEMENT_NODE_TYPE=1,DOC_NODE_TYPE=9,DOCUMENT_FRAGMENT_NODE_TYPE=11,instancesByReactRootID={},topLevelRootCounter=1,TopLevelWrapper=function(){this.rootID=topLevelRootCounter++};TopLevelWrapper.prototype.isReactComponent={},"production"!==process.env.NODE_ENV&&(TopLevelWrapper.displayName="TopLevelWrapper"),TopLevelWrapper.prototype.render=function(){return this.props.child},TopLevelWrapper.isReactTopLevelWrapper=!0;var ReactMount={TopLevelWrapper:TopLevelWrapper,_instancesByReactRootID:instancesByReactRootID,scrollMonitor:function(container,renderCallback){renderCallback()},_updateRootComponent:function(prevComponent,nextElement,nextContext,container,callback){return ReactMount.scrollMonitor(container,function(){ReactUpdateQueue.enqueueElementInternal(prevComponent,nextElement,nextContext),callback&&ReactUpdateQueue.enqueueCallbackInternal(prevComponent,callback)}),prevComponent},_renderNewRootComponent:function(nextElement,container,shouldReuseMarkup,context){"production"!==process.env.NODE_ENV&&warning(null==ReactCurrentOwner.current,"_renderNewRootComponent(): Render methods should be a pure function of props and state; triggering nested component updates from render is not allowed. If necessary, trigger nested updates in componentDidUpdate. Check the render method of %s.",ReactCurrentOwner.current&&ReactCurrentOwner.current.getName()||"ReactCompositeComponent"),isValidContainer(container)||("production"!==process.env.NODE_ENV?invariant(!1,"_registerComponent(...): Target container is not a DOM element."):_prodInvariant("37")),ReactBrowserEventEmitter.ensureScrollValueMonitoring();var componentInstance=instantiateReactComponent(nextElement,!1);ReactUpdates.batchedUpdates(batchedMountComponentIntoNode,componentInstance,container,shouldReuseMarkup,context);var wrapperID=componentInstance._instance.rootID;return instancesByReactRootID[wrapperID]=componentInstance,componentInstance},renderSubtreeIntoContainer:function(parentComponent,nextElement,container,callback){return null!=parentComponent&&ReactInstanceMap.has(parentComponent)||("production"!==process.env.NODE_ENV?invariant(!1,"parentComponent must be a valid React Component"):_prodInvariant("38")),ReactMount._renderSubtreeIntoContainer(parentComponent,nextElement,container,callback)},_renderSubtreeIntoContainer:function(parentComponent,nextElement,container,callback){ReactUpdateQueue.validateCallback(callback,"ReactDOM.render"),React.isValidElement(nextElement)||("production"!==process.env.NODE_ENV?invariant(!1,"ReactDOM.render(): Invalid component element.%s","string"==typeof nextElement?" Instead of passing a string like 'div', pass React.createElement('div') or <div />.":"function"==typeof nextElement?" Instead of passing a class like Foo, pass React.createElement(Foo) or <Foo />.":null!=nextElement&&void 0!==nextElement.props?" This may be caused by unintentionally loading two independent copies of React.":""):_prodInvariant("39","string"==typeof nextElement?" Instead of passing a string like 'div', pass React.createElement('div') or <div />.":"function"==typeof nextElement?" Instead of passing a class like Foo, pass React.createElement(Foo) or <Foo />.":null!=nextElement&&void 0!==nextElement.props?" This may be caused by unintentionally loading two independent copies of React.":"")),"production"!==process.env.NODE_ENV&&warning(!container||!container.tagName||"BODY"!==container.tagName.toUpperCase(),"render(): Rendering components directly into document.body is discouraged, since its children are often manipulated by third-party scripts and browser extensions. This may lead to subtle reconciliation issues. Try rendering into a container element created for your app.");var nextContext,nextWrappedElement=React.createElement(TopLevelWrapper,{child:nextElement});if(parentComponent){var parentInst=ReactInstanceMap.get(parentComponent);nextContext=parentInst._processChildContext(parentInst._context)}else nextContext=emptyObject;var prevComponent=getTopLevelWrapperInContainer(container);if(prevComponent){var prevWrappedElement=prevComponent._currentElement,prevElement=prevWrappedElement.props.child;if(shouldUpdateReactComponent(prevElement,nextElement)){var publicInst=prevComponent._renderedComponent.getPublicInstance(),updatedCallback=callback&&function(){callback.call(publicInst)};return ReactMount._updateRootComponent(prevComponent,nextWrappedElement,nextContext,container,updatedCallback),publicInst}ReactMount.unmountComponentAtNode(container)}var reactRootElement=getReactRootElementInContainer(container),containerHasReactMarkup=reactRootElement&&!!internalGetID(reactRootElement),containerHasNonRootReactChild=hasNonRootReactChild(container);if("production"!==process.env.NODE_ENV&&("production"!==process.env.NODE_ENV&&warning(!containerHasNonRootReactChild,"render(...): Replacing React-rendered children with a new root component. If you intended to update the children of this node, you should instead have the existing children update their state and render the new components instead of calling ReactDOM.render."),!containerHasReactMarkup||reactRootElement.nextSibling))for(var rootElementSibling=reactRootElement;rootElementSibling;){if(internalGetID(rootElementSibling)){"production"!==process.env.NODE_ENV&&warning(!1,"render(): Target node has markup rendered by React, but there are unrelated nodes as well. This is most commonly caused by white-space inserted around server-rendered markup.");break}rootElementSibling=rootElementSibling.nextSibling}var shouldReuseMarkup=containerHasReactMarkup&&!prevComponent&&!containerHasNonRootReactChild,component=ReactMount._renderNewRootComponent(nextWrappedElement,container,shouldReuseMarkup,nextContext)._renderedComponent.getPublicInstance();return callback&&callback.call(component),component},render:function(nextElement,container,callback){return ReactMount._renderSubtreeIntoContainer(null,nextElement,container,callback)},unmountComponentAtNode:function(container){"production"!==process.env.NODE_ENV&&warning(null==ReactCurrentOwner.current,"unmountComponentAtNode(): Render methods should be a pure function of props and state; triggering nested component updates from render is not allowed. If necessary, trigger nested updates in componentDidUpdate. Check the render method of %s.",ReactCurrentOwner.current&&ReactCurrentOwner.current.getName()||"ReactCompositeComponent"),isValidContainer(container)||("production"!==process.env.NODE_ENV?invariant(!1,"unmountComponentAtNode(...): Target container is not a DOM element."):_prodInvariant("40")),"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(!nodeIsRenderedByOtherInstance(container),"unmountComponentAtNode(): The node you're attempting to unmount was rendered by another copy of React.");var prevComponent=getTopLevelWrapperInContainer(container);if(!prevComponent){var containerHasNonRootReactChild=hasNonRootReactChild(container),isContainerReactRoot=1===container.nodeType&&container.hasAttribute(ROOT_ATTR_NAME);return"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(!containerHasNonRootReactChild,"unmountComponentAtNode(): The node you're attempting to unmount was rendered by React and is not a top-level container. %s",isContainerReactRoot?"You may have accidentally passed in a React root node instead of its container.":"Instead, have the parent component update its state and rerender in order to remove this component."),!1}return delete instancesByReactRootID[prevComponent._instance.rootID],ReactUpdates.batchedUpdates(unmountComponentFromNode,prevComponent,container,!1),!0},_mountImageIntoNode:function(markup,container,instance,shouldReuseMarkup,transaction){if(isValidContainer(container)||("production"!==process.env.NODE_ENV?invariant(!1,"mountComponentIntoNode(...): Target container is not valid."):_prodInvariant("41")),shouldReuseMarkup){var rootElement=getReactRootElementInContainer(container);if(ReactMarkupChecksum.canReuseMarkup(markup,rootElement))return void ReactDOMComponentTree.precacheNode(instance,rootElement);var checksum=rootElement.getAttribute(ReactMarkupChecksum.CHECKSUM_ATTR_NAME);rootElement.removeAttribute(ReactMarkupChecksum.CHECKSUM_ATTR_NAME);var rootMarkup=rootElement.outerHTML;rootElement.setAttribute(ReactMarkupChecksum.CHECKSUM_ATTR_NAME,checksum);var normalizedMarkup=markup;if("production"!==process.env.NODE_ENV){var normalizer;container.nodeType===ELEMENT_NODE_TYPE?(normalizer=document.createElement("div"),normalizer.innerHTML=markup,normalizedMarkup=normalizer.innerHTML):(normalizer=document.createElement("iframe"),document.body.appendChild(normalizer),normalizer.contentDocument.write(markup),normalizedMarkup=normalizer.contentDocument.documentElement.outerHTML,document.body.removeChild(normalizer))}var diffIndex=firstDifferenceIndex(normalizedMarkup,rootMarkup),difference=" (client) "+normalizedMarkup.substring(diffIndex-20,diffIndex+20)+"\n (server) "+rootMarkup.substring(diffIndex-20,diffIndex+20);container.nodeType===DOC_NODE_TYPE&&("production"!==process.env.NODE_ENV?invariant(!1,"You're trying to render a component to the document using server rendering but the checksum was invalid. This usually means you rendered a different component type or props on the client from the one on the server, or your render() methods are impure. React cannot handle this case due to cross-browser quirks by rendering at the document root. You should look for environment dependent code in your components and ensure the props are the same client and server side:\n%s",difference):_prodInvariant("42",difference)),"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(!1,"React attempted to reuse markup in a container but the checksum was invalid. This generally means that you are using server rendering and the markup generated on the server was not what the client was expecting. React injected new markup to compensate which works but you have lost many of the benefits of server rendering. Instead, figure out why the markup being generated is different on the client or server:\n%s",difference)}if(container.nodeType===DOC_NODE_TYPE&&("production"!==process.env.NODE_ENV?invariant(!1,"You're trying to render a component to the document but you didn't use server rendering. We can't do this without using server rendering due to cross-browser quirks. See ReactDOMServer.renderToString() for server rendering."):_prodInvariant("43")),transaction.useCreateElement){for(;container.lastChild;)container.removeChild(container.lastChild);DOMLazyTree.insertTreeBefore(container,markup,null)}else setInnerHTML(container,markup),ReactDOMComponentTree.precacheNode(instance,container.firstChild);if("production"!==process.env.NODE_ENV){var hostNode=ReactDOMComponentTree.getInstanceFromNode(container.firstChild);0!==hostNode._debugID&&ReactInstrumentation.debugTool.onHostOperation({instanceID:hostNode._debugID,type:"mount",payload:markup.toString()})}}};module.exports=ReactMount}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(4),React=__webpack_require__(28),invariant=__webpack_require__(1),ReactNodeTypes={HOST:0,COMPOSITE:1,EMPTY:2,getType:function(node){return null===node||!1===node?ReactNodeTypes.EMPTY:React.isValidElement(node)?"function"==typeof node.type?ReactNodeTypes.COMPOSITE:ReactNodeTypes.HOST:void("production"!==process.env.NODE_ENV?invariant(!1,"Unexpected node: %s",node):_prodInvariant("26",node))}};module.exports=ReactNodeTypes}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";module.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(module,exports,__webpack_require__){"use strict";var ViewportMetrics={currentScrollLeft:0,currentScrollTop:0,refreshScrollValues:function(scrollPosition){ViewportMetrics.currentScrollLeft=scrollPosition.x,ViewportMetrics.currentScrollTop=scrollPosition.y}};module.exports=ViewportMetrics},function(module,exports,__webpack_require__){"use strict";(function(process){function accumulateInto(current,next){return null==next&&("production"!==process.env.NODE_ENV?invariant(!1,"accumulateInto(...): Accumulated items must not be null or undefined."):_prodInvariant("30")),null==current?next:Array.isArray(current)?Array.isArray(next)?(current.push.apply(current,next),current):(current.push(next),current):Array.isArray(next)?[current].concat(next):[current,next]}var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1);module.exports=accumulateInto}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function forEachAccumulated(arr,cb,scope){Array.isArray(arr)?arr.forEach(cb,scope):arr&&cb.call(scope,arr)}module.exports=forEachAccumulated},function(module,exports,__webpack_require__){"use strict";function getHostComponentFromComposite(inst){for(var type;(type=inst._renderedNodeType)===ReactNodeTypes.COMPOSITE;)inst=inst._renderedComponent;return type===ReactNodeTypes.HOST?inst._renderedComponent:type===ReactNodeTypes.EMPTY?null:void 0}var ReactNodeTypes=__webpack_require__(112);module.exports=getHostComponentFromComposite},function(module,exports,__webpack_require__){"use strict";function getTextContentAccessor(){return!contentKey&&ExecutionEnvironment.canUseDOM&&(contentKey="textContent"in document.documentElement?"textContent":"innerText"),contentKey}var ExecutionEnvironment=__webpack_require__(9),contentKey=null;module.exports=getTextContentAccessor},function(module,exports,__webpack_require__){"use strict";function isCheckable(elem){var type=elem.type,nodeName=elem.nodeName;return nodeName&&"input"===nodeName.toLowerCase()&&("checkbox"===type||"radio"===type)}function getTracker(inst){return inst._wrapperState.valueTracker}function attachTracker(inst,tracker){inst._wrapperState.valueTracker=tracker}function detachTracker(inst){delete inst._wrapperState.valueTracker}function getValueFromNode(node){var value;return node&&(value=isCheckable(node)?""+node.checked:node.value),value}var ReactDOMComponentTree=__webpack_require__(8),inputValueTracking={_getTrackerFromNode:function(node){return getTracker(ReactDOMComponentTree.getInstanceFromNode(node))},track:function(inst){if(!getTracker(inst)){var node=ReactDOMComponentTree.getNodeFromInstance(inst),valueField=isCheckable(node)?"checked":"value",descriptor=Object.getOwnPropertyDescriptor(node.constructor.prototype,valueField),currentValue=""+node[valueField];node.hasOwnProperty(valueField)||"function"!=typeof descriptor.get||"function"!=typeof descriptor.set||(Object.defineProperty(node,valueField,{enumerable:descriptor.enumerable,configurable:!0,get:function(){return descriptor.get.call(this)},set:function(value){currentValue=""+value,descriptor.set.call(this,value)}}),attachTracker(inst,{getValue:function(){return currentValue},setValue:function(value){currentValue=""+value},stopTracking:function(){detachTracker(inst),delete node[valueField]}}))}},updateValueIfChanged:function(inst){if(!inst)return!1;var tracker=getTracker(inst);if(!tracker)return inputValueTracking.track(inst),!0;var lastValue=tracker.getValue(),nextValue=getValueFromNode(ReactDOMComponentTree.getNodeFromInstance(inst));return nextValue!==lastValue&&(tracker.setValue(nextValue),!0)},stopTracking:function(inst){var tracker=getTracker(inst);tracker&&tracker.stopTracking()}};module.exports=inputValueTracking},function(module,exports,__webpack_require__){"use strict";(function(process){function getDeclarationErrorAddendum(owner){if(owner){var name=owner.getName();if(name)return" Check the render method of `"+name+"`."}return""}function isInternalComponentType(type){return"function"==typeof type&&void 0!==type.prototype&&"function"==typeof type.prototype.mountComponent&&"function"==typeof type.prototype.receiveComponent}function instantiateReactComponent(node,shouldHaveDebugID){var instance;if(null===node||!1===node)instance=ReactEmptyComponent.create(instantiateReactComponent);else if("object"==typeof node){var element=node,type=element.type;if("function"!=typeof type&&"string"!=typeof type){var info="";"production"!==process.env.NODE_ENV&&(void 0===type||"object"==typeof type&&null!==type&&0===Object.keys(type).length)&&(info+=" You likely forgot to export your component from the file it's defined in."),info+=getDeclarationErrorAddendum(element._owner),"production"!==process.env.NODE_ENV?invariant(!1,"Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",null==type?type:typeof type,info):_prodInvariant("130",null==type?type:typeof type,info)}"string"==typeof element.type?instance=ReactHostComponent.createInternalComponent(element):isInternalComponentType(element.type)?(instance=new element.type(element),instance.getHostNode||(instance.getHostNode=instance.getNativeNode)):instance=new ReactCompositeComponentWrapper(element)}else"string"==typeof node||"number"==typeof node?instance=ReactHostComponent.createInstanceForText(node):"production"!==process.env.NODE_ENV?invariant(!1,"Encountered invalid React node of type %s",typeof node):_prodInvariant("131",typeof node);return"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning("function"==typeof instance.mountComponent&&"function"==typeof instance.receiveComponent&&"function"==typeof instance.getHostNode&&"function"==typeof instance.unmountComponent,"Only React Components can be mounted."),instance._mountIndex=0,instance._mountImage=null,"production"!==process.env.NODE_ENV&&(instance._debugID=shouldHaveDebugID?getNextDebugID():0),"production"!==process.env.NODE_ENV&&Object.preventExtensions&&Object.preventExtensions(instance),instance}var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),ReactCompositeComponent=__webpack_require__(240),ReactEmptyComponent=__webpack_require__(107),ReactHostComponent=__webpack_require__(109),getNextDebugID=__webpack_require__(309),invariant=__webpack_require__(1),warning=__webpack_require__(2),ReactCompositeComponentWrapper=function(element){this.construct(element)};_assign(ReactCompositeComponentWrapper.prototype,ReactCompositeComponent,{_instantiateReactComponent:instantiateReactComponent}),module.exports=instantiateReactComponent}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function isTextInputElement(elem){var nodeName=elem&&elem.nodeName&&elem.nodeName.toLowerCase();return"input"===nodeName?!!supportedInputTypes[elem.type]:"textarea"===nodeName}var supportedInputTypes={color:!0,date:!0,datetime:!0,"datetime-local":!0,email:!0,month:!0,number:!0,password:!0,range:!0,search:!0,tel:!0,text:!0,time:!0,url:!0,week:!0};module.exports=isTextInputElement},function(module,exports,__webpack_require__){"use strict";var ExecutionEnvironment=__webpack_require__(9),escapeTextContentForBrowser=__webpack_require__(43),setInnerHTML=__webpack_require__(44),setTextContent=function(node,text){if(text){var firstChild=node.firstChild;if(firstChild&&firstChild===node.lastChild&&3===firstChild.nodeType)return void(firstChild.nodeValue=text)}node.textContent=text};ExecutionEnvironment.canUseDOM&&("textContent"in document.documentElement||(setTextContent=function(node,text){if(3===node.nodeType)return void(node.nodeValue=text);setInnerHTML(node,escapeTextContentForBrowser(text))})),module.exports=setTextContent},function(module,exports,__webpack_require__){"use strict";(function(process){function getComponentKey(component,index){return component&&"object"==typeof component&&null!=component.key?KeyEscapeUtils.escape(component.key):index.toString(36)}function traverseAllChildrenImpl(children,nameSoFar,callback,traverseContext){var type=typeof children;if("undefined"!==type&&"boolean"!==type||(children=null),null===children||"string"===type||"number"===type||"object"===type&&children.$$typeof===REACT_ELEMENT_TYPE)return callback(traverseContext,children,""===nameSoFar?SEPARATOR+getComponentKey(children,0):nameSoFar),1;var child,nextName,subtreeCount=0,nextNamePrefix=""===nameSoFar?SEPARATOR:nameSoFar+SUBSEPARATOR;if(Array.isArray(children))for(var i=0;i<children.length;i++)child=children[i],nextName=nextNamePrefix+getComponentKey(child,i),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext);else{var iteratorFn=getIteratorFn(children);if(iteratorFn){var step,iterator=iteratorFn.call(children);if(iteratorFn!==children.entries)for(var ii=0;!(step=iterator.next()).done;)child=step.value,nextName=nextNamePrefix+getComponentKey(child,ii++),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext);else{if("production"!==process.env.NODE_ENV){var mapsAsChildrenAddendum="";if(ReactCurrentOwner.current){var mapsAsChildrenOwnerName=ReactCurrentOwner.current.getName();mapsAsChildrenOwnerName&&(mapsAsChildrenAddendum=" Check the render method of `"+mapsAsChildrenOwnerName+"`.")}"production"!==process.env.NODE_ENV&&warning(didWarnAboutMaps,"Using Maps as children is not yet fully supported. It is an experimental feature that might be removed. Convert it to a sequence / iterable of keyed ReactElements instead.%s",mapsAsChildrenAddendum),didWarnAboutMaps=!0}for(;!(step=iterator.next()).done;){var entry=step.value;entry&&(child=entry[1],nextName=nextNamePrefix+KeyEscapeUtils.escape(entry[0])+SUBSEPARATOR+getComponentKey(child,0),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext))}}}else if("object"===type){var addendum="";if("production"!==process.env.NODE_ENV&&(addendum=" If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons.",children._isReactElement&&(addendum=" It looks like you're using an element created by a different version of React. Make sure to use only one copy of React."),ReactCurrentOwner.current)){var name=ReactCurrentOwner.current.getName();name&&(addendum+=" Check the render method of `"+name+"`.")}var childrenString=String(children);"production"!==process.env.NODE_ENV?invariant(!1,"Objects are not valid as a React child (found: %s).%s","[object Object]"===childrenString?"object with keys {"+Object.keys(children).join(", ")+"}":childrenString,addendum):_prodInvariant("31","[object Object]"===childrenString?"object with keys {"+Object.keys(children).join(", ")+"}":childrenString,addendum)}}return subtreeCount}function traverseAllChildren(children,callback,traverseContext){return null==children?0:traverseAllChildrenImpl(children,"",callback,traverseContext)}var _prodInvariant=__webpack_require__(4),ReactCurrentOwner=__webpack_require__(18),REACT_ELEMENT_TYPE=__webpack_require__(259),getIteratorFn=__webpack_require__(293),invariant=__webpack_require__(1),KeyEscapeUtils=__webpack_require__(57),warning=__webpack_require__(2),SEPARATOR=".",SUBSEPARATOR=":",didWarnAboutMaps=!1;module.exports=traverseAllChildren}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function ReactComponent(props,context,updater){this.props=props,this.context=context,this.refs=emptyObject,this.updater=updater||ReactNoopUpdateQueue}function ReactPureComponent(props,context,updater){this.props=props,this.context=context,this.refs=emptyObject,this.updater=updater||ReactNoopUpdateQueue}function ComponentDummy(){}var _prodInvariant=__webpack_require__(29),_assign=__webpack_require__(7),ReactNoopUpdateQueue=__webpack_require__(127),canDefineProperty=__webpack_require__(45),emptyObject=__webpack_require__(38),invariant=__webpack_require__(1),lowPriorityWarning=__webpack_require__(69);if(ReactComponent.prototype.isReactComponent={},ReactComponent.prototype.setState=function(partialState,callback){"object"!=typeof partialState&&"function"!=typeof partialState&&null!=partialState&&("production"!==process.env.NODE_ENV?invariant(!1,"setState(...): takes an object of state variables to update or a function which returns an object of state variables."):_prodInvariant("85")),this.updater.enqueueSetState(this,partialState),callback&&this.updater.enqueueCallback(this,callback,"setState")},ReactComponent.prototype.forceUpdate=function(callback){this.updater.enqueueForceUpdate(this),callback&&this.updater.enqueueCallback(this,callback,"forceUpdate")},"production"!==process.env.NODE_ENV){var deprecatedAPIs={isMounted:["isMounted","Instead, make sure to clean up subscriptions and pending requests in componentWillUnmount to prevent memory leaks."],replaceState:["replaceState","Refactor your code to use setState instead (see https://github.com/facebook/react/issues/3236)."]};for(var fnName in deprecatedAPIs)deprecatedAPIs.hasOwnProperty(fnName)&&function(methodName,info){canDefineProperty&&Object.defineProperty(ReactComponent.prototype,methodName,{get:function(){lowPriorityWarning(!1,"%s(...) is deprecated in plain JavaScript React classes. %s",info[0],info[1])}})}(fnName,deprecatedAPIs[fnName])}ComponentDummy.prototype=ReactComponent.prototype,ReactPureComponent.prototype=new ComponentDummy,ReactPureComponent.prototype.constructor=ReactPureComponent,_assign(ReactPureComponent.prototype,ReactComponent.prototype),ReactPureComponent.prototype.isPureReactComponent=!0,module.exports={Component:ReactComponent,PureComponent:ReactPureComponent}}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var REACT_ELEMENT_TYPE="function"==typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103;module.exports=REACT_ELEMENT_TYPE},function(module,exports,__webpack_require__){"use strict";(function(process){function getDeclarationErrorAddendum(){if(ReactCurrentOwner.current){var name=ReactCurrentOwner.current.getName();if(name)return" Check the render method of `"+name+"`."}return""}function getSourceInfoErrorAddendum(elementProps){if(null!==elementProps&&void 0!==elementProps&&void 0!==elementProps.__source){var source=elementProps.__source;return" Check your code at "+source.fileName.replace(/^.*[\\\/]/,"")+":"+source.lineNumber+"."}return""}function getCurrentComponentErrorInfo(parentType){var info=getDeclarationErrorAddendum();if(!info){var parentName="string"==typeof parentType?parentType:parentType.displayName||parentType.name;parentName&&(info=" Check the top-level render call using <"+parentName+">.")}return info}function validateExplicitKey(element,parentType){if(element._store&&!element._store.validated&&null==element.key){element._store.validated=!0;var memoizer=ownerHasKeyUseWarning.uniqueKey||(ownerHasKeyUseWarning.uniqueKey={}),currentComponentErrorInfo=getCurrentComponentErrorInfo(parentType);if(!memoizer[currentComponentErrorInfo]){memoizer[currentComponentErrorInfo]=!0;var childOwner="";element&&element._owner&&element._owner!==ReactCurrentOwner.current&&(childOwner=" It was passed a child from "+element._owner.getName()+"."),"production"!==process.env.NODE_ENV&&warning(!1,'Each child in an array or iterator should have a unique "key" prop.%s%s See https://fb.me/react-warning-keys for more information.%s',currentComponentErrorInfo,childOwner,ReactComponentTreeHook.getCurrentStackAddendum(element))}}}function validateChildKeys(node,parentType){if("object"==typeof node)if(Array.isArray(node))for(var i=0;i<node.length;i++){var child=node[i];ReactElement.isValidElement(child)&&validateExplicitKey(child,parentType)}else if(ReactElement.isValidElement(node))node._store&&(node._store.validated=!0);else if(node){var iteratorFn=getIteratorFn(node);if(iteratorFn&&iteratorFn!==node.entries)for(var step,iterator=iteratorFn.call(node);!(step=iterator.next()).done;)ReactElement.isValidElement(step.value)&&validateExplicitKey(step.value,parentType)}}function validatePropTypes(element){var componentClass=element.type;if("function"==typeof componentClass){var name=componentClass.displayName||componentClass.name;componentClass.propTypes&&checkReactTypeSpec(componentClass.propTypes,element.props,"prop",name,element,null),"function"==typeof componentClass.getDefaultProps&&"production"!==process.env.NODE_ENV&&warning(componentClass.getDefaultProps.isReactClassApproved,"getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}var ReactCurrentOwner=__webpack_require__(18),ReactComponentTreeHook=__webpack_require__(11),ReactElement=__webpack_require__(24),checkReactTypeSpec=__webpack_require__(307),canDefineProperty=__webpack_require__(45),getIteratorFn=__webpack_require__(128),warning=__webpack_require__(2),lowPriorityWarning=__webpack_require__(69),ownerHasKeyUseWarning={},ReactElementValidator={createElement:function(type,props,children){var validType="string"==typeof type||"function"==typeof type;if(!validType&&"function"!=typeof type&&"string"!=typeof type){var info="";(void 0===type||"object"==typeof type&&null!==type&&0===Object.keys(type).length)&&(info+=" You likely forgot to export your component from the file it's defined in.");var sourceInfo=getSourceInfoErrorAddendum(props);info+=sourceInfo||getDeclarationErrorAddendum(),info+=ReactComponentTreeHook.getCurrentStackAddendum();var currentSource=null!==props&&void 0!==props&&void 0!==props.__source?props.__source:null;ReactComponentTreeHook.pushNonStandardWarningStack(!0,currentSource),"production"!==process.env.NODE_ENV&&warning(!1,"React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",null==type?type:typeof type,info),ReactComponentTreeHook.popNonStandardWarningStack()}var element=ReactElement.createElement.apply(this,arguments);if(null==element)return element;if(validType)for(var i=2;i<arguments.length;i++)validateChildKeys(arguments[i],type);return validatePropTypes(element),element},createFactory:function(type){var validatedFactory=ReactElementValidator.createElement.bind(null,type);return validatedFactory.type=type,"production"!==process.env.NODE_ENV&&canDefineProperty&&Object.defineProperty(validatedFactory,"type",{enumerable:!1,get:function(){return lowPriorityWarning(!1,"Factory.type is deprecated. Access the class directly before passing it to createFactory."),Object.defineProperty(this,"type",{value:type}),type}}),validatedFactory},cloneElement:function(element,props,children){for(var newElement=ReactElement.cloneElement.apply(this,arguments),i=2;i<arguments.length;i++)validateChildKeys(arguments[i],newElement.type);return validatePropTypes(newElement),newElement}};module.exports=ReactElementValidator}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function warnNoop(publicInstance,callerName){if("production"!==process.env.NODE_ENV){var constructor=publicInstance.constructor;"production"!==process.env.NODE_ENV&&warning(!1,"%s(...): Can only update a mounted or mounting component. This usually means you called %s() on an unmounted component. This is a no-op. Please check the code for the %s component.",callerName,callerName,constructor&&(constructor.displayName||constructor.name)||"ReactClass")}}var warning=__webpack_require__(2),ReactNoopUpdateQueue={isMounted:function(publicInstance){return!1},enqueueCallback:function(publicInstance,callback){},enqueueForceUpdate:function(publicInstance){warnNoop(publicInstance,"forceUpdate")},enqueueReplaceState:function(publicInstance,completeState){warnNoop(publicInstance,"replaceState")},enqueueSetState:function(publicInstance,partialState){warnNoop(publicInstance,"setState")}};module.exports=ReactNoopUpdateQueue}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function getIteratorFn(maybeIterable){var iteratorFn=maybeIterable&&(ITERATOR_SYMBOL&&maybeIterable[ITERATOR_SYMBOL]||maybeIterable[FAUX_ITERATOR_SYMBOL]);if("function"==typeof iteratorFn)return iteratorFn}var ITERATOR_SYMBOL="function"==typeof Symbol&&Symbol.iterator,FAUX_ITERATOR_SYMBOL="@@iterator";module.exports=getIteratorFn},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}var _Docs=__webpack_require__(149),_Docs2=_interopRequireDefault(_Docs),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react);_interopRequireDefault(__webpack_require__(227)).default.render(_react2.default.createElement(_Docs2.default,{page:page,routes:routes}),document.getElementById("js-root"))},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement(_Alert2.default,{heading:"A react component"},"This is an example of a React Alert component.")};var _Alert=__webpack_require__(131),_Alert2=_interopRequireDefault(_Alert),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Alert=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Alert=exports.Alert=function(_React$PureComponent){function Alert(){return _classCallCheck(this,Alert),_possibleConstructorReturn(this,(Alert.__proto__||Object.getPrototypeOf(Alert)).apply(this,arguments))}return _inherits(Alert,_React$PureComponent),_createClass(Alert,[{key:"heading",value:function(){if(this.props.heading)return _react2.default.createElement("h3",{className:"ds-c-alert__heading"},this.props.heading)}},{key:"render",value:function(){var classes=(0,_classnames2.default)("ds-c-alert",this.props.variation&&"ds-c-alert--"+this.props.variation,this.props.className);return _react2.default.createElement("div",{className:classes,role:this.props.role},_react2.default.createElement("div",{className:"ds-c-alert__body"},this.heading(),this.props.children))}}]),Alert}(_react2.default.PureComponent);Alert.propTypes={children:_propTypes2.default.node.isRequired,heading:_propTypes2.default.string,role:_propTypes2.default.oneOf(["alert","alertdialog"]),variation:_propTypes2.default.oneOf(["error","warn","success"])},exports.default=Alert},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement(_Badge2.default,null,"Today")};var _Badge=__webpack_require__(133),_Badge2=_interopRequireDefault(_Badge),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Badge=void 0;var _propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),Badge=exports.Badge=function(props){return _react2.default.createElement("span",{className:"ds-c-badge"},props.children)};Badge.propTypes={children:_propTypes2.default.oneOfType([_propTypes2.default.node,_propTypes2.default.string]).isRequired},exports.default=Badge},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement("div",null,_react2.default.createElement(_Button2.default,null,"React button"),_react2.default.createElement(_Button2.default,{className:"ds-u-margin-left--1",href:"http://example.com",target:"_blank",variation:"primary"},"React anchor button"))};var _Button=__webpack_require__(135),_Button2=_interopRequireDefault(_Button),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Button=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Button=exports.Button=function(_React$PureComponent){function Button(){return _classCallCheck(this,Button),_possibleConstructorReturn(this,(Button.__proto__||Object.getPrototypeOf(Button)).apply(this,arguments))}return _inherits(Button,_React$PureComponent),_createClass(Button,[{key:"attrs",value:function(){var _props=this.props,props=(_props.className,_props.component,_props.inverse,_props.onClick,_props.size,_props.variation,_objectWithoutProperties(_props,["className","component","inverse","onClick","size","variation"])),attrs=_extends({className:this.classNames()},props);return this.props.onClick&&(attrs.onClick=this.handleClick.bind(this)),attrs}},{key:"classNames",value:function(){var variationClass=this.props.variation&&"ds-c-button--"+this.props.variation,disabledClass=this.props.disabled&&"ds-c-button--disabled";return this.props.inverse&&(disabledClass?disabledClass+="-inverse":variationClass?variationClass+="-inverse":variationClass="ds-c-button--inverse"),(0,_classnames2.default)("ds-c-button",disabledClass,!disabledClass&&variationClass,this.props.size&&"ds-c-button--"+this.props.size,this.props.className)}},{key:"handleClick",value:function(e){this.props.disabled||this.props.onClick(e)}},{key:"render",value:function(){var attrs=this.attrs(),ComponentType="button";return this.props.component?ComponentType=this.props.component:this.props.href&&(ComponentType="a",delete attrs.disabled,delete attrs.type),_react2.default.createElement(ComponentType,attrs,this.props.children)}}]),Button}(_react2.default.PureComponent);Button.defaultProps={type:"button"},Button.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,component:_propTypes2.default.oneOfType([_propTypes2.default.element,_propTypes2.default.func]),disabled:_propTypes2.default.bool,href:_propTypes2.default.string,inverse:_propTypes2.default.bool,onClick:_propTypes2.default.func,size:_propTypes2.default.oneOf(["small","big"]),type:_propTypes2.default.oneOf(["button","submit"]),variation:_propTypes2.default.oneOf(["primary","danger","success","transparent"])},exports.default=Button},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement("div",null,_react2.default.createElement(_Choice2.default,{defaultChecked:!0,name:"checkbox_choice",value:"a"},"Checkbox A"),_react2.default.createElement(_Choice2.default,{name:"checkbox_choice",value:"b"},"Checkbox B"),_react2.default.createElement(_Choice2.default,{disabled:!0,name:"checkbox_choice",value:"c"},"Checkbox B"),_react2.default.createElement(_Choice2.default,{defaultChecked:!0,name:"radio_choice",type:"radio",value:"a"},"Radio A"),_react2.default.createElement(_Choice2.default,{name:"radio_choice",type:"radio",value:"b"},"Radio B"))};var _Choice=__webpack_require__(70),_Choice2=_interopRequireDefault(_Choice),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function generateChoices(length){for(var choices=[],i=0;i<length;i++)choices.push({label:"Choice "+(i+1),value:String(i+1)});return choices}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){var choices=generateChoices(4),options=generateChoices(8);return choices[1].defaultChecked=!0,choices[2].disabled=!0,options[1].defaultChecked=!0,_react2.default.createElement("div",null,_react2.default.createElement(_ChoiceList2.default,{choices:choices,className:"ds-u-margin-top--0",label:"Radio example",name:"choices_field"}),_react2.default.createElement(_ChoiceList2.default,{choices:choices,errorMessage:"Example error message",label:"Checkbox example",multiple:!0,name:"multiple_choices_field"}),_react2.default.createElement(_ChoiceList2.default,{choices:options,hint:"Example hint text",label:"Select example",name:"select_choices_field"}),_react2.default.createElement("div",{className:"ds-base--inverse ds-u-margin-top--4 ds-u-padding--1"},_react2.default.createElement(_ChoiceList2.default,{choices:options,hint:"Example hint text",inversed:!0,label:"Select example",labelClassName:"ds-u-margin-top--0",name:"select_choices_field_inverse"})))};var _ChoiceList=__webpack_require__(138),_ChoiceList2=_interopRequireDefault(_ChoiceList),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.ChoiceList=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_Choice=__webpack_require__(70),_Choice2=_interopRequireDefault(_Choice),_FormLabel=__webpack_require__(72),_FormLabel2=_interopRequireDefault(_FormLabel),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_Select=__webpack_require__(71),_Select2=_interopRequireDefault(_Select),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),ChoiceList=exports.ChoiceList=function(_React$PureComponent){function ChoiceList(){return _classCallCheck(this,ChoiceList),_possibleConstructorReturn(this,(ChoiceList.__proto__||Object.getPrototypeOf(ChoiceList)).apply(this,arguments))}return _inherits(ChoiceList,_React$PureComponent),_createClass(ChoiceList,[{key:"field",value:function(){var _this2=this,type=this.type(),ChoiceComponent="select"===type?"option":_Choice2.default,selectProps={},choices=this.props.choices.map(function(choice){var checked=choice.checked,defaultChecked=choice.defaultChecked,label=choice.label,props=_objectWithoutProperties(choice,["checked","defaultChecked","label"]);return"select"===type?(checked&&(selectProps.value=props.value),defaultChecked&&(selectProps.defaultValue=props.value)):(props.checked=checked,props.defaultChecked=defaultChecked,props.disabled=props.disabled||_this2.props.disabled,props.inversed=_this2.props.inversed,props.name=_this2.props.name,props.onBlur=_this2.props.onBlur,props.onChange=_this2.props.onChange,props.type=type),_react2.default.createElement(ChoiceComponent,_extends({key:choice.value},props),label)});return"select"===type?this.select(selectProps,choices):choices}},{key:"id",value:function(){if("select"===this.type())return this._id||(this._id=(0,_lodash2.default)("select_"+this.props.name+"_")),this._id}},{key:"select",value:function(selectProps,options){return _react2.default.createElement(_Select2.default,_extends({disabled:this.props.disabled,id:this.id(),inversed:this.props.inversed,name:this.props.name,onBlur:this.props.onBlur,onChange:this.props.onChange},selectProps),options)}},{key:"type",value:function(){return this.props.type?this.props.type:this.props.multiple||1===this.props.choices.length?"checkbox":this.props.choices.length>7?"select":"radio"}},{key:"render",value:function(){var type=this.type(),classes=(0,_classnames2.default)({"ds-c-fieldset":"select"!==type},this.props.className),RootComponent="select"===type?"div":"fieldset",FormLabelComponent="select"===type?"label":"legend";return _react2.default.createElement(RootComponent,{className:classes||null},_react2.default.createElement(_FormLabel2.default,{className:this.props.labelClassName,component:FormLabelComponent,errorMessage:this.props.errorMessage,fieldId:this.id(),hint:this.props.hint,inversed:this.props.inversed},this.props.label),this.field())}}]),ChoiceList}(_react2.default.PureComponent);ChoiceList.propTypes={choices:_propTypes2.default.arrayOf(_propTypes2.default.shape({checked:_Choice2.default.propTypes.checked,defaultChecked:_Choice2.default.propTypes.defaultChecked,disabled:_Choice2.default.propTypes.disabled,label:_Choice2.default.propTypes.children,value:_Choice2.default.propTypes.value})).isRequired,className:_propTypes2.default.string,disabled:_propTypes2.default.bool,errorMessage:_propTypes2.default.string,hint:_propTypes2.default.node,inversed:_propTypes2.default.bool,label:_propTypes2.default.node.isRequired,labelClassName:_propTypes2.default.string,multiple:_propTypes2.default.bool,name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,type:_propTypes2.default.oneOf(["checkbox","radio","select"])},exports.default=ChoiceList},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0});var _react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_Select=__webpack_require__(71),_Select2=_interopRequireDefault(_Select);exports.default=function(){return _react2.default.createElement(_Select2.default,{defaultValue:"2",name:"select-demo"},_react2.default.createElement("option",{value:"1"},"Option 1"),_react2.default.createElement("option",{value:"2"},"Option 2"),_react2.default.createElement("option",{value:"3"},"Option 3"),_react2.default.createElement("option",{value:"4"},"Option 4"),_react2.default.createElement("option",{value:"5"},"Option 5"),_react2.default.createElement("option",{value:"6"},"Option 6"),_react2.default.createElement("option",{value:"7"},"Option 7"))}},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement("div",{className:"ds-c-tabs",role:"tablist"},_react2.default.createElement(_Tab2.default,{id:"tab-example-1",panelId:"tab-example-panel-1",selected:!0},"Selected tab"),_react2.default.createElement(_Tab2.default,{id:"tab-example-2",panelId:"tab-example-panel-2"},"Other tab"))};var _react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_Tab=__webpack_require__(73),_Tab2=_interopRequireDefault(_Tab)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement(_Tabs2.default,null,_react2.default.createElement(_TabPanel2.default,{id:"summary",tab:"Summary"},"The Bill of Rights is the first ten amendments to the United States Constitution."),_react2.default.createElement(_TabPanel2.default,{id:"amendments",tab:"Amendments"},_react2.default.createElement("h2",{className:"ds-h4"},"Bill of Rights"),_react2.default.createElement("ol",{className:"ds-c-list"},_react2.default.createElement("li",null,"Freedoms, Petitions, Assembly"),_react2.default.createElement("li",null,"Right to bear arms"),_react2.default.createElement("li",null,"Quartering of soldiers"),_react2.default.createElement("li",null,"Search and arrest"),_react2.default.createElement("li",null,"Rights in criminal cases"),_react2.default.createElement("li",null,"Right to a fair trial"),_react2.default.createElement("li",null,"Rights in civil cases"),_react2.default.createElement("li",null,"Bail, fines, punishment"),_react2.default.createElement("li",null,"Rights retained by the People"),_react2.default.createElement("li",null,"States’ rights")),_react2.default.createElement("h2",{className:"ds-h4"},"Later Amendments"),_react2.default.createElement("ol",{className:"ds-c-list",start:"11"},_react2.default.createElement("li",null,"Lawsuits against states"),_react2.default.createElement("li",null,"Presidential elections"),_react2.default.createElement("li",null,"Abolition of slavery"),_react2.default.createElement("li",null,"Civil rights"),_react2.default.createElement("li",null,"Black suffrage"),_react2.default.createElement("li",null,"Income taxes"),_react2.default.createElement("li",null,"Senatorial elections"),_react2.default.createElement("li",null,"Prohibition of liquor"),_react2.default.createElement("li",null,"Women’s suffrage"),_react2.default.createElement("li",null,"Terms of office"),_react2.default.createElement("li",null,"Repeal of Prohibition"),_react2.default.createElement("li",null,"Term Limits for the Presidency"),_react2.default.createElement("li",null,"Washington, D.C., suffrage"),_react2.default.createElement("li",null,"Abolition of poll taxes"),_react2.default.createElement("li",null,"Presidential succession"),_react2.default.createElement("li",null,"18-year-old suffrage"),_react2.default.createElement("li",null,"Congressional pay raises"))))};var _react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_TabPanel=__webpack_require__(74),_TabPanel2=_interopRequireDefault(_TabPanel),_Tabs=__webpack_require__(142),_Tabs2=_interopRequireDefault(_Tabs)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}function getDefaultSelectedId(props){var selectedId=void 0;return _react2.default.Children.forEach(props.children,function(child){isTabPanel(child)&&!selectedId&&(selectedId=child.props.id)}),selectedId}function panelTabId(panel){return panel.props.tabId||"ds-c-tabs__item--"+panel.props.id}function isTabPanel(child){return null!=child&&child.type===_TabPanel2.default}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Tabs=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_Tab=__webpack_require__(73),_Tab2=_interopRequireDefault(_Tab),_TabPanel=__webpack_require__(74),_TabPanel2=_interopRequireDefault(_TabPanel),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Tabs=exports.Tabs=function(_React$PureComponent){function Tabs(props){_classCallCheck(this,Tabs);var _this=_possibleConstructorReturn(this,(Tabs.__proto__||Object.getPrototypeOf(Tabs)).call(this,props)),selectedId=void 0;return selectedId="defaultSelectedId"in props?props.defaultSelectedId:getDefaultSelectedId(props),_this.handleTabClick=_this.handleTabClick.bind(_this),_this.state={selectedId:selectedId},_this}return _inherits(Tabs,_React$PureComponent),_createClass(Tabs,[{key:"componentDidUpdate",value:function(_,prevState){"function"==typeof this.props.onChange&&this.state.selectedId!==prevState.selectedId&&this.props.onChange(this.state.selectedId,prevState.selectedId)}},{key:"handleTabClick",value:function(evt,panelId,tabId,href){evt.preventDefault(),this.setState({selectedId:panelId}),this.replaceState(href)}},{key:"panelChildren",value:function(){return _react2.default.Children.toArray(this.props.children).filter(isTabPanel)}},{key:"renderChildren",value:function(){var _this2=this;return _react2.default.Children.map(this.props.children,function(child){return isTabPanel(child)?_react2.default.cloneElement(child,{selected:_this2.state.selectedId===child.props.id,tab:void 0,tabHref:void 0,tabId:panelTabId(child)}):child})}},{key:"renderTabs",value:function(){var _this3=this,panels=this.panelChildren(),listClasses=(0,_classnames2.default)("ds-c-tabs",this.props.tablistClassName),tabs=panels.map(function(panel){return _react2.default.createElement(_Tab2.default,{className:panel.props.tabClassName,href:panel.props.tabHref,id:panelTabId(panel),key:panel.key,onClick:_this3.handleTabClick,panelId:panel.props.id,selected:_this3.state.selectedId===panel.props.id},panel.props.tab)});return _react2.default.createElement("div",{className:listClasses,role:"tablist"},tabs)}},{key:"replaceState",value:function(url){window.history&&window.history.replaceState({},document.title,url)}},{key:"render",value:function(){return _react2.default.createElement("div",null,this.renderTabs(),this.renderChildren())}}]),Tabs}(_react2.default.PureComponent);Tabs.propTypes={children:_propTypes2.default.node.isRequired,defaultSelectedId:_propTypes2.default.string,onChange:_propTypes2.default.func,tablistClassName:_propTypes2.default.string},exports.default=Tabs},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement("div",null,_react2.default.createElement(_TextField2.default,{defaultValue:"Example value",label:"Single line",labelClassName:"ds-u-margin-top--0",name:"single_example"}),_react2.default.createElement(_TextField2.default,{errorMessage:"Error message example",hint:"Example of a multiline field with an error",label:"Multiline",multiline:!0,name:"multiline_example"}),_react2.default.createElement(_TextField2.default,{label:"Disabled field",disabled:!0,name:"disabled_example",value:"Example value"}),_react2.default.createElement(_TextField2.default,{label:"Password field",name:"disabled_example",type:"password"}),_react2.default.createElement("div",{className:"ds-base--inverse ds-u-margin-top--3 ds-u-padding--2"},_react2.default.createElement(_TextField2.default,{inversed:!0,label:"Single line",labelClassName:"ds-u-margin-top--0",name:"inversed_single_example"}),_react2.default.createElement(_TextField2.default,{label:"Disabled field",disabled:!0,inversed:!0,name:"inversed_disabled_example"})))};var _react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_TextField=__webpack_require__(144),_TextField2=_interopRequireDefault(_TextField)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.TextField=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_FormLabel=__webpack_require__(72),_FormLabel2=_interopRequireDefault(_FormLabel),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),TextField=exports.TextField=function(_React$PureComponent){function TextField(props){_classCallCheck(this,TextField);var _this=_possibleConstructorReturn(this,(TextField.__proto__||Object.getPrototypeOf(TextField)).call(this,props));return _this.id=(0,_lodash2.default)("textfield_"),_this}return _inherits(TextField,_React$PureComponent),_createClass(TextField,[{key:"render",value:function(){var FieldComponent=this.props.multiline?"textarea":"input",rows=this.props.multiline&&this.props.rows?this.props.rows:void 0,classes=(0,_classnames2.default)("ds-u-clearfix",this.props.className),fieldClasses=(0,_classnames2.default)("ds-c-field",{"ds-c-field--error":"string"==typeof this.props.errorMessage,"ds-c-field--inverse":this.props.inversed},this.props.fieldClassName);return _react2.default.createElement("div",{className:classes},_react2.default.createElement(_FormLabel2.default,{className:this.props.labelClassName,errorMessage:this.props.errorMessage,fieldId:this.id,hint:this.props.hint,inversed:this.props.inversed},this.props.label),_react2.default.createElement(FieldComponent,{className:fieldClasses,defaultValue:this.props.defaultValue,disabled:this.props.disabled,id:this.id,name:this.props.name,onChange:this.props.onChange,onBlur:this.props.onBlur,rows:rows,type:this.props.multiline?void 0:this.props.type,value:this.props.value}))}}]),TextField}(_react2.default.PureComponent);TextField.defaultProps={type:"text"},TextField.propTypes={className:_propTypes2.default.string,defaultValue:_propTypes2.default.string,disabled:_propTypes2.default.bool,errorMessage:_propTypes2.default.string,fieldClassName:_propTypes2.default.string,hint:_propTypes2.default.node,inversed:_propTypes2.default.bool,label:_propTypes2.default.node.isRequired,labelClassName:_propTypes2.default.string,multiline:_propTypes2.default.bool,name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,rows:_propTypes2.default.oneOfType([_propTypes2.default.number,_propTypes2.default.string]),type:_propTypes2.default.string,value:_propTypes2.default.string},exports.default=TextField},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(){return _react2.default.createElement(_VerticalNav2.default,{selectedId:"team",items:[{label:"Home",url:"http://example.com"},{label:"About",items:[{id:"team",label:"Team",url:"http://example.com#team"},{id:"company",label:"Company",url:"http://example.com#company"}]},{label:"Contact",url:"http://example.com#contact"}]})};var _react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_VerticalNav=__webpack_require__(75),_VerticalNav2=_interopRequireDefault(_VerticalNav)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.VerticalNavItem=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_VerticalNav=__webpack_require__(75),_VerticalNav2=_interopRequireDefault(_VerticalNav),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),VerticalNavItem=exports.VerticalNavItem=function(_React$PureComponent){function VerticalNavItem(props){_classCallCheck(this,VerticalNavItem);var _this=_possibleConstructorReturn(this,(VerticalNavItem.__proto__||Object.getPrototypeOf(VerticalNavItem)).call(this,props));return _this.handleLinkClick=_this.handleLinkClick.bind(_this),_this.handleToggleClick=_this.handleToggleClick.bind(_this),_this.id=_this.props.id||(0,_lodash2.default)("VerticalNavItem_"),_this.subnavId=_this.id+"__subnav",_this.state={collapsed:_this.props.defaultCollapsed},_this}return _inherits(VerticalNavItem,_React$PureComponent),_createClass(VerticalNavItem,[{key:"componentDidUpdate",value:function(prevProps,prevState){this.props.onSubnavToggle&&prevState.collapsed!==this.state.collapsed&&this.props.onSubnavToggle(this.props.id,this.state.collapsed)}},{key:"handleLinkClick",value:function(evt){this.props.onClick&&this.props.onClick(evt,this.id,this.props.url)}},{key:"handleToggleClick",value:function(){this.setState({collapsed:!this.state.collapsed})}},{key:"hasSubnav",value:function(){return this.props.items&&this.props.items.length}},{key:"isSelected",value:function(){return this.props.selected?this.props.selected:this.props._selectedId&&this.hasSubnav()?this.childIsSelected(this.props.items):void 0}},{key:"childIsSelected",value:function(children){var _this2=this;return!(!children||!children.length)&&children.some(function(child){return child.id===_this2.props._selectedId||_this2.childIsSelected(child.items)})}},{key:"renderSubnavToggle",value:function(){if(this.hasSubnav()){var label=this.state.collapsed?this.props.ariaCollapsedStateButtonLabel:this.props.ariaExpandedStateButtonLabel;return _react2.default.createElement("button",{"aria-controls":this.subnavId,"aria-expanded":!this.state.collapsed,className:"ds-c-vertical-nav__subnav-toggle",onClick:this.handleToggleClick},label)}}},{key:"renderSubnav",value:function(){if(this.hasSubnav())return _react2.default.createElement(_VerticalNav2.default,{selectedId:this.props._selectedId,collapsed:this.state.collapsed,id:this.subnavId,items:this.props.items,nested:!0})}},{key:"render",value:function(){var classes=(0,_classnames2.default)("ds-c-vertical-nav__item",this.props.className),LinkComponent=this.props.url?"a":"div",linkProps={className:(0,_classnames2.default)("ds-c-vertical-nav__link",{"ds-c-vertical-nav__link--current":this.isSelected(),"ds-c-vertical-nav__link--parent":this.hasSubnav()}),href:this.props.url?this.props.url:void 0,onClick:this.props.onClick?this.handleLinkClick:void 0};return _react2.default.createElement("li",{className:classes},_react2.default.createElement(LinkComponent,linkProps,this.props.label),this.renderSubnavToggle(),this.renderSubnav())}}]),VerticalNavItem}(_react2.default.PureComponent);VerticalNavItem.defaultProps={ariaCollapsedStateButtonLabel:"Expand sub-navigation",ariaExpandedStateButtonLabel:"Collapse sub-navigation",defaultCollapsed:!1},VerticalNavItem.propTypes={_selectedId:_propTypes2.default.string,ariaCollapsedStateButtonLabel:_propTypes2.default.string,ariaExpandedStateButtonLabel:_propTypes2.default.string,className:_propTypes2.default.string,defaultCollapsed:_propTypes2.default.bool,onClick:_propTypes2.default.func,onSubnavToggle:_propTypes2.default.func,id:_propTypes2.default.string,items:_propTypes2.default.arrayOf(_propTypes2.default.shape(VerticalNavItem.propTypes)),label:_propTypes2.default.node.isRequired,url:_propTypes2.default.string,selected:_propTypes2.default.bool},exports.default=VerticalNavItem},function(module,exports,__webpack_require__){"use strict";module.exports=function(object){return Object.getOwnPropertySymbols(object).filter(function(keySymbol){return object.propertyIsEnumerable(keySymbol)})}},function(module,exports,__webpack_require__){"use strict";var _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj},isRegexp=__webpack_require__(204),isObj=__webpack_require__(202),getOwnEnumPropSymbols=__webpack_require__(147);module.exports=function(val,opts,pad){var seen=[];return function stringify(val,opts,pad){opts=opts||{},opts.indent=opts.indent||"\t",pad=pad||"";var tokens=void 0;tokens=void 0===opts.inlineCharacterLimit?{newLine:"\n",newLineOrSpace:"\n",pad:pad,indent:pad+opts.indent}:{newLine:"@@__STRINGIFY_OBJECT_NEW_LINE__@@",newLineOrSpace:"@@__STRINGIFY_OBJECT_NEW_LINE_OR_SPACE__@@",pad:"@@__STRINGIFY_OBJECT_PAD__@@",indent:"@@__STRINGIFY_OBJECT_INDENT__@@"};var expandWhiteSpace=function(string){if(void 0===opts.inlineCharacterLimit)return string;var oneLined=string.replace(new RegExp(tokens.newLine,"g"),"").replace(new RegExp(tokens.newLineOrSpace,"g")," ").replace(new RegExp(tokens.pad+"|"+tokens.indent,"g"),"");return oneLined.length<=opts.inlineCharacterLimit?oneLined:string.replace(new RegExp(tokens.newLine+"|"+tokens.newLineOrSpace,"g"),"\n").replace(new RegExp(tokens.pad,"g"),pad).replace(new RegExp(tokens.indent,"g"),pad+opts.indent)};if(-1!==seen.indexOf(val))return'"[Circular]"';if(null===val||void 0===val||"number"==typeof val||"boolean"==typeof val||"function"==typeof val||"symbol"===(void 0===val?"undefined":_typeof(val))||isRegexp(val))return String(val);if(val instanceof Date)return"new Date('"+val.toISOString()+"')";if(Array.isArray(val)){if(0===val.length)return"[]";seen.push(val);var ret="["+tokens.newLine+val.map(function(el,i){var eol=val.length-1===i?tokens.newLine:","+tokens.newLineOrSpace,value=stringify(el,opts,pad+opts.indent);return opts.transform&&(value=opts.transform(val,i,value)),tokens.indent+value+eol}).join("")+tokens.pad+"]";return seen.pop(val),expandWhiteSpace(ret)}if(isObj(val)){var objKeys=Object.keys(val).concat(getOwnEnumPropSymbols(val));if(0===objKeys.length)return"{}";seen.push(val);var _ret="{"+tokens.newLine+objKeys.map(function(el,i){if(opts.filter&&!opts.filter(val,el))return"";var eol=objKeys.length-1===i?tokens.newLine:","+tokens.newLineOrSpace,isSymbol="symbol"===(void 0===el?"undefined":_typeof(el)),isClassic=!isSymbol&&/^[a-z$_][a-z$_0-9]*$/i.test(el),key=isSymbol||isClassic?el:stringify(el,opts),value=stringify(val[el],opts,pad+opts.indent);return opts.transform&&(value=opts.transform(val,el,value)),tokens.indent+String(key)+": "+value+eol}).join("")+tokens.pad+"}";return seen.pop(val),expandWhiteSpace(_ret)}return val=String(val).replace(/[\r\n]/g,function(x){return"\n"===x?"\\n":"\\r"}),!1===opts.singleQuotes?'"'+(val=val.replace(/"/g,'\\"'))+'"':"'"+(val=val.replace(/\\?'/g,"\\'"))+"'"}(val,opts,pad)}},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0});var _Header=__webpack_require__(151),_Header2=_interopRequireDefault(_Header),_Nav=__webpack_require__(152),_Nav2=_interopRequireDefault(_Nav),_Page=__webpack_require__(153),_Page2=_interopRequireDefault(_Page),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),Docs=function(props){return _react2.default.createElement("div",null,_react2.default.createElement(_Header2.default,null),_react2.default.createElement("div",{className:"l-grid"},_react2.default.createElement(_Nav2.default,{items:props.routes,selectedId:props.page.referenceURI}),_react2.default.createElement("main",{className:"l-col-9 l-col-grow"},_react2.default.createElement(_Page2.default,props.page))))};Docs.propTypes={page:_propTypes2.default.shape(_Page2.default.propTypes).isRequired,routes:_Nav2.default.propTypes.items},exports.default=Docs},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_CodeSnippet=__webpack_require__(76),_CodeSnippet2=_interopRequireDefault(_CodeSnippet),_prismjs=__webpack_require__(99),_prismjs2=_interopRequireDefault(_prismjs),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),HTMLExample=function(_React$PureComponent){function HTMLExample(){return _classCallCheck(this,HTMLExample),_possibleConstructorReturn(this,(HTMLExample.__proto__||Object.getPrototypeOf(HTMLExample)).apply(this,arguments))}return _inherits(HTMLExample,_React$PureComponent),_createClass(HTMLExample,[{key:"markup",value:function(){var html=this.props.markup,modifier=this.props.modifier?" "+this.props.modifier.className:"",lorem={s:"We the People of the United States",m:"We the People of the United States, in Order to form a more perfect Union",l:"We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America."};return html.replace(/\s?{{\s?modifier\s?}}/g,modifier).replace(/\s?{{\s?lorem-s\s?}}/g,lorem.s).replace(/\s?{{\s?lorem-m\s?}}/g,lorem.m).replace(/\s?{{\s?lorem-l\s?}}/g,lorem.l)}},{key:"highlightedMarkup",value:function(){return _prismjs2.default.highlight(this.markup(),_prismjs2.default.languages.markup)}},{key:"snippet",value:function(){if(!this.props.hideMarkup)return _react2.default.createElement(_CodeSnippet2.default,null,this.highlightedMarkup())}},{key:"title",value:function(){if(this.props.showTitle){var name=this.props.modifier?this.props.modifier.className:"Default",description=this.props.modifier&&this.props.modifier.description;return _react2.default.createElement("div",{className:"c-markup__header"},_react2.default.createElement("h4",{className:"ds-u-font-size--h5 ds-u-margin-bottom--0"},"Modifier: ",_react2.default.createElement("code",null,name)),_react2.default.createElement("p",{className:"ds-u-margin-bottom--1 ds-u-margin-top--0 ds-u-color--muted",dangerouslySetInnerHTML:{__html:description}}))}}},{key:"render",value:function(){var markup=this.markup();return _react2.default.createElement("div",{className:"markup markup--html"},this.title(),_react2.default.createElement("div",{className:"ds-u-border--1 ds-u-padding--1",dangerouslySetInnerHTML:{__html:markup}}),this.snippet())}}]),HTMLExample}(_react2.default.PureComponent);HTMLExample.propTypes={hideMarkup:_propTypes2.default.bool,markup:_propTypes2.default.string.isRequired,modifier:_propTypes2.default.shape({className:_propTypes2.default.string,description:_propTypes2.default.string,name:_propTypes2.default.string.isRequired}),showTitle:_propTypes2.default.bool},HTMLExample.defaultProps={showTitle:!0},exports.default=HTMLExample},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _react=__webpack_require__(10),_react2=function(obj){return obj&&obj.__esModule?obj:{default:obj}}(_react),Header=function(){return _react2.default.createElement("header",{className:"ds-base--inverse ds-u-padding--3"},_react2.default.createElement("h1",{className:"ds-h3"},"CMS.gov Design System"))};exports.default=Header},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function expandSelectedItems(items,selectedId){return items=[].concat(items),items.some(function(item){if(item.id===selectedId||isParentOfSelectedChild(item.items,selectedId))return item.defaultCollapsed=!1,!0}),items}function isParentOfSelectedChild(items,selectedId){return!(!items||!items.length)&&items.some(function(item){return item.id===selectedId})}Object.defineProperty(exports,"__esModule",{value:!0});var _propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_designSystemCore=__webpack_require__(85),Nav=function(props){return _react2.default.createElement("nav",{className:"l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2"},_react2.default.createElement(_designSystemCore.VerticalNav,{className:"c-nav__list",items:expandSelectedItems(props.items,props.selectedId),selectedId:props.selectedId}))};Nav.propTypes={items:_propTypes2.default.arrayOf(_propTypes2.default.object).isRequired,selectedId:_propTypes2.default.string.isRequired},exports.default=Nav},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}function isGuidanceSection(section){return Boolean(section.reference.match(/\.guidance([a-z-_]+)?$/i))}Object.defineProperty(exports,"__esModule",{value:!0});var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_PageBlock=__webpack_require__(154),_PageBlock2=_interopRequireDefault(_PageBlock),_PageHeader=__webpack_require__(155),_PageHeader2=_interopRequireDefault(_PageHeader),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_designSystemCore=__webpack_require__(85),Page=function(_React$PureComponent){function Page(props){_classCallCheck(this,Page);var _this=_possibleConstructorReturn(this,(Page.__proto__||Object.getPrototypeOf(Page)).call(this,props));return _this.hasTabs=_this.props.sections.length&&_this.props.depth>=2,_this}return _inherits(Page,_React$PureComponent),_createClass(Page,[{key:"defaultSelectedTabId",value:function(){return this.guidanceSections().length&&"undefined"!=typeof window&&"#guidance"===window.location.hash?"guidance":"usage"}},{key:"usageSections",value:function(){return this.props.sections.filter(function(s){return!isGuidanceSection(s)})}},{key:"guidanceSections",value:function(){return this.props.sections.filter(isGuidanceSection)}},{key:"renderChildPageBlocks",value:function(sections){if(sections.length)return sections.map(function(section){return _react2.default.createElement(_PageBlock2.default,_extends({key:section.referenceURI},section))})}},{key:"renderBody",value:function(){return _react2.default.createElement(_PageBlock2.default,_extends({},this.props,{hideHeader:!0}))}},{key:"renderContent",value:function(){return this.hasTabs?_react2.default.createElement(_designSystemCore.Tabs,{defaultSelectedId:this.defaultSelectedTabId(),tablistClassName:"ds-u-padding-left--6 ds-u-fill--gray-lightest"},_react2.default.createElement(_designSystemCore.TabPanel,{className:"ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0",id:"usage",tab:"Usage"},this.renderBody(),this.renderChildPageBlocks(this.usageSections())),this.renderGuidanceTabPanel()):_react2.default.createElement("div",{className:"ds-u-border-top--1 ds-u-padding-x--6"},this.renderBody())}},{key:"renderGuidanceTabPanel",value:function(){var sections=this.guidanceSections();if(sections.length)return _react2.default.createElement(_designSystemCore.TabPanel,{className:"ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0",id:"guidance",tab:"Guidance"},this.renderChildPageBlocks(sections))}},{key:"render",value:function(){return _react2.default.createElement("div",null,_react2.default.createElement(_PageHeader2.default,this.props),this.renderContent())}}]),Page}(_react2.default.PureComponent);Page.defaultProps={depth:0,sections:[]},Page.propTypes={depth:_propTypes2.default.number,sections:_propTypes2.default.arrayOf(_propTypes2.default.shape(_PageBlock2.default.propTypes))},exports.default=Page},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_HTMLExample=__webpack_require__(150),_HTMLExample2=_interopRequireDefault(_HTMLExample),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_ReactComponentDoc=__webpack_require__(156),_ReactComponentDoc2=_interopRequireDefault(_ReactComponentDoc),_Source=__webpack_require__(77),_Source2=_interopRequireDefault(_Source),_reactComponentPath=__webpack_require__(78),_reactComponentPath2=_interopRequireDefault(_reactComponentPath),_reactDoc=__webpack_require__(314),PageBlock=function(_React$PureComponent){function PageBlock(){return _classCallCheck(this,PageBlock),_possibleConstructorReturn(this,(PageBlock.__proto__||Object.getPrototypeOf(PageBlock)).apply(this,arguments))}return _inherits(PageBlock,_React$PureComponent),_createClass(PageBlock,[{key:"markupExamples",value:function(){var _this2=this;if(this.props.markup){var modifierMarkup=void 0;return this.props.modifiers.length&&(modifierMarkup=this.props.modifiers.map(function(modifier){return _react2.default.createElement(_HTMLExample2.default,{key:modifier.name,hideMarkup:_this2.props.hideMarkup,markup:_this2.props.markup,modifier:modifier})})),_react2.default.createElement("section",{className:"ds-u-margin-top--3"},_react2.default.createElement(_HTMLExample2.default,{hideMarkup:this.props.hideMarkup,markup:this.props.markup,showTitle:!1}),modifierMarkup)}}},{key:"description",value:function(){if(this.props.description)return _react2.default.createElement("div",{className:"c-details ds-u-margin-top--2 ds-u-measure--wide",dangerouslySetInnerHTML:{__html:this.props.description}})}},{key:"header",value:function(){if(!this.props.hideHeader&&!this.props.header.match(/---/)){var source=this.props.reactComponent?_react2.default.createElement(_Source2.default,{reactComponent:this.props.reactComponent,source:this.props.source}):null;return _react2.default.createElement("div",null,_react2.default.createElement("h2",{className:"ds-h2",dangerouslySetInnerHTML:{__html:this.props.header},id:this.props.reference}),source)}}},{key:"packagePath",value:function(path){return"@cmsgov/design-system-"+path}},{key:"reactDoc",value:function(){if(this.props.reactComponent){var path=(0,_reactComponentPath2.default)(this.props.source.path,this.props.reactComponent),docs=_reactDoc[path+".jsx"];if(docs&&docs.length){var doc=docs[0];return _react2.default.createElement(_ReactComponentDoc2.default,{description:doc.description,displayName:doc.displayName,hideExample:this.props.hideExample,packagePath:this.packagePath(path),propDocs:doc.props})}}}},{key:"render",value:function(){return _react2.default.createElement("article",{className:"ds-u-margin-y--6 l-content"},this.header(),this.description(),this.markupExamples(),this.reactDoc())}}]),PageBlock}(_react2.default.PureComponent);PageBlock.propTypes={description:_propTypes2.default.string,header:_propTypes2.default.string.isRequired,hideExample:_propTypes2.default.bool,hideHeader:_propTypes2.default.bool,hideMarkup:_propTypes2.default.bool,markup:_propTypes2.default.string,modifiers:_propTypes2.default.arrayOf(_HTMLExample2.default.propTypes.modifier),reactComponent:_propTypes2.default.string,reference:_propTypes2.default.string,source:_Source2.default.propTypes.source},exports.default=PageBlock},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_Source=__webpack_require__(77),_Source2=_interopRequireDefault(_Source),_classnames=__webpack_require__(185),_classnames2=_interopRequireDefault(_classnames),PageHeader=function(_React$PureComponent){function PageHeader(){return _classCallCheck(this,PageHeader),_possibleConstructorReturn(this,(PageHeader.__proto__||Object.getPrototypeOf(PageHeader)).apply(this,arguments))}return _inherits(PageHeader,_React$PureComponent),_createClass(PageHeader,[{key:"uswdsLink",value:function(){if(this.props.uswdsUrl)return _react2.default.createElement("p",null,_react2.default.createElement("a",{href:this.props.uswdsUrl},"US Web Design Standard"))}},{key:"statusPill",value:function(){if(this.props.status){var classes=(0,_classnames2.default)("ds-c-badge ds-u-float--right ds-u-margin-top--2 ds-u-text-transform--capitalize",{"ds-c-badge--success":"recommended"===this.props.status,"ds-c-badge--warn":"beta"===this.props.status,"ds-c-badge--alert":"alpha"===this.props.status});return _react2.default.createElement("span",{className:classes},this.props.status)}}},{key:"render",value:function(){return _react2.default.createElement("heading",{className:"ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest"},this.statusPill(),_react2.default.createElement("h1",{className:"ds-display",dangerouslySetInnerHTML:{__html:this.props.header},id:this.props.reference}),_react2.default.createElement("div",{className:"ds-u-clearfix"}),_react2.default.createElement(_Source2.default,{reactComponent:this.props.reactComponent,source:this.props.source}),this.uswdsLink())}}]),PageHeader}(_react2.default.PureComponent);PageHeader.propTypes={header:_propTypes2.default.string.isRequired,reactComponent:_Source2.default.propTypes.reactComponent,reference:_propTypes2.default.string,source:_Source2.default.propTypes.source,status:_propTypes2.default.string,uswdsUrl:_propTypes2.default.string},exports.default=PageHeader},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_ReactComponentExample=__webpack_require__(157),_ReactComponentExample2=_interopRequireDefault(_ReactComponentExample),_ReactPropDocs=__webpack_require__(159),_ReactPropDocs2=_interopRequireDefault(_ReactPropDocs),ReactComponentDoc=function(_React$PureComponent){function ReactComponentDoc(){return _classCallCheck(this,ReactComponentDoc),_possibleConstructorReturn(this,(ReactComponentDoc.__proto__||Object.getPrototypeOf(ReactComponentDoc)).apply(this,arguments))}return _inherits(ReactComponentDoc,_React$PureComponent),_createClass(ReactComponentDoc,[{key:"renderExample",value:function(){if(!this.props.hideExample){var renderComponent=__webpack_require__(184)("./"+this.props.packagePath+".example.jsx").default;return _react2.default.createElement(_ReactComponentExample2.default,{renderComponent:renderComponent})}}},{key:"render",value:function(){return _react2.default.createElement("section",null,_react2.default.createElement("div",{className:"c-details ds-u-margin-y--2 ds-u-measure--wide",dangerouslySetInnerHTML:{__html:this.props.description}}),this.renderExample(),_react2.default.createElement("h3",null,"Props"),_react2.default.createElement(_ReactPropDocs2.default,{propDocs:this.props.propDocs}))}}]),ReactComponentDoc}(_react2.default.PureComponent);ReactComponentDoc.propTypes={description:_propTypes2.default.string,hideExample:_propTypes2.default.bool,packagePath:_propTypes2.default.string.isRequired,propDocs:_propTypes2.default.object},exports.default=ReactComponentDoc},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_CodeSnippet=__webpack_require__(76),_CodeSnippet2=_interopRequireDefault(_CodeSnippet),_prismjs=__webpack_require__(99),_prismjs2=_interopRequireDefault(_prismjs),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_reactElementToJsxString=__webpack_require__(298),_reactElementToJsxString2=_interopRequireDefault(_reactElementToJsxString);__webpack_require__(224);var ReactComponentExample=function(_React$PureComponent){function ReactComponentExample(){return _classCallCheck(this,ReactComponentExample),_possibleConstructorReturn(this,(ReactComponentExample.__proto__||Object.getPrototypeOf(ReactComponentExample)).apply(this,arguments))}return _inherits(ReactComponentExample,_React$PureComponent),_createClass(ReactComponentExample,[{key:"highlightedMarkup",value:function(){var markup=(0,_reactElementToJsxString2.default)(this.props.renderComponent(),{showDefaultProps:!1,showFunctions:!0});return _prismjs2.default.highlight(markup,_prismjs2.default.languages.jsx)}},{key:"render",value:function(){return _react2.default.createElement("div",{className:"markup markup--react"},_react2.default.createElement("div",{className:"ds-u-border--1 ds-u-padding--1"},this.props.renderComponent()),_react2.default.createElement(_CodeSnippet2.default,{language:"jsx"},this.highlightedMarkup()))}}]),ReactComponentExample}(_react2.default.PureComponent);ReactComponentExample.propTypes={renderComponent:_propTypes2.default.func.isRequired},exports.default=ReactComponentExample},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),ReactPropDoc=function(_React$PureComponent){function ReactPropDoc(){return _classCallCheck(this,ReactPropDoc),_possibleConstructorReturn(this,(ReactPropDoc.__proto__||Object.getPrototypeOf(ReactPropDoc)).apply(this,arguments))}return _inherits(ReactPropDoc,_React$PureComponent),_createClass(ReactPropDoc,[{key:"defaultValue",value:function(){if(this.props.defaultValue)return _react2.default.createElement("code",null,this.props.defaultValue.value)}},{key:"description",value:function(){if(this.props.description)return _react2.default.createElement("div",{dangerouslySetInnerHTML:{__html:this.props.description}})}},{key:"isRequired",value:function(){if(this.props.required)return _react2.default.createElement("p",null,_react2.default.createElement("span",{className:"ds-c-badge ds-u-bg-gray-dark"},"Required"))}},{key:"shape",value:function(){var values=this.props.type.value;if(values&&void 0===values.length)return Object.getOwnPropertyNames(values.value).join(", ")}},{key:"type",value:function(){var propType=this.props.type.name,validValues=this.validValues();if("arrayOf"===propType){var valueType=this.props.type.value.name;return"shape"===valueType&&(valueType=this.props.type.value.computed?this.props.type.value.value:"{"+this.shape()+"}"),propType+"["+valueType+"]"}return validValues||propType}},{key:"validValues",value:function(){var _this2=this,values=this.props.type.value;if(values&&void 0!==values.length)return values.map(function(v){return"enum"===_this2.props.type.name?v.value:v.name}).join(", ")}},{key:"render",value:function(){return _react2.default.createElement("tr",null,_react2.default.createElement("td",null,_react2.default.createElement("code",{className:"ds-u-font-weight--bold"},this.props.name),this.isRequired()),_react2.default.createElement("td",null,_react2.default.createElement("code",null,this.type())),_react2.default.createElement("td",null,this.defaultValue()),_react2.default.createElement("td",null,this.description()))}}]),ReactPropDoc}(_react2.default.PureComponent);ReactPropDoc.propTypes={defaultValue:_propTypes2.default.shape({value:_propTypes2.default.string}),description:_propTypes2.default.string,name:_propTypes2.default.string,required:_propTypes2.default.bool.isRequired,type:_propTypes2.default.shape({name:_propTypes2.default.string.isRequired,value:_propTypes2.default.oneOfType([_propTypes2.default.arrayOf(_propTypes2.default.shape({computed:_propTypes2.default.bool,name:_propTypes2.default.string,value:_propTypes2.default.string})),_propTypes2.default.object])})},exports.default=ReactPropDoc},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(13),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_ReactPropDoc=__webpack_require__(158),_ReactPropDoc2=_interopRequireDefault(_ReactPropDoc),ReactPropDocs=function(_React$PureComponent){function ReactPropDocs(){return _classCallCheck(this,ReactPropDocs),_possibleConstructorReturn(this,(ReactPropDocs.__proto__||Object.getPrototypeOf(ReactPropDocs)).apply(this,arguments))}return _inherits(ReactPropDocs,_React$PureComponent),_createClass(ReactPropDocs,[{key:"rows",value:function(){var _this2=this;return Object.getOwnPropertyNames(this.props.propDocs).map(function(prop){return"children"===prop||prop.match(/^_/)?null:_react2.default.createElement(_ReactPropDoc2.default,_extends({key:prop,name:prop},_this2.props.propDocs[prop]))})}},{key:"render",value:function(){return _react2.default.createElement("table",{className:"ds-c-table"},_react2.default.createElement("thead",null,_react2.default.createElement("tr",null,_react2.default.createElement("td",null,"Name"),_react2.default.createElement("td",null,"Type"),_react2.default.createElement("td",null,"Default"),_react2.default.createElement("td",null,"Description"))),_react2.default.createElement("tbody",null,this.rows()))}}]),ReactPropDocs}(_react2.default.PureComponent);ReactPropDocs.propTypes={propDocs:_propTypes2.default.object},exports.default=ReactPropDocs},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Alert=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Alert=exports.Alert=function(_React$PureComponent){function Alert(){return _classCallCheck(this,Alert),_possibleConstructorReturn(this,(Alert.__proto__||Object.getPrototypeOf(Alert)).apply(this,arguments))}return _inherits(Alert,_React$PureComponent),_createClass(Alert,[{key:"heading",value:function(){if(this.props.heading)return _react2.default.createElement("h3",{className:"ds-c-alert__heading"},this.props.heading)}},{key:"render",value:function(){var classes=(0,_classnames2.default)("ds-c-alert",this.props.variation&&"ds-c-alert--"+this.props.variation,this.props.className);return _react2.default.createElement("div",{className:classes,role:this.props.role},_react2.default.createElement("div",{className:"ds-c-alert__body"},this.heading(),this.props.children))}}]),Alert}(_react2.default.PureComponent);Alert.propTypes={children:_propTypes2.default.node.isRequired,heading:_propTypes2.default.string,role:_propTypes2.default.oneOf(["alert","alertdialog"]),variation:_propTypes2.default.oneOf(["error","warn","success"])},exports.default=Alert},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Badge=void 0;var _propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),Badge=exports.Badge=function(props){return _react2.default.createElement("span",{className:"ds-c-badge"},props.children)};Badge.propTypes={children:_propTypes2.default.oneOfType([_propTypes2.default.node,_propTypes2.default.string]).isRequired},exports.default=Badge},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Button=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Button=exports.Button=function(_React$PureComponent){function Button(){return _classCallCheck(this,Button),_possibleConstructorReturn(this,(Button.__proto__||Object.getPrototypeOf(Button)).apply(this,arguments))}return _inherits(Button,_React$PureComponent),_createClass(Button,[{key:"attrs",value:function(){var _props=this.props,props=(_props.className,_props.component,_props.inverse,_props.onClick,_props.size,_props.variation,_objectWithoutProperties(_props,["className","component","inverse","onClick","size","variation"])),attrs=_extends({className:this.classNames()},props);return this.props.onClick&&(attrs.onClick=this.handleClick.bind(this)),attrs}},{key:"classNames",value:function(){var variationClass=this.props.variation&&"ds-c-button--"+this.props.variation,disabledClass=this.props.disabled&&"ds-c-button--disabled";return this.props.inverse&&(disabledClass?disabledClass+="-inverse":variationClass?variationClass+="-inverse":variationClass="ds-c-button--inverse"),(0,_classnames2.default)("ds-c-button",disabledClass,!disabledClass&&variationClass,this.props.size&&"ds-c-button--"+this.props.size,this.props.className)}},{key:"handleClick",value:function(e){this.props.disabled||this.props.onClick(e)}},{key:"render",value:function(){var attrs=this.attrs(),ComponentType="button";return this.props.component?ComponentType=this.props.component:this.props.href&&(ComponentType="a",delete attrs.disabled,delete attrs.type),_react2.default.createElement(ComponentType,attrs,this.props.children)}}]),Button}(_react2.default.PureComponent);Button.defaultProps={type:"button"},Button.propTypes={children:_propTypes2.default.node.isRequired,className:_propTypes2.default.string,component:_propTypes2.default.oneOfType([_propTypes2.default.element,_propTypes2.default.func]),disabled:_propTypes2.default.bool,href:_propTypes2.default.string,inverse:_propTypes2.default.bool,onClick:_propTypes2.default.func,size:_propTypes2.default.oneOf(["small","big"]),type:_propTypes2.default.oneOf(["button","submit"]),variation:_propTypes2.default.oneOf(["primary","danger","success","transparent"])},exports.default=Button},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)keys.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.ChoiceList=void 0;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_Choice=__webpack_require__(79),_Choice2=_interopRequireDefault(_Choice),_FormLabel=__webpack_require__(47),_FormLabel2=_interopRequireDefault(_FormLabel),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_Select=__webpack_require__(80),_Select2=_interopRequireDefault(_Select),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),ChoiceList=exports.ChoiceList=function(_React$PureComponent){function ChoiceList(){return _classCallCheck(this,ChoiceList),_possibleConstructorReturn(this,(ChoiceList.__proto__||Object.getPrototypeOf(ChoiceList)).apply(this,arguments))}return _inherits(ChoiceList,_React$PureComponent),_createClass(ChoiceList,[{key:"field",value:function(){var _this2=this,type=this.type(),ChoiceComponent="select"===type?"option":_Choice2.default,selectProps={},choices=this.props.choices.map(function(choice){var checked=choice.checked,defaultChecked=choice.defaultChecked,label=choice.label,props=_objectWithoutProperties(choice,["checked","defaultChecked","label"]);return"select"===type?(checked&&(selectProps.value=props.value),defaultChecked&&(selectProps.defaultValue=props.value)):(props.checked=checked,props.defaultChecked=defaultChecked,props.disabled=props.disabled||_this2.props.disabled,props.inversed=_this2.props.inversed,props.name=_this2.props.name,props.onBlur=_this2.props.onBlur,props.onChange=_this2.props.onChange,props.type=type),_react2.default.createElement(ChoiceComponent,_extends({key:choice.value},props),label)});return"select"===type?this.select(selectProps,choices):choices}},{key:"id",value:function(){if("select"===this.type())return this._id||(this._id=(0,_lodash2.default)("select_"+this.props.name+"_")),this._id}},{key:"select",value:function(selectProps,options){return _react2.default.createElement(_Select2.default,_extends({disabled:this.props.disabled,id:this.id(),inversed:this.props.inversed,name:this.props.name,onBlur:this.props.onBlur,onChange:this.props.onChange},selectProps),options)}},{key:"type",value:function(){return this.props.type?this.props.type:this.props.multiple||1===this.props.choices.length?"checkbox":this.props.choices.length>7?"select":"radio"}},{key:"render",value:function(){var type=this.type(),classes=(0,_classnames2.default)({"ds-c-fieldset":"select"!==type},this.props.className),RootComponent="select"===type?"div":"fieldset",FormLabelComponent="select"===type?"label":"legend";return _react2.default.createElement(RootComponent,{className:classes||null},_react2.default.createElement(_FormLabel2.default,{className:this.props.labelClassName,component:FormLabelComponent,errorMessage:this.props.errorMessage,fieldId:this.id(),hint:this.props.hint,inversed:this.props.inversed},this.props.label),this.field())}}]),ChoiceList}(_react2.default.PureComponent);ChoiceList.propTypes={choices:_propTypes2.default.arrayOf(_propTypes2.default.shape({checked:_Choice2.default.propTypes.checked,defaultChecked:_Choice2.default.propTypes.defaultChecked,disabled:_Choice2.default.propTypes.disabled,label:_Choice2.default.propTypes.children,value:_Choice2.default.propTypes.value})).isRequired,className:_propTypes2.default.string,disabled:_propTypes2.default.bool,errorMessage:_propTypes2.default.string,hint:_propTypes2.default.node,inversed:_propTypes2.default.bool,label:_propTypes2.default.node.isRequired,labelClassName:_propTypes2.default.string,multiple:_propTypes2.default.bool,name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,type:_propTypes2.default.oneOf(["checkbox","radio","select"])},exports.default=ChoiceList},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}function getDefaultSelectedId(props){var selectedId=void 0;return _react2.default.Children.forEach(props.children,function(child){isTabPanel(child)&&!selectedId&&(selectedId=child.props.id)}),selectedId}function panelTabId(panel){return panel.props.tabId||"ds-c-tabs__item--"+panel.props.id}function isTabPanel(child){return null!=child&&child.type===_TabPanel2.default}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Tabs=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_Tab=__webpack_require__(81),_Tab2=_interopRequireDefault(_Tab),_TabPanel=__webpack_require__(82),_TabPanel2=_interopRequireDefault(_TabPanel),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),Tabs=exports.Tabs=function(_React$PureComponent){function Tabs(props){_classCallCheck(this,Tabs);var _this=_possibleConstructorReturn(this,(Tabs.__proto__||Object.getPrototypeOf(Tabs)).call(this,props)),selectedId=void 0;return selectedId="defaultSelectedId"in props?props.defaultSelectedId:getDefaultSelectedId(props),_this.handleTabClick=_this.handleTabClick.bind(_this),_this.state={selectedId:selectedId},_this}return _inherits(Tabs,_React$PureComponent),_createClass(Tabs,[{key:"componentDidUpdate",value:function(_,prevState){"function"==typeof this.props.onChange&&this.state.selectedId!==prevState.selectedId&&this.props.onChange(this.state.selectedId,prevState.selectedId)}},{key:"handleTabClick",value:function(evt,panelId,tabId,href){evt.preventDefault(),this.setState({selectedId:panelId}),this.replaceState(href)}},{key:"panelChildren",value:function(){return _react2.default.Children.toArray(this.props.children).filter(isTabPanel)}},{key:"renderChildren",value:function(){var _this2=this;return _react2.default.Children.map(this.props.children,function(child){return isTabPanel(child)?_react2.default.cloneElement(child,{selected:_this2.state.selectedId===child.props.id,tab:void 0,tabHref:void 0,tabId:panelTabId(child)}):child})}},{key:"renderTabs",value:function(){var _this3=this,panels=this.panelChildren(),listClasses=(0,_classnames2.default)("ds-c-tabs",this.props.tablistClassName),tabs=panels.map(function(panel){return _react2.default.createElement(_Tab2.default,{className:panel.props.tabClassName,href:panel.props.tabHref,id:panelTabId(panel),key:panel.key,onClick:_this3.handleTabClick,panelId:panel.props.id,selected:_this3.state.selectedId===panel.props.id},panel.props.tab)});return _react2.default.createElement("div",{className:listClasses,role:"tablist"},tabs)}},{key:"replaceState",value:function(url){window.history&&window.history.replaceState({},document.title,url)}},{key:"render",value:function(){return _react2.default.createElement("div",null,this.renderTabs(),this.renderChildren())}}]),Tabs}(_react2.default.PureComponent);Tabs.propTypes={children:_propTypes2.default.node.isRequired,defaultSelectedId:_propTypes2.default.string,onChange:_propTypes2.default.func,tablistClassName:_propTypes2.default.string},exports.default=Tabs},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!call||"object"!=typeof call&&"function"!=typeof call?self:call}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.TextField=void 0;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_FormLabel=__webpack_require__(47),_FormLabel2=_interopRequireDefault(_FormLabel),_propTypes=__webpack_require__(5),_propTypes2=_interopRequireDefault(_propTypes),_react=__webpack_require__(3),_react2=_interopRequireDefault(_react),_classnames=__webpack_require__(6),_classnames2=_interopRequireDefault(_classnames),_lodash=__webpack_require__(16),_lodash2=_interopRequireDefault(_lodash),TextField=exports.TextField=function(_React$PureComponent){function TextField(props){_classCallCheck(this,TextField);var _this=_possibleConstructorReturn(this,(TextField.__proto__||Object.getPrototypeOf(TextField)).call(this,props));return _this.id=(0,_lodash2.default)("textfield_"),_this}return _inherits(TextField,_React$PureComponent),_createClass(TextField,[{key:"render",value:function(){var FieldComponent=this.props.multiline?"textarea":"input",rows=this.props.multiline&&this.props.rows?this.props.rows:void 0,classes=(0,_classnames2.default)("ds-u-clearfix",this.props.className),fieldClasses=(0,_classnames2.default)("ds-c-field",{"ds-c-field--error":"string"==typeof this.props.errorMessage,"ds-c-field--inverse":this.props.inversed},this.props.fieldClassName);return _react2.default.createElement("div",{className:classes},_react2.default.createElement(_FormLabel2.default,{className:this.props.labelClassName,errorMessage:this.props.errorMessage,fieldId:this.id,hint:this.props.hint,inversed:this.props.inversed},this.props.label),_react2.default.createElement(FieldComponent,{className:fieldClasses,defaultValue:this.props.defaultValue,disabled:this.props.disabled,id:this.id,name:this.props.name,onChange:this.props.onChange,onBlur:this.props.onBlur,rows:rows,type:this.props.multiline?void 0:this.props.type,value:this.props.value}))}}]),TextField}(_react2.default.PureComponent);TextField.defaultProps={type:"text"},TextField.propTypes={className:_propTypes2.default.string,defaultValue:_propTypes2.default.string,disabled:_propTypes2.default.bool,errorMessage:_propTypes2.default.string,fieldClassName:_propTypes2.default.string,hint:_propTypes2.default.node,inversed:_propTypes2.default.bool,label:_propTypes2.default.node.isRequired,labelClassName:_propTypes2.default.string,multiline:_propTypes2.default.bool,name:_propTypes2.default.string.isRequired,onBlur:_propTypes2.default.func,onChange:_propTypes2.default.func,rows:_propTypes2.default.oneOfType([_propTypes2.default.number,_propTypes2.default.string]),type:_propTypes2.default.string,value:_propTypes2.default.string},exports.default=TextField},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _Alert=__webpack_require__(160);Object.keys(_Alert).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Alert[key]}})});var _Badge=__webpack_require__(161);Object.keys(_Badge).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Badge[key]}})});var _Button=__webpack_require__(162);Object.keys(_Button).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Button[key]}})});var _Choice=__webpack_require__(79);Object.keys(_Choice).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Choice[key]}})});var _ChoiceList=__webpack_require__(163);Object.keys(_ChoiceList).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _ChoiceList[key]}})});var _Select=__webpack_require__(80);Object.keys(_Select).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Select[key]}})});var _FormLabel=__webpack_require__(47);Object.keys(_FormLabel).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _FormLabel[key]}})});var _Tab=__webpack_require__(81);Object.keys(_Tab).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Tab[key]}})});var _Tabs=__webpack_require__(164);Object.keys(_Tabs).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _Tabs[key]}})});var _TabPanel=__webpack_require__(82);Object.keys(_TabPanel).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _TabPanel[key]}})});var _TextField=__webpack_require__(165);Object.keys(_TextField).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _TextField[key]}})});var _VerticalNav=__webpack_require__(83);Object.keys(_VerticalNav).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _VerticalNav[key]}})});var _VerticalNavItem=__webpack_require__(84);Object.keys(_VerticalNavItem).forEach(function(key){"default"!==key&&"__esModule"!==key&&Object.defineProperty(exports,key,{enumerable:!0,get:function(){return _VerticalNavItem[key]}})})},function(module,exports,__webpack_require__){"use strict";(function(process){function identity(fn){return fn}function factory(ReactComponent,isValidElement,ReactNoopUpdateQueue){function validateTypeDef(Constructor,typeDef,location){for(var propName in typeDef)typeDef.hasOwnProperty(propName)&&"production"!==process.env.NODE_ENV&&warning("function"==typeof typeDef[propName],"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",Constructor.displayName||"ReactClass",ReactPropTypeLocationNames[location],propName)}function validateMethodOverride(isAlreadyDefined,name){var specPolicy=ReactClassInterface.hasOwnProperty(name)?ReactClassInterface[name]:null;ReactClassMixin.hasOwnProperty(name)&&_invariant("OVERRIDE_BASE"===specPolicy,"ReactClassInterface: You are attempting to override `%s` from your class specification. Ensure that your method names do not overlap with React methods.",name),isAlreadyDefined&&_invariant("DEFINE_MANY"===specPolicy||"DEFINE_MANY_MERGED"===specPolicy,"ReactClassInterface: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",name)}function mixSpecIntoComponent(Constructor,spec){if(spec){_invariant("function"!=typeof spec,"ReactClass: You're attempting to use a component class or function as a mixin. Instead, just use a regular object."),_invariant(!isValidElement(spec),"ReactClass: You're attempting to use a component as a mixin. Instead, just use a regular object.");var proto=Constructor.prototype,autoBindPairs=proto.__reactAutoBindPairs;spec.hasOwnProperty(MIXINS_KEY)&&RESERVED_SPEC_KEYS.mixins(Constructor,spec.mixins);for(var name in spec)if(spec.hasOwnProperty(name)&&name!==MIXINS_KEY){var property=spec[name],isAlreadyDefined=proto.hasOwnProperty(name);if(validateMethodOverride(isAlreadyDefined,name),RESERVED_SPEC_KEYS.hasOwnProperty(name))RESERVED_SPEC_KEYS[name](Constructor,property);else{var isReactClassMethod=ReactClassInterface.hasOwnProperty(name),isFunction="function"==typeof property,shouldAutoBind=isFunction&&!isReactClassMethod&&!isAlreadyDefined&&!1!==spec.autobind;if(shouldAutoBind)autoBindPairs.push(name,property),proto[name]=property;else if(isAlreadyDefined){var specPolicy=ReactClassInterface[name];_invariant(isReactClassMethod&&("DEFINE_MANY_MERGED"===specPolicy||"DEFINE_MANY"===specPolicy),"ReactClass: Unexpected spec policy %s for key %s when mixing in component specs.",specPolicy,name),"DEFINE_MANY_MERGED"===specPolicy?proto[name]=createMergedResultFunction(proto[name],property):"DEFINE_MANY"===specPolicy&&(proto[name]=createChainedFunction(proto[name],property))}else proto[name]=property,"production"!==process.env.NODE_ENV&&"function"==typeof property&&spec.displayName&&(proto[name].displayName=spec.displayName+"_"+name)}}}else if("production"!==process.env.NODE_ENV){var typeofSpec=typeof spec,isMixinValid="object"===typeofSpec&&null!==spec;"production"!==process.env.NODE_ENV&&warning(isMixinValid,"%s: You're attempting to include a mixin that is either null or not an object. Check the mixins included by the component, as well as any mixins they include themselves. Expected object but got %s.",Constructor.displayName||"ReactClass",null===spec?null:typeofSpec)}}function mixStaticSpecIntoComponent(Constructor,statics){if(statics)for(var name in statics){var property=statics[name];if(statics.hasOwnProperty(name)){var isReserved=name in RESERVED_SPEC_KEYS;_invariant(!isReserved,'ReactClass: You are attempting to define a reserved property, `%s`, that shouldn\'t be on the "statics" key. Define it as an instance property instead; it will still be accessible on the constructor.',name);var isInherited=name in Constructor;_invariant(!isInherited,"ReactClass: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",name),Constructor[name]=property}}}function mergeIntoWithNoDuplicateKeys(one,two){_invariant(one&&two&&"object"==typeof one&&"object"==typeof two,"mergeIntoWithNoDuplicateKeys(): Cannot merge non-objects.");for(var key in two)two.hasOwnProperty(key)&&(_invariant(void 0===one[key],"mergeIntoWithNoDuplicateKeys(): Tried to merge two objects with the same key: `%s`. This conflict may be due to a mixin; in particular, this may be caused by two getInitialState() or getDefaultProps() methods returning objects with clashing keys.",key),one[key]=two[key]);return one}function createMergedResultFunction(one,two){return function(){var a=one.apply(this,arguments),b=two.apply(this,arguments);if(null==a)return b;if(null==b)return a;var c={};return mergeIntoWithNoDuplicateKeys(c,a),mergeIntoWithNoDuplicateKeys(c,b),c}}function createChainedFunction(one,two){return function(){one.apply(this,arguments),two.apply(this,arguments)}}function bindAutoBindMethod(component,method){var boundMethod=method.bind(component);if("production"!==process.env.NODE_ENV){boundMethod.__reactBoundContext=component,boundMethod.__reactBoundMethod=method,boundMethod.__reactBoundArguments=null;var componentName=component.constructor.displayName,_bind=boundMethod.bind;boundMethod.bind=function(newThis){for(var _len=arguments.length,args=Array(_len>1?_len-1:0),_key=1;_key<_len;_key++)args[_key-1]=arguments[_key];if(newThis!==component&&null!==newThis)"production"!==process.env.NODE_ENV&&warning(!1,"bind(): React component methods may only be bound to the component instance. See %s",componentName);else if(!args.length)return"production"!==process.env.NODE_ENV&&warning(!1,"bind(): You are binding a component method to the component. React does this for you automatically in a high-performance way, so you can safely remove this call. See %s",componentName),boundMethod;var reboundMethod=_bind.apply(boundMethod,arguments);return reboundMethod.__reactBoundContext=component,reboundMethod.__reactBoundMethod=method,reboundMethod.__reactBoundArguments=args,reboundMethod}}return boundMethod}function bindAutoBindMethods(component){for(var pairs=component.__reactAutoBindPairs,i=0;i<pairs.length;i+=2){var autoBindKey=pairs[i],method=pairs[i+1];component[autoBindKey]=bindAutoBindMethod(component,method)}}function createClass(spec){var Constructor=identity(function(props,context,updater){"production"!==process.env.NODE_ENV&&warning(this instanceof Constructor,"Something is calling a React component directly. Use a factory or JSX instead. See: https://fb.me/react-legacyfactory"),this.__reactAutoBindPairs.length&&bindAutoBindMethods(this),this.props=props,this.context=context,this.refs=emptyObject,this.updater=updater||ReactNoopUpdateQueue,this.state=null;var initialState=this.getInitialState?this.getInitialState():null;"production"!==process.env.NODE_ENV&&void 0===initialState&&this.getInitialState._isMockFunction&&(initialState=null),_invariant("object"==typeof initialState&&!Array.isArray(initialState),"%s.getInitialState(): must return an object or null",Constructor.displayName||"ReactCompositeComponent"),this.state=initialState});Constructor.prototype=new ReactClassComponent,Constructor.prototype.constructor=Constructor,Constructor.prototype.__reactAutoBindPairs=[],injectedMixins.forEach(mixSpecIntoComponent.bind(null,Constructor)),mixSpecIntoComponent(Constructor,IsMountedPreMixin),mixSpecIntoComponent(Constructor,spec),mixSpecIntoComponent(Constructor,IsMountedPostMixin),Constructor.getDefaultProps&&(Constructor.defaultProps=Constructor.getDefaultProps()),"production"!==process.env.NODE_ENV&&(Constructor.getDefaultProps&&(Constructor.getDefaultProps.isReactClassApproved={}),Constructor.prototype.getInitialState&&(Constructor.prototype.getInitialState.isReactClassApproved={})),_invariant(Constructor.prototype.render,"createClass(...): Class specification must implement a `render` method."),"production"!==process.env.NODE_ENV&&(warning(!Constructor.prototype.componentShouldUpdate,"%s has a method called componentShouldUpdate(). Did you mean shouldComponentUpdate()? The name is phrased as a question because the function is expected to return a value.",spec.displayName||"A component"),warning(!Constructor.prototype.componentWillRecieveProps,"%s has a method called componentWillRecieveProps(). Did you mean componentWillReceiveProps()?",spec.displayName||"A component"));for(var methodName in ReactClassInterface)Constructor.prototype[methodName]||(Constructor.prototype[methodName]=null);return Constructor}var injectedMixins=[],ReactClassInterface={mixins:"DEFINE_MANY",statics:"DEFINE_MANY",propTypes:"DEFINE_MANY",contextTypes:"DEFINE_MANY",childContextTypes:"DEFINE_MANY",getDefaultProps:"DEFINE_MANY_MERGED",getInitialState:"DEFINE_MANY_MERGED",getChildContext:"DEFINE_MANY_MERGED",render:"DEFINE_ONCE",componentWillMount:"DEFINE_MANY",componentDidMount:"DEFINE_MANY",componentWillReceiveProps:"DEFINE_MANY",shouldComponentUpdate:"DEFINE_ONCE",componentWillUpdate:"DEFINE_MANY",componentDidUpdate:"DEFINE_MANY",componentWillUnmount:"DEFINE_MANY",updateComponent:"OVERRIDE_BASE"},RESERVED_SPEC_KEYS={displayName:function(Constructor,displayName){Constructor.displayName=displayName},mixins:function(Constructor,mixins){if(mixins)for(var i=0;i<mixins.length;i++)mixSpecIntoComponent(Constructor,mixins[i])},childContextTypes:function(Constructor,childContextTypes){"production"!==process.env.NODE_ENV&&validateTypeDef(Constructor,childContextTypes,"childContext"),Constructor.childContextTypes=_assign({},Constructor.childContextTypes,childContextTypes)},contextTypes:function(Constructor,contextTypes){"production"!==process.env.NODE_ENV&&validateTypeDef(Constructor,contextTypes,"context"),Constructor.contextTypes=_assign({},Constructor.contextTypes,contextTypes)},getDefaultProps:function(Constructor,getDefaultProps){Constructor.getDefaultProps?Constructor.getDefaultProps=createMergedResultFunction(Constructor.getDefaultProps,getDefaultProps):Constructor.getDefaultProps=getDefaultProps},propTypes:function(Constructor,propTypes){"production"!==process.env.NODE_ENV&&validateTypeDef(Constructor,propTypes,"prop"),Constructor.propTypes=_assign({},Constructor.propTypes,propTypes)},statics:function(Constructor,statics){mixStaticSpecIntoComponent(Constructor,statics)},autobind:function(){}},IsMountedPreMixin={componentDidMount:function(){this.__isMounted=!0}},IsMountedPostMixin={componentWillUnmount:function(){this.__isMounted=!1}},ReactClassMixin={replaceState:function(newState,callback){this.updater.enqueueReplaceState(this,newState,callback)},isMounted:function(){return"production"!==process.env.NODE_ENV&&(warning(this.__didWarnIsMounted,"%s: isMounted is deprecated. Instead, make sure to clean up subscriptions and pending requests in componentWillUnmount to prevent memory leaks.",this.constructor&&this.constructor.displayName||this.name||"Component"),this.__didWarnIsMounted=!0),!!this.__isMounted}},ReactClassComponent=function(){};return _assign(ReactClassComponent.prototype,ReactComponent.prototype,ReactClassMixin),createClass}var _assign=__webpack_require__(35),emptyObject=__webpack_require__(86),_invariant=__webpack_require__(15);if("production"!==process.env.NODE_ENV)var warning=__webpack_require__(19);var ReactPropTypeLocationNames,MIXINS_KEY="mixins";ReactPropTypeLocationNames="production"!==process.env.NODE_ENV?{prop:"prop",context:"context",childContext:"child context"}:{},module.exports=factory}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function checkPropTypes(typeSpecs,values,location,componentName,getStack){if("production"!==process.env.NODE_ENV)for(var typeSpecName in typeSpecs)if(typeSpecs.hasOwnProperty(typeSpecName)){var error;try{invariant("function"==typeof typeSpecs[typeSpecName],"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",componentName||"React class",location,typeSpecName),error=typeSpecs[typeSpecName](values,typeSpecName,componentName,location,null,ReactPropTypesSecret)}catch(ex){error=ex}if(warning(!error||error instanceof Error,"%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",componentName||"React class",location,typeSpecName,typeof error),error instanceof Error&&!(error.message in loggedTypeFailures)){loggedTypeFailures[error.message]=!0;var stack=getStack?getStack():"";warning(!1,"Failed %s type: %s%s",location,error.message,null!=stack?stack:"")}}}if("production"!==process.env.NODE_ENV)var invariant=__webpack_require__(15),warning=__webpack_require__(19),ReactPropTypesSecret=__webpack_require__(48),loggedTypeFailures={};module.exports=checkPropTypes}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var factory=__webpack_require__(87);module.exports=function(isValidElement){return factory(isValidElement,!1)}},function(module,exports,__webpack_require__){"use strict";var emptyFunction=__webpack_require__(34),invariant=__webpack_require__(15),ReactPropTypesSecret=__webpack_require__(48);module.exports=function(){function shim(props,propName,componentName,location,propFullName,secret){secret!==ReactPropTypesSecret&&invariant(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function getShim(){return shim}shim.isRequired=shim;var ReactPropTypes={array:shim,bool:shim,func:shim,number:shim,object:shim,string:shim,symbol:shim,any:shim,arrayOf:getShim,element:shim,instanceOf:getShim,node:shim,objectOf:getShim,oneOf:getShim,oneOfType:getShim,shape:getShim};return ReactPropTypes.checkPropTypes=emptyFunction,ReactPropTypes.PropTypes=ReactPropTypes,ReactPropTypes}},function(module,exports,__webpack_require__){"use strict";function escape(key){var escaperLookup={"=":"=0",":":"=2"};return"$"+(""+key).replace(/[=:]/g,function(match){return escaperLookup[match]})}function unescape(key){var unescapeRegex=/(=0|=2)/g,unescaperLookup={"=0":"=","=2":":"};return(""+("."===key[0]&&"$"===key[1]?key.substring(2):key.substring(1))).replace(unescapeRegex,function(match){return unescaperLookup[match]})}var KeyEscapeUtils={escape:escape,unescape:unescape};module.exports=KeyEscapeUtils},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(25),invariant=__webpack_require__(15),oneArgumentPooler=function(copyFieldsFrom){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,copyFieldsFrom),instance}return new Klass(copyFieldsFrom)},twoArgumentPooler=function(a1,a2){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2),instance}return new Klass(a1,a2)},threeArgumentPooler=function(a1,a2,a3){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2,a3),instance}return new Klass(a1,a2,a3)},fourArgumentPooler=function(a1,a2,a3,a4){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2,a3,a4),instance}return new Klass(a1,a2,a3,a4)},standardReleaser=function(instance){var Klass=this;instance instanceof Klass||("production"!==process.env.NODE_ENV?invariant(!1,"Trying to release an instance into a pool of a different type."):_prodInvariant("25")),instance.destructor(),Klass.instancePool.length<Klass.poolSize&&Klass.instancePool.push(instance)},DEFAULT_POOLER=oneArgumentPooler,addPoolingTo=function(CopyConstructor,pooler){var NewKlass=CopyConstructor;return NewKlass.instancePool=[],NewKlass.getPooled=pooler||DEFAULT_POOLER,NewKlass.poolSize||(NewKlass.poolSize=10),NewKlass.release=standardReleaser,NewKlass},PooledClass={addPoolingTo:addPoolingTo,oneArgumentPooler:oneArgumentPooler,twoArgumentPooler:twoArgumentPooler,threeArgumentPooler:threeArgumentPooler,fourArgumentPooler:fourArgumentPooler};module.exports=PooledClass}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var _assign=__webpack_require__(35),ReactBaseClasses=__webpack_require__(88),ReactChildren=__webpack_require__(174),ReactDOMFactories=__webpack_require__(175),ReactElement=__webpack_require__(22),ReactPropTypes=__webpack_require__(177),ReactVersion=__webpack_require__(179),createReactClass=__webpack_require__(181),onlyChild=__webpack_require__(182),createElement=ReactElement.createElement,createFactory=ReactElement.createFactory,cloneElement=ReactElement.cloneElement;if("production"!==process.env.NODE_ENV){var lowPriorityWarning=__webpack_require__(50),canDefineProperty=__webpack_require__(37),ReactElementValidator=__webpack_require__(90),didWarnPropTypesDeprecated=!1;createElement=ReactElementValidator.createElement,createFactory=ReactElementValidator.createFactory,cloneElement=ReactElementValidator.cloneElement}var __spread=_assign,createMixin=function(mixin){return mixin};if("production"!==process.env.NODE_ENV){var warnedForSpread=!1,warnedForCreateMixin=!1;__spread=function(){return lowPriorityWarning(warnedForSpread,"React.__spread is deprecated and should not be used. Use Object.assign directly or another helper function with similar semantics. You may be seeing this warning due to your compiler. See https://fb.me/react-spread-deprecation for more details."),warnedForSpread=!0,_assign.apply(null,arguments)},createMixin=function(mixin){return lowPriorityWarning(warnedForCreateMixin,"React.createMixin is deprecated and should not be used. In React v16.0, it will be removed. You can use this mixin directly instead. See https://fb.me/createmixin-was-never-implemented for more info."),warnedForCreateMixin=!0,mixin}}var React={Children:{map:ReactChildren.map,forEach:ReactChildren.forEach,count:ReactChildren.count,toArray:ReactChildren.toArray,only:onlyChild},Component:ReactBaseClasses.Component,PureComponent:ReactBaseClasses.PureComponent,createElement:createElement,cloneElement:cloneElement,isValidElement:ReactElement.isValidElement,PropTypes:ReactPropTypes,createClass:createReactClass,createFactory:createFactory,createMixin:createMixin,DOM:ReactDOMFactories,version:ReactVersion,__spread:__spread};if("production"!==process.env.NODE_ENV){var warnedForCreateClass=!1;canDefineProperty&&(Object.defineProperty(React,"PropTypes",{get:function(){return lowPriorityWarning(didWarnPropTypesDeprecated,"Accessing PropTypes via the main React package is deprecated, and will be removed in  React v16.0. Use the latest available v15.* prop-types package from npm instead. For info on usage, compatibility, migration and more, see https://fb.me/prop-types-docs"),didWarnPropTypesDeprecated=!0,ReactPropTypes}}),Object.defineProperty(React,"createClass",{get:function(){return lowPriorityWarning(warnedForCreateClass,"Accessing createClass via the main React package is deprecated, and will be removed in React v16.0. Use a plain JavaScript class instead. If you're not yet ready to migrate, create-react-class v15.* is available on npm as a temporary, drop-in replacement. For more info see https://fb.me/react-create-class"),warnedForCreateClass=!0,createReactClass}})),React.DOM={};var warnedForFactories=!1;Object.keys(ReactDOMFactories).forEach(function(factory){React.DOM[factory]=function(){return warnedForFactories||(lowPriorityWarning(!1,"Accessing factories like React.DOM.%s has been deprecated and will be removed in v16.0+. Use the react-dom-factories package instead.  Version 1.0 provides a drop-in replacement. For more info, see https://fb.me/react-dom-factories",factory),warnedForFactories=!0),ReactDOMFactories[factory].apply(ReactDOMFactories,arguments)}})}module.exports=React}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function escapeUserProvidedKey(text){return(""+text).replace(userProvidedKeyEscapeRegex,"$&/")}function ForEachBookKeeping(forEachFunction,forEachContext){this.func=forEachFunction,this.context=forEachContext,this.count=0}function forEachSingleChild(bookKeeping,child,name){var func=bookKeeping.func,context=bookKeeping.context;func.call(context,child,bookKeeping.count++)}function forEachChildren(children,forEachFunc,forEachContext){if(null==children)return children;var traverseContext=ForEachBookKeeping.getPooled(forEachFunc,forEachContext);traverseAllChildren(children,forEachSingleChild,traverseContext),ForEachBookKeeping.release(traverseContext)}function MapBookKeeping(mapResult,keyPrefix,mapFunction,mapContext){this.result=mapResult,this.keyPrefix=keyPrefix,this.func=mapFunction,this.context=mapContext,this.count=0}function mapSingleChildIntoContext(bookKeeping,child,childKey){var result=bookKeeping.result,keyPrefix=bookKeeping.keyPrefix,func=bookKeeping.func,context=bookKeeping.context,mappedChild=func.call(context,child,bookKeeping.count++);Array.isArray(mappedChild)?mapIntoWithKeyPrefixInternal(mappedChild,result,childKey,emptyFunction.thatReturnsArgument):null!=mappedChild&&(ReactElement.isValidElement(mappedChild)&&(mappedChild=ReactElement.cloneAndReplaceKey(mappedChild,keyPrefix+(!mappedChild.key||child&&child.key===mappedChild.key?"":escapeUserProvidedKey(mappedChild.key)+"/")+childKey)),result.push(mappedChild))}function mapIntoWithKeyPrefixInternal(children,array,prefix,func,context){var escapedPrefix="";null!=prefix&&(escapedPrefix=escapeUserProvidedKey(prefix)+"/");var traverseContext=MapBookKeeping.getPooled(array,escapedPrefix,func,context);traverseAllChildren(children,mapSingleChildIntoContext,traverseContext),MapBookKeeping.release(traverseContext)}function mapChildren(children,func,context){if(null==children)return children;var result=[];return mapIntoWithKeyPrefixInternal(children,result,null,func,context),result}function forEachSingleChildDummy(traverseContext,child,name){return null}function countChildren(children,context){return traverseAllChildren(children,forEachSingleChildDummy,null)}function toArray(children){var result=[];return mapIntoWithKeyPrefixInternal(children,result,null,emptyFunction.thatReturnsArgument),result}var PooledClass=__webpack_require__(172),ReactElement=__webpack_require__(22),emptyFunction=__webpack_require__(34),traverseAllChildren=__webpack_require__(183),twoArgumentPooler=PooledClass.twoArgumentPooler,fourArgumentPooler=PooledClass.fourArgumentPooler,userProvidedKeyEscapeRegex=/\/+/g;ForEachBookKeeping.prototype.destructor=function(){this.func=null,this.context=null,this.count=0},PooledClass.addPoolingTo(ForEachBookKeeping,twoArgumentPooler),MapBookKeeping.prototype.destructor=function(){this.result=null,this.keyPrefix=null,this.func=null,this.context=null,this.count=0},PooledClass.addPoolingTo(MapBookKeeping,fourArgumentPooler);var ReactChildren={forEach:forEachChildren,map:mapChildren,mapIntoWithKeyPrefixInternal:mapIntoWithKeyPrefixInternal,count:countChildren,toArray:toArray};module.exports=ReactChildren},function(module,exports,__webpack_require__){"use strict";(function(process){var ReactElement=__webpack_require__(22),createDOMFactory=ReactElement.createFactory;if("production"!==process.env.NODE_ENV){createDOMFactory=__webpack_require__(90).createFactory}var ReactDOMFactories={a:createDOMFactory("a"),abbr:createDOMFactory("abbr"),address:createDOMFactory("address"),area:createDOMFactory("area"),article:createDOMFactory("article"),aside:createDOMFactory("aside"),audio:createDOMFactory("audio"),b:createDOMFactory("b"),base:createDOMFactory("base"),bdi:createDOMFactory("bdi"),bdo:createDOMFactory("bdo"),big:createDOMFactory("big"),blockquote:createDOMFactory("blockquote"),body:createDOMFactory("body"),br:createDOMFactory("br"),button:createDOMFactory("button"),canvas:createDOMFactory("canvas"),caption:createDOMFactory("caption"),cite:createDOMFactory("cite"),code:createDOMFactory("code"),col:createDOMFactory("col"),colgroup:createDOMFactory("colgroup"),data:createDOMFactory("data"),datalist:createDOMFactory("datalist"),dd:createDOMFactory("dd"),del:createDOMFactory("del"),details:createDOMFactory("details"),dfn:createDOMFactory("dfn"),dialog:createDOMFactory("dialog"),div:createDOMFactory("div"),dl:createDOMFactory("dl"),dt:createDOMFactory("dt"),em:createDOMFactory("em"),embed:createDOMFactory("embed"),fieldset:createDOMFactory("fieldset"),figcaption:createDOMFactory("figcaption"),figure:createDOMFactory("figure"),footer:createDOMFactory("footer"),form:createDOMFactory("form"),h1:createDOMFactory("h1"),h2:createDOMFactory("h2"),h3:createDOMFactory("h3"),h4:createDOMFactory("h4"),h5:createDOMFactory("h5"),h6:createDOMFactory("h6"),head:createDOMFactory("head"),header:createDOMFactory("header"),hgroup:createDOMFactory("hgroup"),hr:createDOMFactory("hr"),html:createDOMFactory("html"),i:createDOMFactory("i"),iframe:createDOMFactory("iframe"),img:createDOMFactory("img"),input:createDOMFactory("input"),ins:createDOMFactory("ins"),kbd:createDOMFactory("kbd"),keygen:createDOMFactory("keygen"),label:createDOMFactory("label"),legend:createDOMFactory("legend"),li:createDOMFactory("li"),link:createDOMFactory("link"),main:createDOMFactory("main"),map:createDOMFactory("map"),mark:createDOMFactory("mark"),menu:createDOMFactory("menu"),menuitem:createDOMFactory("menuitem"),meta:createDOMFactory("meta"),meter:createDOMFactory("meter"),nav:createDOMFactory("nav"),noscript:createDOMFactory("noscript"),object:createDOMFactory("object"),ol:createDOMFactory("ol"),optgroup:createDOMFactory("optgroup"),option:createDOMFactory("option"),output:createDOMFactory("output"),p:createDOMFactory("p"),param:createDOMFactory("param"),picture:createDOMFactory("picture"),pre:createDOMFactory("pre"),progress:createDOMFactory("progress"),q:createDOMFactory("q"),rp:createDOMFactory("rp"),rt:createDOMFactory("rt"),ruby:createDOMFactory("ruby"),s:createDOMFactory("s"),samp:createDOMFactory("samp"),script:createDOMFactory("script"),section:createDOMFactory("section"),select:createDOMFactory("select"),small:createDOMFactory("small"),source:createDOMFactory("source"),span:createDOMFactory("span"),strong:createDOMFactory("strong"),style:createDOMFactory("style"),sub:createDOMFactory("sub"),summary:createDOMFactory("summary"),sup:createDOMFactory("sup"),table:createDOMFactory("table"),tbody:createDOMFactory("tbody"),td:createDOMFactory("td"),textarea:createDOMFactory("textarea"),tfoot:createDOMFactory("tfoot"),th:createDOMFactory("th"),thead:createDOMFactory("thead"),time:createDOMFactory("time"),title:createDOMFactory("title"),tr:createDOMFactory("tr"),track:createDOMFactory("track"),u:createDOMFactory("u"),ul:createDOMFactory("ul"),var:createDOMFactory("var"),video:createDOMFactory("video"),wbr:createDOMFactory("wbr"),circle:createDOMFactory("circle"),clipPath:createDOMFactory("clipPath"),defs:createDOMFactory("defs"),ellipse:createDOMFactory("ellipse"),g:createDOMFactory("g"),image:createDOMFactory("image"),line:createDOMFactory("line"),linearGradient:createDOMFactory("linearGradient"),mask:createDOMFactory("mask"),path:createDOMFactory("path"),pattern:createDOMFactory("pattern"),polygon:createDOMFactory("polygon"),polyline:createDOMFactory("polyline"),radialGradient:createDOMFactory("radialGradient"),rect:createDOMFactory("rect"),stop:createDOMFactory("stop"),svg:createDOMFactory("svg"),text:createDOMFactory("text"),tspan:createDOMFactory("tspan")};module.exports=ReactDOMFactories}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var ReactPropTypeLocationNames={};"production"!==process.env.NODE_ENV&&(ReactPropTypeLocationNames={prop:"prop",context:"context",childContext:"child context"}),module.exports=ReactPropTypeLocationNames}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var _require=__webpack_require__(22),isValidElement=_require.isValidElement,factory=__webpack_require__(169);module.exports=factory(isValidElement)},function(module,exports,__webpack_require__){"use strict";module.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(module,exports,__webpack_require__){"use strict";module.exports="15.6.1"},function(module,exports,__webpack_require__){"use strict";(function(process){function checkReactTypeSpec(typeSpecs,values,location,componentName,element,debugID){for(var typeSpecName in typeSpecs)if(typeSpecs.hasOwnProperty(typeSpecName)){var error;try{"function"!=typeof typeSpecs[typeSpecName]&&("production"!==process.env.NODE_ENV?invariant(!1,"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName):_prodInvariant("84",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName)),error=typeSpecs[typeSpecName](values,typeSpecName,componentName,location,null,ReactPropTypesSecret)}catch(ex){error=ex}if("production"!==process.env.NODE_ENV&&warning(!error||error instanceof Error,"%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName,typeof error),error instanceof Error&&!(error.message in loggedTypeFailures)){loggedTypeFailures[error.message]=!0;var componentStackInfo="";"production"!==process.env.NODE_ENV&&(ReactComponentTreeHook||(ReactComponentTreeHook=__webpack_require__(49)),null!==debugID?componentStackInfo=ReactComponentTreeHook.getStackAddendumByID(debugID):null!==element&&(componentStackInfo=ReactComponentTreeHook.getCurrentStackAddendum(element))),"production"!==process.env.NODE_ENV&&warning(!1,"Failed %s type: %s%s",location,error.message,componentStackInfo)}}}var ReactComponentTreeHook,_prodInvariant=__webpack_require__(25),ReactPropTypeLocationNames=__webpack_require__(176),ReactPropTypesSecret=__webpack_require__(178),invariant=__webpack_require__(15),warning=__webpack_require__(19);void 0!==process&&process.env&&"test"===process.env.NODE_ENV&&(ReactComponentTreeHook=__webpack_require__(49));var loggedTypeFailures={};module.exports=checkReactTypeSpec}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var _require=__webpack_require__(88),Component=_require.Component,_require2=__webpack_require__(22),isValidElement=_require2.isValidElement,ReactNoopUpdateQueue=__webpack_require__(91),factory=__webpack_require__(167);module.exports=factory(Component,isValidElement,ReactNoopUpdateQueue)},function(module,exports,__webpack_require__){"use strict";(function(process){function onlyChild(children){return ReactElement.isValidElement(children)||("production"!==process.env.NODE_ENV?invariant(!1,"React.Children.only expected to receive a single React element child."):_prodInvariant("143")),children}var _prodInvariant=__webpack_require__(25),ReactElement=__webpack_require__(22),invariant=__webpack_require__(15);module.exports=onlyChild}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function getComponentKey(component,index){return component&&"object"==typeof component&&null!=component.key?KeyEscapeUtils.escape(component.key):index.toString(36)}function traverseAllChildrenImpl(children,nameSoFar,callback,traverseContext){var type=typeof children;if("undefined"!==type&&"boolean"!==type||(children=null),null===children||"string"===type||"number"===type||"object"===type&&children.$$typeof===REACT_ELEMENT_TYPE)return callback(traverseContext,children,""===nameSoFar?SEPARATOR+getComponentKey(children,0):nameSoFar),1;var child,nextName,subtreeCount=0,nextNamePrefix=""===nameSoFar?SEPARATOR:nameSoFar+SUBSEPARATOR;if(Array.isArray(children))for(var i=0;i<children.length;i++)child=children[i],nextName=nextNamePrefix+getComponentKey(child,i),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext);else{var iteratorFn=getIteratorFn(children);if(iteratorFn){var step,iterator=iteratorFn.call(children);if(iteratorFn!==children.entries)for(var ii=0;!(step=iterator.next()).done;)child=step.value,nextName=nextNamePrefix+getComponentKey(child,ii++),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext);else{if("production"!==process.env.NODE_ENV){var mapsAsChildrenAddendum="";if(ReactCurrentOwner.current){var mapsAsChildrenOwnerName=ReactCurrentOwner.current.getName();mapsAsChildrenOwnerName&&(mapsAsChildrenAddendum=" Check the render method of `"+mapsAsChildrenOwnerName+"`.")}"production"!==process.env.NODE_ENV&&warning(didWarnAboutMaps,"Using Maps as children is not yet fully supported. It is an experimental feature that might be removed. Convert it to a sequence / iterable of keyed ReactElements instead.%s",mapsAsChildrenAddendum),didWarnAboutMaps=!0}for(;!(step=iterator.next()).done;){var entry=step.value;entry&&(child=entry[1],nextName=nextNamePrefix+KeyEscapeUtils.escape(entry[0])+SUBSEPARATOR+getComponentKey(child,0),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext))}}}else if("object"===type){var addendum="";if("production"!==process.env.NODE_ENV&&(addendum=" If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons.",children._isReactElement&&(addendum=" It looks like you're using an element created by a different version of React. Make sure to use only one copy of React."),ReactCurrentOwner.current)){var name=ReactCurrentOwner.current.getName();name&&(addendum+=" Check the render method of `"+name+"`.")}var childrenString=String(children);"production"!==process.env.NODE_ENV?invariant(!1,"Objects are not valid as a React child (found: %s).%s","[object Object]"===childrenString?"object with keys {"+Object.keys(children).join(", ")+"}":childrenString,addendum):_prodInvariant("31","[object Object]"===childrenString?"object with keys {"+Object.keys(children).join(", ")+"}":childrenString,addendum)}}return subtreeCount}function traverseAllChildren(children,callback,traverseContext){return null==children?0:traverseAllChildrenImpl(children,"",callback,traverseContext)}var _prodInvariant=__webpack_require__(25),ReactCurrentOwner=__webpack_require__(36),REACT_ELEMENT_TYPE=__webpack_require__(89),getIteratorFn=__webpack_require__(92),invariant=__webpack_require__(15),KeyEscapeUtils=__webpack_require__(171),warning=__webpack_require__(19),SEPARATOR=".",SUBSEPARATOR=":",didWarnAboutMaps=!1;module.exports=traverseAllChildren}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){function webpackContext(req){return __webpack_require__(webpackContextResolve(req))}function webpackContextResolve(req){var id=map[req];if(!(id+1))throw new Error("Cannot find module '"+req+"'.");return id}var map={"./@cmsgov/design-system-core/src/components/Alert/Alert.example.jsx":130,"./@cmsgov/design-system-core/src/components/Badge/Badge.example.jsx":132,"./@cmsgov/design-system-core/src/components/Button/Button.example.jsx":134,"./@cmsgov/design-system-core/src/components/ChoiceList/Choice.example.jsx":136,"./@cmsgov/design-system-core/src/components/ChoiceList/ChoiceList.example.jsx":137,"./@cmsgov/design-system-core/src/components/ChoiceList/Select.example.jsx":139,"./@cmsgov/design-system-core/src/components/Tabs/Tab.example.jsx":140,"./@cmsgov/design-system-core/src/components/Tabs/Tabs.example.jsx":141,"./@cmsgov/design-system-core/src/components/TextField/TextField.example.jsx":143,"./@cmsgov/design-system-core/src/components/VerticalNav/VerticalNav.example.jsx":145};webpackContext.keys=function(){return Object.keys(map)},webpackContext.resolve=webpackContextResolve,module.exports=webpackContext,webpackContext.id=184},function(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;/*!
+  Copyright (c) 2016 Jed Watson.
+  Licensed under the MIT License (MIT), see
+  http://jedwatson.github.io/classnames
+*/
+!function(){"use strict";function classNames(){for(var classes=[],i=0;i<arguments.length;i++){var arg=arguments[i];if(arg){var argType=typeof arg;if("string"===argType||"number"===argType)classes.push(arg);else if(Array.isArray(arg))classes.push(classNames.apply(null,arg));else if("object"===argType)for(var key in arg)hasOwn.call(arg,key)&&arg[key]&&classes.push(key)}}return classes.join(" ")}var hasOwn={}.hasOwnProperty;void 0!==module&&module.exports?module.exports=classNames:(__WEBPACK_AMD_DEFINE_ARRAY__=[],void 0!==(__WEBPACK_AMD_DEFINE_RESULT__=function(){return classNames}.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__))&&(module.exports=__WEBPACK_AMD_DEFINE_RESULT__))}()},function(module,exports,__webpack_require__){"use strict";function collapse(value){return String(value).replace(/\s+/g," ")}/**
  * @author Titus Wormer
  * @copyright 2015 Titus Wormer
  * @license MIT
@@ -35,16 +40,16 @@ function isEventSupported(eventNameSuffix,capture){if(!ExecutionEnvironment.canU
  * @fileoverview Replace multiple white-space characters
  *   with a single space.
  */
-module.exports=collapse},function(module,exports,__webpack_require__){"use strict";(function(process){function identity(fn){return fn}function factory(ReactComponent,isValidElement,ReactNoopUpdateQueue){function validateTypeDef(Constructor,typeDef,location){for(var propName in typeDef)typeDef.hasOwnProperty(propName)&&"production"!==process.env.NODE_ENV&&warning("function"==typeof typeDef[propName],"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",Constructor.displayName||"ReactClass",ReactPropTypeLocationNames[location],propName)}function validateMethodOverride(isAlreadyDefined,name){var specPolicy=ReactClassInterface.hasOwnProperty(name)?ReactClassInterface[name]:null;ReactClassMixin.hasOwnProperty(name)&&_invariant("OVERRIDE_BASE"===specPolicy,"ReactClassInterface: You are attempting to override `%s` from your class specification. Ensure that your method names do not overlap with React methods.",name),isAlreadyDefined&&_invariant("DEFINE_MANY"===specPolicy||"DEFINE_MANY_MERGED"===specPolicy,"ReactClassInterface: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",name)}function mixSpecIntoComponent(Constructor,spec){if(spec){_invariant("function"!=typeof spec,"ReactClass: You're attempting to use a component class or function as a mixin. Instead, just use a regular object."),_invariant(!isValidElement(spec),"ReactClass: You're attempting to use a component as a mixin. Instead, just use a regular object.");var proto=Constructor.prototype,autoBindPairs=proto.__reactAutoBindPairs;spec.hasOwnProperty(MIXINS_KEY)&&RESERVED_SPEC_KEYS.mixins(Constructor,spec.mixins);for(var name in spec)if(spec.hasOwnProperty(name)&&name!==MIXINS_KEY){var property=spec[name],isAlreadyDefined=proto.hasOwnProperty(name);if(validateMethodOverride(isAlreadyDefined,name),RESERVED_SPEC_KEYS.hasOwnProperty(name))RESERVED_SPEC_KEYS[name](Constructor,property);else{var isReactClassMethod=ReactClassInterface.hasOwnProperty(name),isFunction="function"==typeof property,shouldAutoBind=isFunction&&!isReactClassMethod&&!isAlreadyDefined&&!1!==spec.autobind;if(shouldAutoBind)autoBindPairs.push(name,property),proto[name]=property;else if(isAlreadyDefined){var specPolicy=ReactClassInterface[name];_invariant(isReactClassMethod&&("DEFINE_MANY_MERGED"===specPolicy||"DEFINE_MANY"===specPolicy),"ReactClass: Unexpected spec policy %s for key %s when mixing in component specs.",specPolicy,name),"DEFINE_MANY_MERGED"===specPolicy?proto[name]=createMergedResultFunction(proto[name],property):"DEFINE_MANY"===specPolicy&&(proto[name]=createChainedFunction(proto[name],property))}else proto[name]=property,"production"!==process.env.NODE_ENV&&"function"==typeof property&&spec.displayName&&(proto[name].displayName=spec.displayName+"_"+name)}}}else if("production"!==process.env.NODE_ENV){var typeofSpec=typeof spec,isMixinValid="object"===typeofSpec&&null!==spec;"production"!==process.env.NODE_ENV&&warning(isMixinValid,"%s: You're attempting to include a mixin that is either null or not an object. Check the mixins included by the component, as well as any mixins they include themselves. Expected object but got %s.",Constructor.displayName||"ReactClass",null===spec?null:typeofSpec)}}function mixStaticSpecIntoComponent(Constructor,statics){if(statics)for(var name in statics){var property=statics[name];if(statics.hasOwnProperty(name)){var isReserved=name in RESERVED_SPEC_KEYS;_invariant(!isReserved,'ReactClass: You are attempting to define a reserved property, `%s`, that shouldn\'t be on the "statics" key. Define it as an instance property instead; it will still be accessible on the constructor.',name);var isInherited=name in Constructor;_invariant(!isInherited,"ReactClass: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",name),Constructor[name]=property}}}function mergeIntoWithNoDuplicateKeys(one,two){_invariant(one&&two&&"object"==typeof one&&"object"==typeof two,"mergeIntoWithNoDuplicateKeys(): Cannot merge non-objects.");for(var key in two)two.hasOwnProperty(key)&&(_invariant(void 0===one[key],"mergeIntoWithNoDuplicateKeys(): Tried to merge two objects with the same key: `%s`. This conflict may be due to a mixin; in particular, this may be caused by two getInitialState() or getDefaultProps() methods returning objects with clashing keys.",key),one[key]=two[key]);return one}function createMergedResultFunction(one,two){return function(){var a=one.apply(this,arguments),b=two.apply(this,arguments);if(null==a)return b;if(null==b)return a;var c={};return mergeIntoWithNoDuplicateKeys(c,a),mergeIntoWithNoDuplicateKeys(c,b),c}}function createChainedFunction(one,two){return function(){one.apply(this,arguments),two.apply(this,arguments)}}function bindAutoBindMethod(component,method){var boundMethod=method.bind(component);if("production"!==process.env.NODE_ENV){boundMethod.__reactBoundContext=component,boundMethod.__reactBoundMethod=method,boundMethod.__reactBoundArguments=null;var componentName=component.constructor.displayName,_bind=boundMethod.bind;boundMethod.bind=function(newThis){for(var _len=arguments.length,args=Array(_len>1?_len-1:0),_key=1;_key<_len;_key++)args[_key-1]=arguments[_key];if(newThis!==component&&null!==newThis)"production"!==process.env.NODE_ENV&&warning(!1,"bind(): React component methods may only be bound to the component instance. See %s",componentName);else if(!args.length)return"production"!==process.env.NODE_ENV&&warning(!1,"bind(): You are binding a component method to the component. React does this for you automatically in a high-performance way, so you can safely remove this call. See %s",componentName),boundMethod;var reboundMethod=_bind.apply(boundMethod,arguments);return reboundMethod.__reactBoundContext=component,reboundMethod.__reactBoundMethod=method,reboundMethod.__reactBoundArguments=args,reboundMethod}}return boundMethod}function bindAutoBindMethods(component){for(var pairs=component.__reactAutoBindPairs,i=0;i<pairs.length;i+=2){var autoBindKey=pairs[i],method=pairs[i+1];component[autoBindKey]=bindAutoBindMethod(component,method)}}function createClass(spec){var Constructor=identity(function(props,context,updater){"production"!==process.env.NODE_ENV&&warning(this instanceof Constructor,"Something is calling a React component directly. Use a factory or JSX instead. See: https://fb.me/react-legacyfactory"),this.__reactAutoBindPairs.length&&bindAutoBindMethods(this),this.props=props,this.context=context,this.refs=emptyObject,this.updater=updater||ReactNoopUpdateQueue,this.state=null;var initialState=this.getInitialState?this.getInitialState():null;"production"!==process.env.NODE_ENV&&void 0===initialState&&this.getInitialState._isMockFunction&&(initialState=null),_invariant("object"==typeof initialState&&!Array.isArray(initialState),"%s.getInitialState(): must return an object or null",Constructor.displayName||"ReactCompositeComponent"),this.state=initialState});Constructor.prototype=new ReactClassComponent,Constructor.prototype.constructor=Constructor,Constructor.prototype.__reactAutoBindPairs=[],injectedMixins.forEach(mixSpecIntoComponent.bind(null,Constructor)),mixSpecIntoComponent(Constructor,IsMountedPreMixin),mixSpecIntoComponent(Constructor,spec),mixSpecIntoComponent(Constructor,IsMountedPostMixin),Constructor.getDefaultProps&&(Constructor.defaultProps=Constructor.getDefaultProps()),"production"!==process.env.NODE_ENV&&(Constructor.getDefaultProps&&(Constructor.getDefaultProps.isReactClassApproved={}),Constructor.prototype.getInitialState&&(Constructor.prototype.getInitialState.isReactClassApproved={})),_invariant(Constructor.prototype.render,"createClass(...): Class specification must implement a `render` method."),"production"!==process.env.NODE_ENV&&(warning(!Constructor.prototype.componentShouldUpdate,"%s has a method called componentShouldUpdate(). Did you mean shouldComponentUpdate()? The name is phrased as a question because the function is expected to return a value.",spec.displayName||"A component"),warning(!Constructor.prototype.componentWillRecieveProps,"%s has a method called componentWillRecieveProps(). Did you mean componentWillReceiveProps()?",spec.displayName||"A component"));for(var methodName in ReactClassInterface)Constructor.prototype[methodName]||(Constructor.prototype[methodName]=null);return Constructor}var injectedMixins=[],ReactClassInterface={mixins:"DEFINE_MANY",statics:"DEFINE_MANY",propTypes:"DEFINE_MANY",contextTypes:"DEFINE_MANY",childContextTypes:"DEFINE_MANY",getDefaultProps:"DEFINE_MANY_MERGED",getInitialState:"DEFINE_MANY_MERGED",getChildContext:"DEFINE_MANY_MERGED",render:"DEFINE_ONCE",componentWillMount:"DEFINE_MANY",componentDidMount:"DEFINE_MANY",componentWillReceiveProps:"DEFINE_MANY",shouldComponentUpdate:"DEFINE_ONCE",componentWillUpdate:"DEFINE_MANY",componentDidUpdate:"DEFINE_MANY",componentWillUnmount:"DEFINE_MANY",updateComponent:"OVERRIDE_BASE"},RESERVED_SPEC_KEYS={displayName:function(Constructor,displayName){Constructor.displayName=displayName},mixins:function(Constructor,mixins){if(mixins)for(var i=0;i<mixins.length;i++)mixSpecIntoComponent(Constructor,mixins[i])},childContextTypes:function(Constructor,childContextTypes){"production"!==process.env.NODE_ENV&&validateTypeDef(Constructor,childContextTypes,"childContext"),Constructor.childContextTypes=_assign({},Constructor.childContextTypes,childContextTypes)},contextTypes:function(Constructor,contextTypes){"production"!==process.env.NODE_ENV&&validateTypeDef(Constructor,contextTypes,"context"),Constructor.contextTypes=_assign({},Constructor.contextTypes,contextTypes)},getDefaultProps:function(Constructor,getDefaultProps){Constructor.getDefaultProps?Constructor.getDefaultProps=createMergedResultFunction(Constructor.getDefaultProps,getDefaultProps):Constructor.getDefaultProps=getDefaultProps},propTypes:function(Constructor,propTypes){"production"!==process.env.NODE_ENV&&validateTypeDef(Constructor,propTypes,"prop"),Constructor.propTypes=_assign({},Constructor.propTypes,propTypes)},statics:function(Constructor,statics){mixStaticSpecIntoComponent(Constructor,statics)},autobind:function(){}},IsMountedPreMixin={componentDidMount:function(){this.__isMounted=!0}},IsMountedPostMixin={componentWillUnmount:function(){this.__isMounted=!1}},ReactClassMixin={replaceState:function(newState,callback){this.updater.enqueueReplaceState(this,newState,callback)},isMounted:function(){return"production"!==process.env.NODE_ENV&&(warning(this.__didWarnIsMounted,"%s: isMounted is deprecated. Instead, make sure to clean up subscriptions and pending requests in componentWillUnmount to prevent memory leaks.",this.constructor&&this.constructor.displayName||this.name||"Component"),this.__didWarnIsMounted=!0),!!this.__isMounted}},ReactClassComponent=function(){};return _assign(ReactClassComponent.prototype,ReactComponent.prototype,ReactClassMixin),createClass}var _assign=__webpack_require__(7),emptyObject=__webpack_require__(38),_invariant=__webpack_require__(1);if("production"!==process.env.NODE_ENV)var warning=__webpack_require__(2);var ReactPropTypeLocationNames,MIXINS_KEY="mixins";ReactPropTypeLocationNames="production"!==process.env.NODE_ENV?{prop:"prop",context:"context",childContext:"child context"}:{},module.exports=factory}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function camelize(string){return string.replace(_hyphenPattern,function(_,character){return character.toUpperCase()})}var _hyphenPattern=/-(.)/g;module.exports=camelize},function(module,exports,__webpack_require__){"use strict";function camelizeStyleName(string){return camelize(string.replace(msPattern,"ms-"))}var camelize=__webpack_require__(187),msPattern=/^-ms-/;module.exports=camelizeStyleName},function(module,exports,__webpack_require__){"use strict";function containsNode(outerNode,innerNode){return!(!outerNode||!innerNode)&&(outerNode===innerNode||!isTextNode(outerNode)&&(isTextNode(innerNode)?containsNode(outerNode,innerNode.parentNode):"contains"in outerNode?outerNode.contains(innerNode):!!outerNode.compareDocumentPosition&&!!(16&outerNode.compareDocumentPosition(innerNode))))}var isTextNode=__webpack_require__(197);module.exports=containsNode},function(module,exports,__webpack_require__){"use strict";(function(process){function toArray(obj){var length=obj.length;if((Array.isArray(obj)||"object"!=typeof obj&&"function"!=typeof obj)&&("production"!==process.env.NODE_ENV?invariant(!1,"toArray: Array-like object expected"):invariant(!1)),"number"!=typeof length&&("production"!==process.env.NODE_ENV?invariant(!1,"toArray: Object needs a length property"):invariant(!1)),0===length||length-1 in obj||("production"!==process.env.NODE_ENV?invariant(!1,"toArray: Object should have keys for indices"):invariant(!1)),"function"==typeof obj.callee&&("production"!==process.env.NODE_ENV?invariant(!1,"toArray: Object can't be `arguments`. Use rest params (function(...args) {}) or Array.from() instead."):invariant(!1)),obj.hasOwnProperty)try{return Array.prototype.slice.call(obj)}catch(e){}for(var ret=Array(length),ii=0;ii<length;ii++)ret[ii]=obj[ii];return ret}function hasArrayNature(obj){return!!obj&&("object"==typeof obj||"function"==typeof obj)&&"length"in obj&&!("setInterval"in obj)&&"number"!=typeof obj.nodeType&&(Array.isArray(obj)||"callee"in obj||"item"in obj)}function createArrayFromMixed(obj){return hasArrayNature(obj)?Array.isArray(obj)?obj.slice():toArray(obj):[obj]}var invariant=__webpack_require__(1);module.exports=createArrayFromMixed}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function getNodeName(markup){var nodeNameMatch=markup.match(nodeNamePattern);return nodeNameMatch&&nodeNameMatch[1].toLowerCase()}function createNodesFromMarkup(markup,handleScript){var node=dummyNode;dummyNode||("production"!==process.env.NODE_ENV?invariant(!1,"createNodesFromMarkup dummy not initialized"):invariant(!1));var nodeName=getNodeName(markup),wrap=nodeName&&getMarkupWrap(nodeName);if(wrap){node.innerHTML=wrap[1]+markup+wrap[2];for(var wrapDepth=wrap[0];wrapDepth--;)node=node.lastChild}else node.innerHTML=markup;var scripts=node.getElementsByTagName("script");scripts.length&&(handleScript||("production"!==process.env.NODE_ENV?invariant(!1,"createNodesFromMarkup(...): Unexpected <script> element rendered."):invariant(!1)),createArrayFromMixed(scripts).forEach(handleScript));for(var nodes=Array.from(node.childNodes);node.lastChild;)node.removeChild(node.lastChild);return nodes}var ExecutionEnvironment=__webpack_require__(9),createArrayFromMixed=__webpack_require__(190),getMarkupWrap=__webpack_require__(192),invariant=__webpack_require__(1),dummyNode=ExecutionEnvironment.canUseDOM?document.createElement("div"):null,nodeNamePattern=/^\s*<(\w+)/;module.exports=createNodesFromMarkup}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function getMarkupWrap(nodeName){return dummyNode||("production"!==process.env.NODE_ENV?invariant(!1,"Markup wrapping node not initialized"):invariant(!1)),markupWrap.hasOwnProperty(nodeName)||(nodeName="*"),shouldWrap.hasOwnProperty(nodeName)||(dummyNode.innerHTML="*"===nodeName?"<link />":"<"+nodeName+"></"+nodeName+">",shouldWrap[nodeName]=!dummyNode.firstChild),shouldWrap[nodeName]?markupWrap[nodeName]:null}var ExecutionEnvironment=__webpack_require__(9),invariant=__webpack_require__(1),dummyNode=ExecutionEnvironment.canUseDOM?document.createElement("div"):null,shouldWrap={},selectWrap=[1,'<select multiple="true">',"</select>"],tableWrap=[1,"<table>","</table>"],trWrap=[3,"<table><tbody><tr>","</tr></tbody></table>"],svgWrap=[1,'<svg xmlns="http://www.w3.org/2000/svg">',"</svg>"],markupWrap={"*":[1,"?<div>","</div>"],area:[1,"<map>","</map>"],col:[2,"<table><tbody></tbody><colgroup>","</colgroup></table>"],legend:[1,"<fieldset>","</fieldset>"],param:[1,"<object>","</object>"],tr:[2,"<table><tbody>","</tbody></table>"],optgroup:selectWrap,option:selectWrap,caption:tableWrap,colgroup:tableWrap,tbody:tableWrap,tfoot:tableWrap,thead:tableWrap,td:trWrap,th:trWrap};["circle","clipPath","defs","ellipse","g","image","line","linearGradient","mask","path","pattern","polygon","polyline","radialGradient","rect","stop","text","tspan"].forEach(function(nodeName){markupWrap[nodeName]=svgWrap,shouldWrap[nodeName]=!0}),module.exports=getMarkupWrap}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function getUnboundedScrollPosition(scrollable){return scrollable===window?{x:window.pageXOffset||document.documentElement.scrollLeft,y:window.pageYOffset||document.documentElement.scrollTop}:{x:scrollable.scrollLeft,y:scrollable.scrollTop}}module.exports=getUnboundedScrollPosition},function(module,exports,__webpack_require__){"use strict";function hyphenate(string){return string.replace(_uppercasePattern,"-$1").toLowerCase()}var _uppercasePattern=/([A-Z])/g;module.exports=hyphenate},function(module,exports,__webpack_require__){"use strict";function hyphenateStyleName(string){return hyphenate(string).replace(msPattern,"-ms-")}var hyphenate=__webpack_require__(194),msPattern=/^ms-/;module.exports=hyphenateStyleName},function(module,exports,__webpack_require__){"use strict";function isNode(object){return!(!object||!("function"==typeof Node?object instanceof Node:"object"==typeof object&&"number"==typeof object.nodeType&&"string"==typeof object.nodeName))}module.exports=isNode},function(module,exports,__webpack_require__){"use strict";function isTextNode(object){return isNode(object)&&3==object.nodeType}var isNode=__webpack_require__(196);module.exports=isTextNode},function(module,exports,__webpack_require__){"use strict";function memoizeStringOnly(callback){var cache={};return function(string){return cache.hasOwnProperty(string)||(cache[string]=callback.call(this,string)),cache[string]}}module.exports=memoizeStringOnly},function(module,exports,__webpack_require__){"use strict";var performance,ExecutionEnvironment=__webpack_require__(9);ExecutionEnvironment.canUseDOM&&(performance=window.performance||window.msPerformance||window.webkitPerformance),module.exports=performance||{}},function(module,exports,__webpack_require__){"use strict";var performanceNow,performance=__webpack_require__(199);performanceNow=performance.now?function(){return performance.now()}:function(){return Date.now()},module.exports=performanceNow},function(module,exports,__webpack_require__){"use strict";module.exports=function(x){var type=typeof x;return null!==x&&("object"===type||"function"===type)}},function(module,exports,__webpack_require__){"use strict";function isObjectObject(o){return!0===isObject(o)&&"[object Object]"===Object.prototype.toString.call(o)}/*!
+module.exports=collapse},function(module,exports,__webpack_require__){"use strict";(function(process){function identity(fn){return fn}function factory(ReactComponent,isValidElement,ReactNoopUpdateQueue){function validateTypeDef(Constructor,typeDef,location){for(var propName in typeDef)typeDef.hasOwnProperty(propName)&&"production"!==process.env.NODE_ENV&&warning("function"==typeof typeDef[propName],"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",Constructor.displayName||"ReactClass",ReactPropTypeLocationNames[location],propName)}function validateMethodOverride(isAlreadyDefined,name){var specPolicy=ReactClassInterface.hasOwnProperty(name)?ReactClassInterface[name]:null;ReactClassMixin.hasOwnProperty(name)&&_invariant("OVERRIDE_BASE"===specPolicy,"ReactClassInterface: You are attempting to override `%s` from your class specification. Ensure that your method names do not overlap with React methods.",name),isAlreadyDefined&&_invariant("DEFINE_MANY"===specPolicy||"DEFINE_MANY_MERGED"===specPolicy,"ReactClassInterface: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",name)}function mixSpecIntoComponent(Constructor,spec){if(spec){_invariant("function"!=typeof spec,"ReactClass: You're attempting to use a component class or function as a mixin. Instead, just use a regular object."),_invariant(!isValidElement(spec),"ReactClass: You're attempting to use a component as a mixin. Instead, just use a regular object.");var proto=Constructor.prototype,autoBindPairs=proto.__reactAutoBindPairs;spec.hasOwnProperty(MIXINS_KEY)&&RESERVED_SPEC_KEYS.mixins(Constructor,spec.mixins);for(var name in spec)if(spec.hasOwnProperty(name)&&name!==MIXINS_KEY){var property=spec[name],isAlreadyDefined=proto.hasOwnProperty(name);if(validateMethodOverride(isAlreadyDefined,name),RESERVED_SPEC_KEYS.hasOwnProperty(name))RESERVED_SPEC_KEYS[name](Constructor,property);else{var isReactClassMethod=ReactClassInterface.hasOwnProperty(name),isFunction="function"==typeof property,shouldAutoBind=isFunction&&!isReactClassMethod&&!isAlreadyDefined&&!1!==spec.autobind;if(shouldAutoBind)autoBindPairs.push(name,property),proto[name]=property;else if(isAlreadyDefined){var specPolicy=ReactClassInterface[name];_invariant(isReactClassMethod&&("DEFINE_MANY_MERGED"===specPolicy||"DEFINE_MANY"===specPolicy),"ReactClass: Unexpected spec policy %s for key %s when mixing in component specs.",specPolicy,name),"DEFINE_MANY_MERGED"===specPolicy?proto[name]=createMergedResultFunction(proto[name],property):"DEFINE_MANY"===specPolicy&&(proto[name]=createChainedFunction(proto[name],property))}else proto[name]=property,"production"!==process.env.NODE_ENV&&"function"==typeof property&&spec.displayName&&(proto[name].displayName=spec.displayName+"_"+name)}}}else if("production"!==process.env.NODE_ENV){var typeofSpec=typeof spec,isMixinValid="object"===typeofSpec&&null!==spec;"production"!==process.env.NODE_ENV&&warning(isMixinValid,"%s: You're attempting to include a mixin that is either null or not an object. Check the mixins included by the component, as well as any mixins they include themselves. Expected object but got %s.",Constructor.displayName||"ReactClass",null===spec?null:typeofSpec)}}function mixStaticSpecIntoComponent(Constructor,statics){if(statics)for(var name in statics){var property=statics[name];if(statics.hasOwnProperty(name)){var isReserved=name in RESERVED_SPEC_KEYS;_invariant(!isReserved,'ReactClass: You are attempting to define a reserved property, `%s`, that shouldn\'t be on the "statics" key. Define it as an instance property instead; it will still be accessible on the constructor.',name);var isInherited=name in Constructor;_invariant(!isInherited,"ReactClass: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",name),Constructor[name]=property}}}function mergeIntoWithNoDuplicateKeys(one,two){_invariant(one&&two&&"object"==typeof one&&"object"==typeof two,"mergeIntoWithNoDuplicateKeys(): Cannot merge non-objects.");for(var key in two)two.hasOwnProperty(key)&&(_invariant(void 0===one[key],"mergeIntoWithNoDuplicateKeys(): Tried to merge two objects with the same key: `%s`. This conflict may be due to a mixin; in particular, this may be caused by two getInitialState() or getDefaultProps() methods returning objects with clashing keys.",key),one[key]=two[key]);return one}function createMergedResultFunction(one,two){return function(){var a=one.apply(this,arguments),b=two.apply(this,arguments);if(null==a)return b;if(null==b)return a;var c={};return mergeIntoWithNoDuplicateKeys(c,a),mergeIntoWithNoDuplicateKeys(c,b),c}}function createChainedFunction(one,two){return function(){one.apply(this,arguments),two.apply(this,arguments)}}function bindAutoBindMethod(component,method){var boundMethod=method.bind(component);if("production"!==process.env.NODE_ENV){boundMethod.__reactBoundContext=component,boundMethod.__reactBoundMethod=method,boundMethod.__reactBoundArguments=null;var componentName=component.constructor.displayName,_bind=boundMethod.bind;boundMethod.bind=function(newThis){for(var _len=arguments.length,args=Array(_len>1?_len-1:0),_key=1;_key<_len;_key++)args[_key-1]=arguments[_key];if(newThis!==component&&null!==newThis)"production"!==process.env.NODE_ENV&&warning(!1,"bind(): React component methods may only be bound to the component instance. See %s",componentName);else if(!args.length)return"production"!==process.env.NODE_ENV&&warning(!1,"bind(): You are binding a component method to the component. React does this for you automatically in a high-performance way, so you can safely remove this call. See %s",componentName),boundMethod;var reboundMethod=_bind.apply(boundMethod,arguments);return reboundMethod.__reactBoundContext=component,reboundMethod.__reactBoundMethod=method,reboundMethod.__reactBoundArguments=args,reboundMethod}}return boundMethod}function bindAutoBindMethods(component){for(var pairs=component.__reactAutoBindPairs,i=0;i<pairs.length;i+=2){var autoBindKey=pairs[i],method=pairs[i+1];component[autoBindKey]=bindAutoBindMethod(component,method)}}function createClass(spec){var Constructor=identity(function(props,context,updater){"production"!==process.env.NODE_ENV&&warning(this instanceof Constructor,"Something is calling a React component directly. Use a factory or JSX instead. See: https://fb.me/react-legacyfactory"),this.__reactAutoBindPairs.length&&bindAutoBindMethods(this),this.props=props,this.context=context,this.refs=emptyObject,this.updater=updater||ReactNoopUpdateQueue,this.state=null;var initialState=this.getInitialState?this.getInitialState():null;"production"!==process.env.NODE_ENV&&void 0===initialState&&this.getInitialState._isMockFunction&&(initialState=null),_invariant("object"==typeof initialState&&!Array.isArray(initialState),"%s.getInitialState(): must return an object or null",Constructor.displayName||"ReactCompositeComponent"),this.state=initialState});Constructor.prototype=new ReactClassComponent,Constructor.prototype.constructor=Constructor,Constructor.prototype.__reactAutoBindPairs=[],injectedMixins.forEach(mixSpecIntoComponent.bind(null,Constructor)),mixSpecIntoComponent(Constructor,IsMountedPreMixin),mixSpecIntoComponent(Constructor,spec),mixSpecIntoComponent(Constructor,IsMountedPostMixin),Constructor.getDefaultProps&&(Constructor.defaultProps=Constructor.getDefaultProps()),"production"!==process.env.NODE_ENV&&(Constructor.getDefaultProps&&(Constructor.getDefaultProps.isReactClassApproved={}),Constructor.prototype.getInitialState&&(Constructor.prototype.getInitialState.isReactClassApproved={})),_invariant(Constructor.prototype.render,"createClass(...): Class specification must implement a `render` method."),"production"!==process.env.NODE_ENV&&(warning(!Constructor.prototype.componentShouldUpdate,"%s has a method called componentShouldUpdate(). Did you mean shouldComponentUpdate()? The name is phrased as a question because the function is expected to return a value.",spec.displayName||"A component"),warning(!Constructor.prototype.componentWillRecieveProps,"%s has a method called componentWillRecieveProps(). Did you mean componentWillReceiveProps()?",spec.displayName||"A component"));for(var methodName in ReactClassInterface)Constructor.prototype[methodName]||(Constructor.prototype[methodName]=null);return Constructor}var injectedMixins=[],ReactClassInterface={mixins:"DEFINE_MANY",statics:"DEFINE_MANY",propTypes:"DEFINE_MANY",contextTypes:"DEFINE_MANY",childContextTypes:"DEFINE_MANY",getDefaultProps:"DEFINE_MANY_MERGED",getInitialState:"DEFINE_MANY_MERGED",getChildContext:"DEFINE_MANY_MERGED",render:"DEFINE_ONCE",componentWillMount:"DEFINE_MANY",componentDidMount:"DEFINE_MANY",componentWillReceiveProps:"DEFINE_MANY",shouldComponentUpdate:"DEFINE_ONCE",componentWillUpdate:"DEFINE_MANY",componentDidUpdate:"DEFINE_MANY",componentWillUnmount:"DEFINE_MANY",updateComponent:"OVERRIDE_BASE"},RESERVED_SPEC_KEYS={displayName:function(Constructor,displayName){Constructor.displayName=displayName},mixins:function(Constructor,mixins){if(mixins)for(var i=0;i<mixins.length;i++)mixSpecIntoComponent(Constructor,mixins[i])},childContextTypes:function(Constructor,childContextTypes){"production"!==process.env.NODE_ENV&&validateTypeDef(Constructor,childContextTypes,"childContext"),Constructor.childContextTypes=_assign({},Constructor.childContextTypes,childContextTypes)},contextTypes:function(Constructor,contextTypes){"production"!==process.env.NODE_ENV&&validateTypeDef(Constructor,contextTypes,"context"),Constructor.contextTypes=_assign({},Constructor.contextTypes,contextTypes)},getDefaultProps:function(Constructor,getDefaultProps){Constructor.getDefaultProps?Constructor.getDefaultProps=createMergedResultFunction(Constructor.getDefaultProps,getDefaultProps):Constructor.getDefaultProps=getDefaultProps},propTypes:function(Constructor,propTypes){"production"!==process.env.NODE_ENV&&validateTypeDef(Constructor,propTypes,"prop"),Constructor.propTypes=_assign({},Constructor.propTypes,propTypes)},statics:function(Constructor,statics){mixStaticSpecIntoComponent(Constructor,statics)},autobind:function(){}},IsMountedPreMixin={componentDidMount:function(){this.__isMounted=!0}},IsMountedPostMixin={componentWillUnmount:function(){this.__isMounted=!1}},ReactClassMixin={replaceState:function(newState,callback){this.updater.enqueueReplaceState(this,newState,callback)},isMounted:function(){return"production"!==process.env.NODE_ENV&&(warning(this.__didWarnIsMounted,"%s: isMounted is deprecated. Instead, make sure to clean up subscriptions and pending requests in componentWillUnmount to prevent memory leaks.",this.constructor&&this.constructor.displayName||this.name||"Component"),this.__didWarnIsMounted=!0),!!this.__isMounted}},ReactClassComponent=function(){};return _assign(ReactClassComponent.prototype,ReactComponent.prototype,ReactClassMixin),createClass}var _assign=__webpack_require__(7),emptyObject=__webpack_require__(38),_invariant=__webpack_require__(1);if("production"!==process.env.NODE_ENV)var warning=__webpack_require__(2);var ReactPropTypeLocationNames,MIXINS_KEY="mixins";ReactPropTypeLocationNames="production"!==process.env.NODE_ENV?{prop:"prop",context:"context",childContext:"child context"}:{},module.exports=factory}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function camelize(string){return string.replace(_hyphenPattern,function(_,character){return character.toUpperCase()})}var _hyphenPattern=/-(.)/g;module.exports=camelize},function(module,exports,__webpack_require__){"use strict";function camelizeStyleName(string){return camelize(string.replace(msPattern,"ms-"))}var camelize=__webpack_require__(188),msPattern=/^-ms-/;module.exports=camelizeStyleName},function(module,exports,__webpack_require__){"use strict";function containsNode(outerNode,innerNode){return!(!outerNode||!innerNode)&&(outerNode===innerNode||!isTextNode(outerNode)&&(isTextNode(innerNode)?containsNode(outerNode,innerNode.parentNode):"contains"in outerNode?outerNode.contains(innerNode):!!outerNode.compareDocumentPosition&&!!(16&outerNode.compareDocumentPosition(innerNode))))}var isTextNode=__webpack_require__(198);module.exports=containsNode},function(module,exports,__webpack_require__){"use strict";(function(process){function toArray(obj){var length=obj.length;if((Array.isArray(obj)||"object"!=typeof obj&&"function"!=typeof obj)&&("production"!==process.env.NODE_ENV?invariant(!1,"toArray: Array-like object expected"):invariant(!1)),"number"!=typeof length&&("production"!==process.env.NODE_ENV?invariant(!1,"toArray: Object needs a length property"):invariant(!1)),0===length||length-1 in obj||("production"!==process.env.NODE_ENV?invariant(!1,"toArray: Object should have keys for indices"):invariant(!1)),"function"==typeof obj.callee&&("production"!==process.env.NODE_ENV?invariant(!1,"toArray: Object can't be `arguments`. Use rest params (function(...args) {}) or Array.from() instead."):invariant(!1)),obj.hasOwnProperty)try{return Array.prototype.slice.call(obj)}catch(e){}for(var ret=Array(length),ii=0;ii<length;ii++)ret[ii]=obj[ii];return ret}function hasArrayNature(obj){return!!obj&&("object"==typeof obj||"function"==typeof obj)&&"length"in obj&&!("setInterval"in obj)&&"number"!=typeof obj.nodeType&&(Array.isArray(obj)||"callee"in obj||"item"in obj)}function createArrayFromMixed(obj){return hasArrayNature(obj)?Array.isArray(obj)?obj.slice():toArray(obj):[obj]}var invariant=__webpack_require__(1);module.exports=createArrayFromMixed}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function getNodeName(markup){var nodeNameMatch=markup.match(nodeNamePattern);return nodeNameMatch&&nodeNameMatch[1].toLowerCase()}function createNodesFromMarkup(markup,handleScript){var node=dummyNode;dummyNode||("production"!==process.env.NODE_ENV?invariant(!1,"createNodesFromMarkup dummy not initialized"):invariant(!1));var nodeName=getNodeName(markup),wrap=nodeName&&getMarkupWrap(nodeName);if(wrap){node.innerHTML=wrap[1]+markup+wrap[2];for(var wrapDepth=wrap[0];wrapDepth--;)node=node.lastChild}else node.innerHTML=markup;var scripts=node.getElementsByTagName("script");scripts.length&&(handleScript||("production"!==process.env.NODE_ENV?invariant(!1,"createNodesFromMarkup(...): Unexpected <script> element rendered."):invariant(!1)),createArrayFromMixed(scripts).forEach(handleScript));for(var nodes=Array.from(node.childNodes);node.lastChild;)node.removeChild(node.lastChild);return nodes}var ExecutionEnvironment=__webpack_require__(9),createArrayFromMixed=__webpack_require__(191),getMarkupWrap=__webpack_require__(193),invariant=__webpack_require__(1),dummyNode=ExecutionEnvironment.canUseDOM?document.createElement("div"):null,nodeNamePattern=/^\s*<(\w+)/;module.exports=createNodesFromMarkup}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function getMarkupWrap(nodeName){return dummyNode||("production"!==process.env.NODE_ENV?invariant(!1,"Markup wrapping node not initialized"):invariant(!1)),markupWrap.hasOwnProperty(nodeName)||(nodeName="*"),shouldWrap.hasOwnProperty(nodeName)||(dummyNode.innerHTML="*"===nodeName?"<link />":"<"+nodeName+"></"+nodeName+">",shouldWrap[nodeName]=!dummyNode.firstChild),shouldWrap[nodeName]?markupWrap[nodeName]:null}var ExecutionEnvironment=__webpack_require__(9),invariant=__webpack_require__(1),dummyNode=ExecutionEnvironment.canUseDOM?document.createElement("div"):null,shouldWrap={},selectWrap=[1,'<select multiple="true">',"</select>"],tableWrap=[1,"<table>","</table>"],trWrap=[3,"<table><tbody><tr>","</tr></tbody></table>"],svgWrap=[1,'<svg xmlns="http://www.w3.org/2000/svg">',"</svg>"],markupWrap={"*":[1,"?<div>","</div>"],area:[1,"<map>","</map>"],col:[2,"<table><tbody></tbody><colgroup>","</colgroup></table>"],legend:[1,"<fieldset>","</fieldset>"],param:[1,"<object>","</object>"],tr:[2,"<table><tbody>","</tbody></table>"],optgroup:selectWrap,option:selectWrap,caption:tableWrap,colgroup:tableWrap,tbody:tableWrap,tfoot:tableWrap,thead:tableWrap,td:trWrap,th:trWrap};["circle","clipPath","defs","ellipse","g","image","line","linearGradient","mask","path","pattern","polygon","polyline","radialGradient","rect","stop","text","tspan"].forEach(function(nodeName){markupWrap[nodeName]=svgWrap,shouldWrap[nodeName]=!0}),module.exports=getMarkupWrap}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function getUnboundedScrollPosition(scrollable){return scrollable===window?{x:window.pageXOffset||document.documentElement.scrollLeft,y:window.pageYOffset||document.documentElement.scrollTop}:{x:scrollable.scrollLeft,y:scrollable.scrollTop}}module.exports=getUnboundedScrollPosition},function(module,exports,__webpack_require__){"use strict";function hyphenate(string){return string.replace(_uppercasePattern,"-$1").toLowerCase()}var _uppercasePattern=/([A-Z])/g;module.exports=hyphenate},function(module,exports,__webpack_require__){"use strict";function hyphenateStyleName(string){return hyphenate(string).replace(msPattern,"-ms-")}var hyphenate=__webpack_require__(195),msPattern=/^ms-/;module.exports=hyphenateStyleName},function(module,exports,__webpack_require__){"use strict";function isNode(object){return!(!object||!("function"==typeof Node?object instanceof Node:"object"==typeof object&&"number"==typeof object.nodeType&&"string"==typeof object.nodeName))}module.exports=isNode},function(module,exports,__webpack_require__){"use strict";function isTextNode(object){return isNode(object)&&3==object.nodeType}var isNode=__webpack_require__(197);module.exports=isTextNode},function(module,exports,__webpack_require__){"use strict";function memoizeStringOnly(callback){var cache={};return function(string){return cache.hasOwnProperty(string)||(cache[string]=callback.call(this,string)),cache[string]}}module.exports=memoizeStringOnly},function(module,exports,__webpack_require__){"use strict";var performance,ExecutionEnvironment=__webpack_require__(9);ExecutionEnvironment.canUseDOM&&(performance=window.performance||window.msPerformance||window.webkitPerformance),module.exports=performance||{}},function(module,exports,__webpack_require__){"use strict";var performanceNow,performance=__webpack_require__(200);performanceNow=performance.now?function(){return performance.now()}:function(){return Date.now()},module.exports=performanceNow},function(module,exports,__webpack_require__){"use strict";module.exports=function(x){var type=typeof x;return null!==x&&("object"===type||"function"===type)}},function(module,exports,__webpack_require__){"use strict";function isObjectObject(o){return!0===isObject(o)&&"[object Object]"===Object.prototype.toString.call(o)}/*!
  * is-plain-object <https://github.com/jonschlinkert/is-plain-object>
  *
  * Copyright (c) 2014-2015, Jon Schlinkert.
  * Licensed under the MIT License.
  */
-var isObject=__webpack_require__(204);module.exports=function(o){var ctor,prot;return!1!==isObjectObject(o)&&("function"==typeof(ctor=o.constructor)&&(prot=ctor.prototype,!1!==isObjectObject(prot)&&!1!==prot.hasOwnProperty("isPrototypeOf")))}},function(module,exports,__webpack_require__){"use strict";module.exports=function(re){return"[object RegExp]"===Object.prototype.toString.call(re)}},function(module,exports,__webpack_require__){"use strict";/*!
+var isObject=__webpack_require__(205);module.exports=function(o){var ctor,prot;return!1!==isObjectObject(o)&&("function"==typeof(ctor=o.constructor)&&(prot=ctor.prototype,!1!==isObjectObject(prot)&&!1!==prot.hasOwnProperty("isPrototypeOf")))}},function(module,exports,__webpack_require__){"use strict";module.exports=function(re){return"[object RegExp]"===Object.prototype.toString.call(re)}},function(module,exports,__webpack_require__){"use strict";/*!
  * isobject <https://github.com/jonschlinkert/isobject>
  *
  * Copyright (c) 2014-2015, Jon Schlinkert.
  * Licensed under the MIT License.
  */
-module.exports=function(val){return null!=val&&"object"==typeof val&&!Array.isArray(val)}},function(module,exports){function baseClamp(number,lower,upper){return number===number&&(void 0!==upper&&(number=number<=upper?number:upper),void 0!==lower&&(number=number>=lower?number:lower)),number}module.exports=baseClamp},function(module,exports,__webpack_require__){function baseFill(array,value,start,end){var length=array.length;for(start=toInteger(start),start<0&&(start=-start>length?0:length+start),end=void 0===end||end>length?length:toInteger(end),end<0&&(end+=length),end=start>end?0:toLength(end);start<end;)array[start++]=value;return array}var toInteger=__webpack_require__(98),toLength=__webpack_require__(221);module.exports=baseFill},function(module,exports,__webpack_require__){(function(global){var freeGlobal="object"==typeof global&&global&&global.Object===Object&&global;module.exports=freeGlobal}).call(exports,__webpack_require__(46))},function(module,exports,__webpack_require__){function getRawTag(value){var isOwn=hasOwnProperty.call(value,symToStringTag),tag=value[symToStringTag];try{value[symToStringTag]=void 0;var unmasked=!0}catch(e){}var result=nativeObjectToString.call(value);return unmasked&&(isOwn?value[symToStringTag]=tag:delete value[symToStringTag]),result}var Symbol=__webpack_require__(96),objectProto=Object.prototype,hasOwnProperty=objectProto.hasOwnProperty,nativeObjectToString=objectProto.toString,symToStringTag=Symbol?Symbol.toStringTag:void 0;module.exports=getRawTag},function(module,exports){function isIndex(value,length){return!!(length=null==length?MAX_SAFE_INTEGER:length)&&("number"==typeof value||reIsUint.test(value))&&value>-1&&value%1==0&&value<length}var MAX_SAFE_INTEGER=9007199254740991,reIsUint=/^(?:0|[1-9]\d*)$/;module.exports=isIndex},function(module,exports,__webpack_require__){function isIterateeCall(value,index,object){if(!isObject(object))return!1;var type=typeof index;return!!("number"==type?isArrayLike(object)&&isIndex(index,object.length):"string"==type&&index in object)&&eq(object[index],value)}var eq=__webpack_require__(213),isArrayLike=__webpack_require__(215),isIndex=__webpack_require__(209),isObject=__webpack_require__(52);module.exports=isIterateeCall},function(module,exports){function objectToString(value){return nativeObjectToString.call(value)}var objectProto=Object.prototype,nativeObjectToString=objectProto.toString;module.exports=objectToString},function(module,exports,__webpack_require__){var freeGlobal=__webpack_require__(207),freeSelf="object"==typeof self&&self&&self.Object===Object&&self,root=freeGlobal||freeSelf||Function("return this")();module.exports=root},function(module,exports){function eq(value,other){return value===other||value!==value&&other!==other}module.exports=eq},function(module,exports,__webpack_require__){function fill(array,value,start,end){var length=null==array?0:array.length;return length?(start&&"number"!=typeof start&&isIterateeCall(array,value,start)&&(start=0,end=length),baseFill(array,value,start,end)):[]}var baseFill=__webpack_require__(206),isIterateeCall=__webpack_require__(210);module.exports=fill},function(module,exports,__webpack_require__){function isArrayLike(value){return null!=value&&isLength(value.length)&&!isFunction(value)}var isFunction=__webpack_require__(216),isLength=__webpack_require__(217);module.exports=isArrayLike},function(module,exports,__webpack_require__){function isFunction(value){if(!isObject(value))return!1;var tag=baseGetTag(value);return tag==funcTag||tag==genTag||tag==asyncTag||tag==proxyTag}var baseGetTag=__webpack_require__(97),isObject=__webpack_require__(52),asyncTag="[object AsyncFunction]",funcTag="[object Function]",genTag="[object GeneratorFunction]",proxyTag="[object Proxy]";module.exports=isFunction},function(module,exports){function isLength(value){return"number"==typeof value&&value>-1&&value%1==0&&value<=MAX_SAFE_INTEGER}var MAX_SAFE_INTEGER=9007199254740991;module.exports=isLength},function(module,exports){function isObjectLike(value){return null!=value&&"object"==typeof value}module.exports=isObjectLike},function(module,exports,__webpack_require__){function isSymbol(value){return"symbol"==typeof value||isObjectLike(value)&&baseGetTag(value)==symbolTag}var baseGetTag=__webpack_require__(97),isObjectLike=__webpack_require__(218),symbolTag="[object Symbol]";module.exports=isSymbol},function(module,exports,__webpack_require__){function toFinite(value){if(!value)return 0===value?value:0;if((value=toNumber(value))===INFINITY||value===-INFINITY){return(value<0?-1:1)*MAX_INTEGER}return value===value?value:0}var toNumber=__webpack_require__(222),INFINITY=1/0,MAX_INTEGER=1.7976931348623157e308;module.exports=toFinite},function(module,exports,__webpack_require__){function toLength(value){return value?baseClamp(toInteger(value),0,MAX_ARRAY_LENGTH):0}var baseClamp=__webpack_require__(205),toInteger=__webpack_require__(98),MAX_ARRAY_LENGTH=4294967295;module.exports=toLength},function(module,exports,__webpack_require__){function toNumber(value){if("number"==typeof value)return value;if(isSymbol(value))return NAN;if(isObject(value)){var other="function"==typeof value.valueOf?value.valueOf():value;value=isObject(other)?other+"":other}if("string"!=typeof value)return 0===value?value:+value;value=value.replace(reTrim,"");var isBinary=reIsBinary.test(value);return isBinary||reIsOctal.test(value)?freeParseInt(value.slice(2),isBinary?2:8):reIsBadHex.test(value)?NAN:+value}var isObject=__webpack_require__(52),isSymbol=__webpack_require__(219),NAN=NaN,reTrim=/^\s+|\s+$/g,reIsBadHex=/^[-+]0x[0-9a-f]+$/i,reIsBinary=/^0b[01]+$/i,reIsOctal=/^0o[0-7]+$/i,freeParseInt=parseInt;module.exports=toNumber},function(module,exports){!function(Prism){var javascript=Prism.util.clone(Prism.languages.javascript);Prism.languages.jsx=Prism.languages.extend("markup",javascript),Prism.languages.jsx.tag.pattern=/<\/?[\w\.:-]+\s*(?:\s+[\w\.:-]+(?:=(?:("|')(\\?[\w\W])*?\1|[^\s'">=]+|(\{[\w\W]*?\})))?\s*)*\/?>/i,Prism.languages.jsx.tag.inside["attr-value"].pattern=/=[^\{](?:('|")[\w\W]*?(\1)|[^\s>]+)/i;var jsxExpression=Prism.util.clone(Prism.languages.jsx);delete jsxExpression.punctuation,jsxExpression=Prism.languages.insertBefore("jsx","operator",{punctuation:/=(?={)|[{}[\];(),.:]/},{jsx:jsxExpression}),Prism.languages.insertBefore("inside","attr-value",{script:{pattern:/=(\{(?:\{[^}]*\}|[^}])+\})/i,inside:jsxExpression,alias:"language-javascript"}},Prism.languages.jsx.tag)}(Prism)},function(module,exports,__webpack_require__){"use strict";(function(process){function checkPropTypes(typeSpecs,values,location,componentName,getStack){if("production"!==process.env.NODE_ENV)for(var typeSpecName in typeSpecs)if(typeSpecs.hasOwnProperty(typeSpecName)){var error;try{invariant("function"==typeof typeSpecs[typeSpecName],"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",componentName||"React class",location,typeSpecName),error=typeSpecs[typeSpecName](values,typeSpecName,componentName,location,null,ReactPropTypesSecret)}catch(ex){error=ex}if(warning(!error||error instanceof Error,"%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",componentName||"React class",location,typeSpecName,typeof error),error instanceof Error&&!(error.message in loggedTypeFailures)){loggedTypeFailures[error.message]=!0;var stack=getStack?getStack():"";warning(!1,"Failed %s type: %s%s",location,error.message,null!=stack?stack:"")}}}if("production"!==process.env.NODE_ENV)var invariant=__webpack_require__(1),warning=__webpack_require__(2),ReactPropTypesSecret=__webpack_require__(53),loggedTypeFailures={};module.exports=checkPropTypes}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var emptyFunction=__webpack_require__(12),invariant=__webpack_require__(1),ReactPropTypesSecret=__webpack_require__(53);module.exports=function(){function shim(props,propName,componentName,location,propFullName,secret){secret!==ReactPropTypesSecret&&invariant(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function getShim(){return shim}shim.isRequired=shim;var ReactPropTypes={array:shim,bool:shim,func:shim,number:shim,object:shim,string:shim,symbol:shim,any:shim,arrayOf:getShim,element:shim,instanceOf:getShim,node:shim,objectOf:getShim,oneOf:getShim,oneOfType:getShim,shape:getShim};return ReactPropTypes.checkPropTypes=emptyFunction,ReactPropTypes.PropTypes=ReactPropTypes,ReactPropTypes}},function(module,exports,__webpack_require__){"use strict";module.exports=__webpack_require__(240)},function(module,exports,__webpack_require__){"use strict";var ARIADOMPropertyConfig={Properties:{"aria-current":0,"aria-details":0,"aria-disabled":0,"aria-hidden":0,"aria-invalid":0,"aria-keyshortcuts":0,"aria-label":0,"aria-roledescription":0,"aria-autocomplete":0,"aria-checked":0,"aria-expanded":0,"aria-haspopup":0,"aria-level":0,"aria-modal":0,"aria-multiline":0,"aria-multiselectable":0,"aria-orientation":0,"aria-placeholder":0,"aria-pressed":0,"aria-readonly":0,"aria-required":0,"aria-selected":0,"aria-sort":0,"aria-valuemax":0,"aria-valuemin":0,"aria-valuenow":0,"aria-valuetext":0,"aria-atomic":0,"aria-busy":0,"aria-live":0,"aria-relevant":0,"aria-dropeffect":0,"aria-grabbed":0,"aria-activedescendant":0,"aria-colcount":0,"aria-colindex":0,"aria-colspan":0,"aria-controls":0,"aria-describedby":0,"aria-errormessage":0,"aria-flowto":0,"aria-labelledby":0,"aria-owns":0,"aria-posinset":0,"aria-rowcount":0,"aria-rowindex":0,"aria-rowspan":0,"aria-setsize":0},DOMAttributeNames:{},DOMPropertyNames:{}};module.exports=ARIADOMPropertyConfig},function(module,exports,__webpack_require__){"use strict";var ReactDOMComponentTree=__webpack_require__(8),focusNode=__webpack_require__(94),AutoFocusUtils={focusDOMComponent:function(){focusNode(ReactDOMComponentTree.getNodeFromInstance(this))}};module.exports=AutoFocusUtils},function(module,exports,__webpack_require__){"use strict";function isKeypressCommand(nativeEvent){return(nativeEvent.ctrlKey||nativeEvent.altKey||nativeEvent.metaKey)&&!(nativeEvent.ctrlKey&&nativeEvent.altKey)}function getCompositionEventType(topLevelType){switch(topLevelType){case"topCompositionStart":return eventTypes.compositionStart;case"topCompositionEnd":return eventTypes.compositionEnd;case"topCompositionUpdate":return eventTypes.compositionUpdate}}function isFallbackCompositionStart(topLevelType,nativeEvent){return"topKeyDown"===topLevelType&&nativeEvent.keyCode===START_KEYCODE}function isFallbackCompositionEnd(topLevelType,nativeEvent){switch(topLevelType){case"topKeyUp":return-1!==END_KEYCODES.indexOf(nativeEvent.keyCode);case"topKeyDown":return nativeEvent.keyCode!==START_KEYCODE;case"topKeyPress":case"topMouseDown":case"topBlur":return!0;default:return!1}}function getDataFromCustomEvent(nativeEvent){var detail=nativeEvent.detail;return"object"==typeof detail&&"data"in detail?detail.data:null}function extractCompositionEvent(topLevelType,targetInst,nativeEvent,nativeEventTarget){var eventType,fallbackData;if(canUseCompositionEvent?eventType=getCompositionEventType(topLevelType):currentComposition?isFallbackCompositionEnd(topLevelType,nativeEvent)&&(eventType=eventTypes.compositionEnd):isFallbackCompositionStart(topLevelType,nativeEvent)&&(eventType=eventTypes.compositionStart),!eventType)return null;useFallbackCompositionData&&(currentComposition||eventType!==eventTypes.compositionStart?eventType===eventTypes.compositionEnd&&currentComposition&&(fallbackData=currentComposition.getData()):currentComposition=FallbackCompositionState.getPooled(nativeEventTarget));var event=SyntheticCompositionEvent.getPooled(eventType,targetInst,nativeEvent,nativeEventTarget);if(fallbackData)event.data=fallbackData;else{var customData=getDataFromCustomEvent(nativeEvent);null!==customData&&(event.data=customData)}return EventPropagators.accumulateTwoPhaseDispatches(event),event}function getNativeBeforeInputChars(topLevelType,nativeEvent){switch(topLevelType){case"topCompositionEnd":return getDataFromCustomEvent(nativeEvent);case"topKeyPress":return nativeEvent.which!==SPACEBAR_CODE?null:(hasSpaceKeypress=!0,SPACEBAR_CHAR);case"topTextInput":var chars=nativeEvent.data;return chars===SPACEBAR_CHAR&&hasSpaceKeypress?null:chars;default:return null}}function getFallbackBeforeInputChars(topLevelType,nativeEvent){if(currentComposition){if("topCompositionEnd"===topLevelType||!canUseCompositionEvent&&isFallbackCompositionEnd(topLevelType,nativeEvent)){var chars=currentComposition.getData();return FallbackCompositionState.release(currentComposition),currentComposition=null,chars}return null}switch(topLevelType){case"topPaste":return null;case"topKeyPress":return nativeEvent.which&&!isKeypressCommand(nativeEvent)?String.fromCharCode(nativeEvent.which):null;case"topCompositionEnd":return useFallbackCompositionData?null:nativeEvent.data;default:return null}}function extractBeforeInputEvent(topLevelType,targetInst,nativeEvent,nativeEventTarget){var chars;if(!(chars=canUseTextInputEvent?getNativeBeforeInputChars(topLevelType,nativeEvent):getFallbackBeforeInputChars(topLevelType,nativeEvent)))return null;var event=SyntheticInputEvent.getPooled(eventTypes.beforeInput,targetInst,nativeEvent,nativeEventTarget);return event.data=chars,EventPropagators.accumulateTwoPhaseDispatches(event),event}var EventPropagators=__webpack_require__(31),ExecutionEnvironment=__webpack_require__(9),FallbackCompositionState=__webpack_require__(235),SyntheticCompositionEvent=__webpack_require__(278),SyntheticInputEvent=__webpack_require__(281),END_KEYCODES=[9,13,27,32],START_KEYCODE=229,canUseCompositionEvent=ExecutionEnvironment.canUseDOM&&"CompositionEvent"in window,documentMode=null;ExecutionEnvironment.canUseDOM&&"documentMode"in document&&(documentMode=document.documentMode);var canUseTextInputEvent=ExecutionEnvironment.canUseDOM&&"TextEvent"in window&&!documentMode&&!function(){var opera=window.opera;return"object"==typeof opera&&"function"==typeof opera.version&&parseInt(opera.version(),10)<=12}(),useFallbackCompositionData=ExecutionEnvironment.canUseDOM&&(!canUseCompositionEvent||documentMode&&documentMode>8&&documentMode<=11),SPACEBAR_CODE=32,SPACEBAR_CHAR=String.fromCharCode(SPACEBAR_CODE),eventTypes={beforeInput:{phasedRegistrationNames:{bubbled:"onBeforeInput",captured:"onBeforeInputCapture"},dependencies:["topCompositionEnd","topKeyPress","topTextInput","topPaste"]},compositionEnd:{phasedRegistrationNames:{bubbled:"onCompositionEnd",captured:"onCompositionEndCapture"},dependencies:["topBlur","topCompositionEnd","topKeyDown","topKeyPress","topKeyUp","topMouseDown"]},compositionStart:{phasedRegistrationNames:{bubbled:"onCompositionStart",captured:"onCompositionStartCapture"},dependencies:["topBlur","topCompositionStart","topKeyDown","topKeyPress","topKeyUp","topMouseDown"]},compositionUpdate:{phasedRegistrationNames:{bubbled:"onCompositionUpdate",captured:"onCompositionUpdateCapture"},dependencies:["topBlur","topCompositionUpdate","topKeyDown","topKeyPress","topKeyUp","topMouseDown"]}},hasSpaceKeypress=!1,currentComposition=null,BeforeInputEventPlugin={eventTypes:eventTypes,extractEvents:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){return[extractCompositionEvent(topLevelType,targetInst,nativeEvent,nativeEventTarget),extractBeforeInputEvent(topLevelType,targetInst,nativeEvent,nativeEventTarget)]}};module.exports=BeforeInputEventPlugin},function(module,exports,__webpack_require__){"use strict";(function(process){var CSSProperty=__webpack_require__(102),ExecutionEnvironment=__webpack_require__(9),ReactInstrumentation=__webpack_require__(14),camelizeStyleName=__webpack_require__(188),dangerousStyleValue=__webpack_require__(288),hyphenateStyleName=__webpack_require__(195),memoizeStringOnly=__webpack_require__(198),warning=__webpack_require__(2),processStyleName=memoizeStringOnly(function(styleName){return hyphenateStyleName(styleName)}),hasShorthandPropertyBug=!1,styleFloatAccessor="cssFloat";if(ExecutionEnvironment.canUseDOM){var tempStyle=document.createElement("div").style;try{tempStyle.font=""}catch(e){hasShorthandPropertyBug=!0}void 0===document.documentElement.style.cssFloat&&(styleFloatAccessor="styleFloat")}if("production"!==process.env.NODE_ENV)var badVendoredStyleNamePattern=/^(?:webkit|moz|o)[A-Z]/,badStyleValueWithSemicolonPattern=/;\s*$/,warnedStyleNames={},warnedStyleValues={},warnedForNaNValue=!1,warnHyphenatedStyleName=function(name,owner){warnedStyleNames.hasOwnProperty(name)&&warnedStyleNames[name]||(warnedStyleNames[name]=!0,"production"!==process.env.NODE_ENV&&warning(!1,"Unsupported style property %s. Did you mean %s?%s",name,camelizeStyleName(name),checkRenderMessage(owner)))},warnBadVendoredStyleName=function(name,owner){warnedStyleNames.hasOwnProperty(name)&&warnedStyleNames[name]||(warnedStyleNames[name]=!0,"production"!==process.env.NODE_ENV&&warning(!1,"Unsupported vendor-prefixed style property %s. Did you mean %s?%s",name,name.charAt(0).toUpperCase()+name.slice(1),checkRenderMessage(owner)))},warnStyleValueWithSemicolon=function(name,value,owner){warnedStyleValues.hasOwnProperty(value)&&warnedStyleValues[value]||(warnedStyleValues[value]=!0,"production"!==process.env.NODE_ENV&&warning(!1,'Style property values shouldn\'t contain a semicolon.%s Try "%s: %s" instead.',checkRenderMessage(owner),name,value.replace(badStyleValueWithSemicolonPattern,"")))},warnStyleValueIsNaN=function(name,value,owner){warnedForNaNValue||(warnedForNaNValue=!0,"production"!==process.env.NODE_ENV&&warning(!1,"`NaN` is an invalid value for the `%s` css style property.%s",name,checkRenderMessage(owner)))},checkRenderMessage=function(owner){if(owner){var name=owner.getName();if(name)return" Check the render method of `"+name+"`."}return""},warnValidStyle=function(name,value,component){var owner;component&&(owner=component._currentElement._owner),name.indexOf("-")>-1?warnHyphenatedStyleName(name,owner):badVendoredStyleNamePattern.test(name)?warnBadVendoredStyleName(name,owner):badStyleValueWithSemicolonPattern.test(value)&&warnStyleValueWithSemicolon(name,value,owner),"number"==typeof value&&isNaN(value)&&warnStyleValueIsNaN(name,0,owner)};var CSSPropertyOperations={createMarkupForStyles:function(styles,component){var serialized="";for(var styleName in styles)if(styles.hasOwnProperty(styleName)){var isCustomProperty=0===styleName.indexOf("--"),styleValue=styles[styleName];"production"!==process.env.NODE_ENV&&(isCustomProperty||warnValidStyle(styleName,styleValue,component)),null!=styleValue&&(serialized+=processStyleName(styleName)+":",serialized+=dangerousStyleValue(styleName,styleValue,component,isCustomProperty)+";")}return serialized||null},setValueForStyles:function(node,styles,component){"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:component._debugID,type:"update styles",payload:styles});var style=node.style;for(var styleName in styles)if(styles.hasOwnProperty(styleName)){var isCustomProperty=0===styleName.indexOf("--");"production"!==process.env.NODE_ENV&&(isCustomProperty||warnValidStyle(styleName,styles[styleName],component));var styleValue=dangerousStyleValue(styleName,styles[styleName],component,isCustomProperty);if("float"!==styleName&&"cssFloat"!==styleName||(styleName=styleFloatAccessor),isCustomProperty)style.setProperty(styleName,styleValue);else if(styleValue)style[styleName]=styleValue;else{var expansion=hasShorthandPropertyBug&&CSSProperty.shorthandPropertyExpansions[styleName];if(expansion)for(var individualStyleName in expansion)style[individualStyleName]="";else style[styleName]=""}}}};module.exports=CSSPropertyOperations}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function createAndAccumulateChangeEvent(inst,nativeEvent,target){var event=SyntheticEvent.getPooled(eventTypes.change,inst,nativeEvent,target);return event.type="change",EventPropagators.accumulateTwoPhaseDispatches(event),event}function shouldUseChangeEvent(elem){var nodeName=elem.nodeName&&elem.nodeName.toLowerCase();return"select"===nodeName||"input"===nodeName&&"file"===elem.type}function manualDispatchChangeEvent(nativeEvent){var event=createAndAccumulateChangeEvent(activeElementInst,nativeEvent,getEventTarget(nativeEvent));ReactUpdates.batchedUpdates(runEventInBatch,event)}function runEventInBatch(event){EventPluginHub.enqueueEvents(event),EventPluginHub.processEventQueue(!1)}function startWatchingForChangeEventIE8(target,targetInst){activeElement=target,activeElementInst=targetInst,activeElement.attachEvent("onchange",manualDispatchChangeEvent)}function stopWatchingForChangeEventIE8(){activeElement&&(activeElement.detachEvent("onchange",manualDispatchChangeEvent),activeElement=null,activeElementInst=null)}function getInstIfValueChanged(targetInst,nativeEvent){var updated=inputValueTracking.updateValueIfChanged(targetInst),simulated=!0===nativeEvent.simulated&&ChangeEventPlugin._allowSimulatedPassThrough;if(updated||simulated)return targetInst}function getTargetInstForChangeEvent(topLevelType,targetInst){if("topChange"===topLevelType)return targetInst}function handleEventsForChangeEventIE8(topLevelType,target,targetInst){"topFocus"===topLevelType?(stopWatchingForChangeEventIE8(),startWatchingForChangeEventIE8(target,targetInst)):"topBlur"===topLevelType&&stopWatchingForChangeEventIE8()}function startWatchingForValueChange(target,targetInst){activeElement=target,activeElementInst=targetInst,activeElement.attachEvent("onpropertychange",handlePropertyChange)}function stopWatchingForValueChange(){activeElement&&(activeElement.detachEvent("onpropertychange",handlePropertyChange),activeElement=null,activeElementInst=null)}function handlePropertyChange(nativeEvent){"value"===nativeEvent.propertyName&&getInstIfValueChanged(activeElementInst,nativeEvent)&&manualDispatchChangeEvent(nativeEvent)}function handleEventsForInputEventPolyfill(topLevelType,target,targetInst){"topFocus"===topLevelType?(stopWatchingForValueChange(),startWatchingForValueChange(target,targetInst)):"topBlur"===topLevelType&&stopWatchingForValueChange()}function getTargetInstForInputEventPolyfill(topLevelType,targetInst,nativeEvent){if("topSelectionChange"===topLevelType||"topKeyUp"===topLevelType||"topKeyDown"===topLevelType)return getInstIfValueChanged(activeElementInst,nativeEvent)}function shouldUseClickEvent(elem){var nodeName=elem.nodeName;return nodeName&&"input"===nodeName.toLowerCase()&&("checkbox"===elem.type||"radio"===elem.type)}function getTargetInstForClickEvent(topLevelType,targetInst,nativeEvent){if("topClick"===topLevelType)return getInstIfValueChanged(targetInst,nativeEvent)}function getTargetInstForInputOrChangeEvent(topLevelType,targetInst,nativeEvent){if("topInput"===topLevelType||"topChange"===topLevelType)return getInstIfValueChanged(targetInst,nativeEvent)}function handleControlledInputBlur(inst,node){if(null!=inst){var state=inst._wrapperState||node._wrapperState;if(state&&state.controlled&&"number"===node.type){var value=""+node.value;node.getAttribute("value")!==value&&node.setAttribute("value",value)}}}var EventPluginHub=__webpack_require__(30),EventPropagators=__webpack_require__(31),ExecutionEnvironment=__webpack_require__(9),ReactDOMComponentTree=__webpack_require__(8),ReactUpdates=__webpack_require__(17),SyntheticEvent=__webpack_require__(20),inputValueTracking=__webpack_require__(119),getEventTarget=__webpack_require__(65),isEventSupported=__webpack_require__(66),isTextInputElement=__webpack_require__(121),eventTypes={change:{phasedRegistrationNames:{bubbled:"onChange",captured:"onChangeCapture"},dependencies:["topBlur","topChange","topClick","topFocus","topInput","topKeyDown","topKeyUp","topSelectionChange"]}},activeElement=null,activeElementInst=null,doesChangeEventBubble=!1;ExecutionEnvironment.canUseDOM&&(doesChangeEventBubble=isEventSupported("change")&&(!document.documentMode||document.documentMode>8));var isInputEventSupported=!1;ExecutionEnvironment.canUseDOM&&(isInputEventSupported=isEventSupported("input")&&(!("documentMode"in document)||document.documentMode>9));var ChangeEventPlugin={eventTypes:eventTypes,_allowSimulatedPassThrough:!0,_isInputEventSupported:isInputEventSupported,extractEvents:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){var getTargetInstFunc,handleEventFunc,targetNode=targetInst?ReactDOMComponentTree.getNodeFromInstance(targetInst):window;if(shouldUseChangeEvent(targetNode)?doesChangeEventBubble?getTargetInstFunc=getTargetInstForChangeEvent:handleEventFunc=handleEventsForChangeEventIE8:isTextInputElement(targetNode)?isInputEventSupported?getTargetInstFunc=getTargetInstForInputOrChangeEvent:(getTargetInstFunc=getTargetInstForInputEventPolyfill,handleEventFunc=handleEventsForInputEventPolyfill):shouldUseClickEvent(targetNode)&&(getTargetInstFunc=getTargetInstForClickEvent),getTargetInstFunc){var inst=getTargetInstFunc(topLevelType,targetInst,nativeEvent);if(inst){return createAndAccumulateChangeEvent(inst,nativeEvent,nativeEventTarget)}}handleEventFunc&&handleEventFunc(topLevelType,targetNode,targetInst),"topBlur"===topLevelType&&handleControlledInputBlur(targetInst,targetNode)}};module.exports=ChangeEventPlugin},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(4),DOMLazyTree=__webpack_require__(26),ExecutionEnvironment=__webpack_require__(9),createNodesFromMarkup=__webpack_require__(191),emptyFunction=__webpack_require__(12),invariant=__webpack_require__(1),Danger={dangerouslyReplaceNodeWithMarkup:function(oldChild,markup){if(ExecutionEnvironment.canUseDOM||("production"!==process.env.NODE_ENV?invariant(!1,"dangerouslyReplaceNodeWithMarkup(...): Cannot render markup in a worker thread. Make sure `window` and `document` are available globally before requiring React when unit testing or use ReactDOMServer.renderToString() for server rendering."):_prodInvariant("56")),markup||("production"!==process.env.NODE_ENV?invariant(!1,"dangerouslyReplaceNodeWithMarkup(...): Missing markup."):_prodInvariant("57")),"HTML"===oldChild.nodeName&&("production"!==process.env.NODE_ENV?invariant(!1,"dangerouslyReplaceNodeWithMarkup(...): Cannot replace markup of the <html> node. This is because browser quirks make this unreliable and/or slow. If you want to render to the root you must use server rendering. See ReactDOMServer.renderToString()."):_prodInvariant("58")),"string"==typeof markup){var newChild=createNodesFromMarkup(markup,emptyFunction)[0];oldChild.parentNode.replaceChild(newChild,oldChild)}else DOMLazyTree.replaceChildWithTree(oldChild,markup)}};module.exports=Danger}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var DefaultEventPluginOrder=["ResponderEventPlugin","SimpleEventPlugin","TapEventPlugin","EnterLeaveEventPlugin","ChangeEventPlugin","SelectEventPlugin","BeforeInputEventPlugin"];module.exports=DefaultEventPluginOrder},function(module,exports,__webpack_require__){"use strict";var EventPropagators=__webpack_require__(31),ReactDOMComponentTree=__webpack_require__(8),SyntheticMouseEvent=__webpack_require__(41),eventTypes={mouseEnter:{registrationName:"onMouseEnter",dependencies:["topMouseOut","topMouseOver"]},mouseLeave:{registrationName:"onMouseLeave",dependencies:["topMouseOut","topMouseOver"]}},EnterLeaveEventPlugin={eventTypes:eventTypes,extractEvents:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){if("topMouseOver"===topLevelType&&(nativeEvent.relatedTarget||nativeEvent.fromElement))return null;if("topMouseOut"!==topLevelType&&"topMouseOver"!==topLevelType)return null;var win;if(nativeEventTarget.window===nativeEventTarget)win=nativeEventTarget;else{var doc=nativeEventTarget.ownerDocument;win=doc?doc.defaultView||doc.parentWindow:window}var from,to;if("topMouseOut"===topLevelType){from=targetInst;var related=nativeEvent.relatedTarget||nativeEvent.toElement;to=related?ReactDOMComponentTree.getClosestInstanceFromNode(related):null}else from=null,to=targetInst;if(from===to)return null;var fromNode=null==from?win:ReactDOMComponentTree.getNodeFromInstance(from),toNode=null==to?win:ReactDOMComponentTree.getNodeFromInstance(to),leave=SyntheticMouseEvent.getPooled(eventTypes.mouseLeave,from,nativeEvent,nativeEventTarget);leave.type="mouseleave",leave.target=fromNode,leave.relatedTarget=toNode;var enter=SyntheticMouseEvent.getPooled(eventTypes.mouseEnter,to,nativeEvent,nativeEventTarget);return enter.type="mouseenter",enter.target=toNode,enter.relatedTarget=fromNode,EventPropagators.accumulateEnterLeaveDispatches(leave,enter,from,to),[leave,enter]}};module.exports=EnterLeaveEventPlugin},function(module,exports,__webpack_require__){"use strict";function FallbackCompositionState(root){this._root=root,this._startText=this.getText(),this._fallbackText=null}var _assign=__webpack_require__(7),PooledClass=__webpack_require__(23),getTextContentAccessor=__webpack_require__(118);_assign(FallbackCompositionState.prototype,{destructor:function(){this._root=null,this._startText=null,this._fallbackText=null},getText:function(){return"value"in this._root?this._root.value:this._root[getTextContentAccessor()]},getData:function(){if(this._fallbackText)return this._fallbackText;var start,end,startValue=this._startText,startLength=startValue.length,endValue=this.getText(),endLength=endValue.length;for(start=0;start<startLength&&startValue[start]===endValue[start];start++);var minEnd=startLength-start;for(end=1;end<=minEnd&&startValue[startLength-end]===endValue[endLength-end];end++);var sliceTail=end>1?1-end:void 0;return this._fallbackText=endValue.slice(start,sliceTail),this._fallbackText}}),PooledClass.addPoolingTo(FallbackCompositionState),module.exports=FallbackCompositionState},function(module,exports,__webpack_require__){"use strict";var DOMProperty=__webpack_require__(21),MUST_USE_PROPERTY=DOMProperty.injection.MUST_USE_PROPERTY,HAS_BOOLEAN_VALUE=DOMProperty.injection.HAS_BOOLEAN_VALUE,HAS_NUMERIC_VALUE=DOMProperty.injection.HAS_NUMERIC_VALUE,HAS_POSITIVE_NUMERIC_VALUE=DOMProperty.injection.HAS_POSITIVE_NUMERIC_VALUE,HAS_OVERLOADED_BOOLEAN_VALUE=DOMProperty.injection.HAS_OVERLOADED_BOOLEAN_VALUE,HTMLDOMPropertyConfig={isCustomAttribute:RegExp.prototype.test.bind(new RegExp("^(data|aria)-["+DOMProperty.ATTRIBUTE_NAME_CHAR+"]*$")),Properties:{accept:0,acceptCharset:0,accessKey:0,action:0,allowFullScreen:HAS_BOOLEAN_VALUE,allowTransparency:0,alt:0,as:0,async:HAS_BOOLEAN_VALUE,autoComplete:0,autoPlay:HAS_BOOLEAN_VALUE,capture:HAS_BOOLEAN_VALUE,cellPadding:0,cellSpacing:0,charSet:0,challenge:0,checked:MUST_USE_PROPERTY|HAS_BOOLEAN_VALUE,cite:0,classID:0,className:0,cols:HAS_POSITIVE_NUMERIC_VALUE,colSpan:0,content:0,contentEditable:0,contextMenu:0,controls:HAS_BOOLEAN_VALUE,coords:0,crossOrigin:0,data:0,dateTime:0,default:HAS_BOOLEAN_VALUE,defer:HAS_BOOLEAN_VALUE,dir:0,disabled:HAS_BOOLEAN_VALUE,download:HAS_OVERLOADED_BOOLEAN_VALUE,draggable:0,encType:0,form:0,formAction:0,formEncType:0,formMethod:0,formNoValidate:HAS_BOOLEAN_VALUE,formTarget:0,frameBorder:0,headers:0,height:0,hidden:HAS_BOOLEAN_VALUE,high:0,href:0,hrefLang:0,htmlFor:0,httpEquiv:0,icon:0,id:0,inputMode:0,integrity:0,is:0,keyParams:0,keyType:0,kind:0,label:0,lang:0,list:0,loop:HAS_BOOLEAN_VALUE,low:0,manifest:0,marginHeight:0,marginWidth:0,max:0,maxLength:0,media:0,mediaGroup:0,method:0,min:0,minLength:0,multiple:MUST_USE_PROPERTY|HAS_BOOLEAN_VALUE,muted:MUST_USE_PROPERTY|HAS_BOOLEAN_VALUE,name:0,nonce:0,noValidate:HAS_BOOLEAN_VALUE,open:HAS_BOOLEAN_VALUE,optimum:0,pattern:0,placeholder:0,playsInline:HAS_BOOLEAN_VALUE,poster:0,preload:0,profile:0,radioGroup:0,readOnly:HAS_BOOLEAN_VALUE,referrerPolicy:0,rel:0,required:HAS_BOOLEAN_VALUE,reversed:HAS_BOOLEAN_VALUE,role:0,rows:HAS_POSITIVE_NUMERIC_VALUE,rowSpan:HAS_NUMERIC_VALUE,sandbox:0,scope:0,scoped:HAS_BOOLEAN_VALUE,scrolling:0,seamless:HAS_BOOLEAN_VALUE,selected:MUST_USE_PROPERTY|HAS_BOOLEAN_VALUE,shape:0,size:HAS_POSITIVE_NUMERIC_VALUE,sizes:0,span:HAS_POSITIVE_NUMERIC_VALUE,spellCheck:0,src:0,srcDoc:0,srcLang:0,srcSet:0,start:HAS_NUMERIC_VALUE,step:0,style:0,summary:0,tabIndex:0,target:0,title:0,type:0,useMap:0,value:0,width:0,wmode:0,wrap:0,about:0,datatype:0,inlist:0,prefix:0,property:0,resource:0,typeof:0,vocab:0,autoCapitalize:0,autoCorrect:0,autoSave:0,color:0,itemProp:0,itemScope:HAS_BOOLEAN_VALUE,itemType:0,itemID:0,itemRef:0,results:0,security:0,unselectable:0},DOMAttributeNames:{acceptCharset:"accept-charset",className:"class",htmlFor:"for",httpEquiv:"http-equiv"},DOMPropertyNames:{},DOMMutationMethods:{value:function(node,value){if(null==value)return node.removeAttribute("value");"number"!==node.type||!1===node.hasAttribute("value")?node.setAttribute("value",""+value):node.validity&&!node.validity.badInput&&node.ownerDocument.activeElement!==node&&node.setAttribute("value",""+value)}}};module.exports=HTMLDOMPropertyConfig},function(module,exports,__webpack_require__){"use strict";(function(process){function instantiateChild(childInstances,child,name,selfDebugID){var keyUnique=void 0===childInstances[name];"production"!==process.env.NODE_ENV&&(ReactComponentTreeHook||(ReactComponentTreeHook=__webpack_require__(11)),keyUnique||"production"!==process.env.NODE_ENV&&warning(!1,"flattenChildren(...): Encountered two children with the same key, `%s`. Child keys must be unique; when two children share a key, only the first child will be used.%s",KeyEscapeUtils.unescape(name),ReactComponentTreeHook.getStackAddendumByID(selfDebugID))),null!=child&&keyUnique&&(childInstances[name]=instantiateReactComponent(child,!0))}var ReactComponentTreeHook,ReactReconciler=__webpack_require__(27),instantiateReactComponent=__webpack_require__(120),KeyEscapeUtils=__webpack_require__(57),shouldUpdateReactComponent=__webpack_require__(67),traverseAllChildren=__webpack_require__(123),warning=__webpack_require__(2);void 0!==process&&process.env&&"test"===process.env.NODE_ENV&&(ReactComponentTreeHook=__webpack_require__(11));var ReactChildReconciler={instantiateChildren:function(nestedChildNodes,transaction,context,selfDebugID){if(null==nestedChildNodes)return null;var childInstances={};return"production"!==process.env.NODE_ENV?traverseAllChildren(nestedChildNodes,function(childInsts,child,name){return instantiateChild(childInsts,child,name,selfDebugID)},childInstances):traverseAllChildren(nestedChildNodes,instantiateChild,childInstances),childInstances},updateChildren:function(prevChildren,nextChildren,mountImages,removedNodes,transaction,hostParent,hostContainerInfo,context,selfDebugID){if(nextChildren||prevChildren){var name,prevChild;for(name in nextChildren)if(nextChildren.hasOwnProperty(name)){prevChild=prevChildren&&prevChildren[name];var prevElement=prevChild&&prevChild._currentElement,nextElement=nextChildren[name];if(null!=prevChild&&shouldUpdateReactComponent(prevElement,nextElement))ReactReconciler.receiveComponent(prevChild,nextElement,transaction,context),nextChildren[name]=prevChild;else{prevChild&&(removedNodes[name]=ReactReconciler.getHostNode(prevChild),ReactReconciler.unmountComponent(prevChild,!1));var nextChildInstance=instantiateReactComponent(nextElement,!0);nextChildren[name]=nextChildInstance;var nextChildMountImage=ReactReconciler.mountComponent(nextChildInstance,transaction,hostParent,hostContainerInfo,context,selfDebugID);mountImages.push(nextChildMountImage)}}for(name in prevChildren)!prevChildren.hasOwnProperty(name)||nextChildren&&nextChildren.hasOwnProperty(name)||(prevChild=prevChildren[name],removedNodes[name]=ReactReconciler.getHostNode(prevChild),ReactReconciler.unmountComponent(prevChild,!1))}},unmountChildren:function(renderedChildren,safely){for(var name in renderedChildren)if(renderedChildren.hasOwnProperty(name)){var renderedChild=renderedChildren[name];ReactReconciler.unmountComponent(renderedChild,safely)}}};module.exports=ReactChildReconciler}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var DOMChildrenOperations=__webpack_require__(54),ReactDOMIDOperations=__webpack_require__(245),ReactComponentBrowserEnvironment={processChildrenUpdates:ReactDOMIDOperations.dangerouslyProcessChildrenUpdates,replaceNodeWithMarkup:DOMChildrenOperations.dangerouslyReplaceNodeWithMarkup};module.exports=ReactComponentBrowserEnvironment},function(module,exports,__webpack_require__){"use strict";(function(process){function StatelessComponent(Component){}function warnIfInvalidElement(Component,element){"production"!==process.env.NODE_ENV&&("production"!==process.env.NODE_ENV&&warning(null===element||!1===element||React.isValidElement(element),"%s(...): A valid React element (or null) must be returned. You may have returned undefined, an array or some other invalid object.",Component.displayName||Component.name||"Component"),"production"!==process.env.NODE_ENV&&warning(!Component.childContextTypes,"%s(...): childContextTypes cannot be defined on a functional component.",Component.displayName||Component.name||"Component"))}function shouldConstruct(Component){return!(!Component.prototype||!Component.prototype.isReactComponent)}function isPureComponent(Component){return!(!Component.prototype||!Component.prototype.isPureReactComponent)}function measureLifeCyclePerf(fn,debugID,timerType){if(0===debugID)return fn();ReactInstrumentation.debugTool.onBeginLifeCycleTimer(debugID,timerType);try{return fn()}finally{ReactInstrumentation.debugTool.onEndLifeCycleTimer(debugID,timerType)}}var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),React=__webpack_require__(28),ReactComponentEnvironment=__webpack_require__(59),ReactCurrentOwner=__webpack_require__(18),ReactErrorUtils=__webpack_require__(60),ReactInstanceMap=__webpack_require__(32),ReactInstrumentation=__webpack_require__(14),ReactNodeTypes=__webpack_require__(112),ReactReconciler=__webpack_require__(27);if("production"!==process.env.NODE_ENV)var checkReactTypeSpec=__webpack_require__(287);var emptyObject=__webpack_require__(38),invariant=__webpack_require__(1),shallowEqual=__webpack_require__(51),shouldUpdateReactComponent=__webpack_require__(67),warning=__webpack_require__(2),CompositeTypes={ImpureClass:0,PureClass:1,StatelessFunctional:2};StatelessComponent.prototype.render=function(){var Component=ReactInstanceMap.get(this)._currentElement.type,element=Component(this.props,this.context,this.updater);return warnIfInvalidElement(Component,element),element};var nextMountID=1,ReactCompositeComponent={construct:function(element){this._currentElement=element,this._rootNodeID=0,this._compositeType=null,this._instance=null,this._hostParent=null,this._hostContainerInfo=null,this._updateBatchNumber=null,this._pendingElement=null,this._pendingStateQueue=null,this._pendingReplaceState=!1,this._pendingForceUpdate=!1,this._renderedNodeType=null,this._renderedComponent=null,this._context=null,this._mountOrder=0,this._topLevelWrapper=null,this._pendingCallbacks=null,this._calledComponentWillUnmount=!1,"production"!==process.env.NODE_ENV&&(this._warnedAboutRefsInRender=!1)},mountComponent:function(transaction,hostParent,hostContainerInfo,context){var _this=this;this._context=context,this._mountOrder=nextMountID++,this._hostParent=hostParent,this._hostContainerInfo=hostContainerInfo;var renderedElement,publicProps=this._currentElement.props,publicContext=this._processContext(context),Component=this._currentElement.type,updateQueue=transaction.getUpdateQueue(),doConstruct=shouldConstruct(Component),inst=this._constructComponent(doConstruct,publicProps,publicContext,updateQueue);if(doConstruct||null!=inst&&null!=inst.render?isPureComponent(Component)?this._compositeType=CompositeTypes.PureClass:this._compositeType=CompositeTypes.ImpureClass:(renderedElement=inst,warnIfInvalidElement(Component,renderedElement),null===inst||!1===inst||React.isValidElement(inst)||("production"!==process.env.NODE_ENV?invariant(!1,"%s(...): A valid React element (or null) must be returned. You may have returned undefined, an array or some other invalid object.",Component.displayName||Component.name||"Component"):_prodInvariant("105",Component.displayName||Component.name||"Component")),inst=new StatelessComponent(Component),this._compositeType=CompositeTypes.StatelessFunctional),"production"!==process.env.NODE_ENV){null==inst.render&&"production"!==process.env.NODE_ENV&&warning(!1,"%s(...): No `render` method found on the returned component instance: you may have forgotten to define `render`.",Component.displayName||Component.name||"Component");var propsMutated=inst.props!==publicProps,componentName=Component.displayName||Component.name||"Component";"production"!==process.env.NODE_ENV&&warning(void 0===inst.props||!propsMutated,"%s(...): When calling super() in `%s`, make sure to pass up the same props that your component's constructor was passed.",componentName,componentName)}inst.props=publicProps,inst.context=publicContext,inst.refs=emptyObject,inst.updater=updateQueue,this._instance=inst,ReactInstanceMap.set(inst,this),"production"!==process.env.NODE_ENV&&("production"!==process.env.NODE_ENV&&warning(!inst.getInitialState||inst.getInitialState.isReactClassApproved||inst.state,"getInitialState was defined on %s, a plain JavaScript class. This is only supported for classes created using React.createClass. Did you mean to define a state property instead?",this.getName()||"a component"),"production"!==process.env.NODE_ENV&&warning(!inst.getDefaultProps||inst.getDefaultProps.isReactClassApproved,"getDefaultProps was defined on %s, a plain JavaScript class. This is only supported for classes created using React.createClass. Use a static property to define defaultProps instead.",this.getName()||"a component"),"production"!==process.env.NODE_ENV&&warning(!inst.propTypes,"propTypes was defined as an instance property on %s. Use a static property to define propTypes instead.",this.getName()||"a component"),"production"!==process.env.NODE_ENV&&warning(!inst.contextTypes,"contextTypes was defined as an instance property on %s. Use a static property to define contextTypes instead.",this.getName()||"a component"),"production"!==process.env.NODE_ENV&&warning("function"!=typeof inst.componentShouldUpdate,"%s has a method called componentShouldUpdate(). Did you mean shouldComponentUpdate()? The name is phrased as a question because the function is expected to return a value.",this.getName()||"A component"),"production"!==process.env.NODE_ENV&&warning("function"!=typeof inst.componentDidUnmount,"%s has a method called componentDidUnmount(). But there is no such lifecycle method. Did you mean componentWillUnmount()?",this.getName()||"A component"),"production"!==process.env.NODE_ENV&&warning("function"!=typeof inst.componentWillRecieveProps,"%s has a method called componentWillRecieveProps(). Did you mean componentWillReceiveProps()?",this.getName()||"A component"));var initialState=inst.state;void 0===initialState&&(inst.state=initialState=null),("object"!=typeof initialState||Array.isArray(initialState))&&("production"!==process.env.NODE_ENV?invariant(!1,"%s.state: must be set to an object or null",this.getName()||"ReactCompositeComponent"):_prodInvariant("106",this.getName()||"ReactCompositeComponent")),this._pendingStateQueue=null,this._pendingReplaceState=!1,this._pendingForceUpdate=!1;var markup;return markup=inst.unstable_handleError?this.performInitialMountWithErrorHandling(renderedElement,hostParent,hostContainerInfo,transaction,context):this.performInitialMount(renderedElement,hostParent,hostContainerInfo,transaction,context),inst.componentDidMount&&("production"!==process.env.NODE_ENV?transaction.getReactMountReady().enqueue(function(){measureLifeCyclePerf(function(){return inst.componentDidMount()},_this._debugID,"componentDidMount")}):transaction.getReactMountReady().enqueue(inst.componentDidMount,inst)),markup},_constructComponent:function(doConstruct,publicProps,publicContext,updateQueue){if("production"===process.env.NODE_ENV)return this._constructComponentWithoutOwner(doConstruct,publicProps,publicContext,updateQueue);ReactCurrentOwner.current=this;try{return this._constructComponentWithoutOwner(doConstruct,publicProps,publicContext,updateQueue)}finally{ReactCurrentOwner.current=null}},_constructComponentWithoutOwner:function(doConstruct,publicProps,publicContext,updateQueue){var Component=this._currentElement.type;return doConstruct?"production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return new Component(publicProps,publicContext,updateQueue)},this._debugID,"ctor"):new Component(publicProps,publicContext,updateQueue):"production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return Component(publicProps,publicContext,updateQueue)},this._debugID,"render"):Component(publicProps,publicContext,updateQueue)},performInitialMountWithErrorHandling:function(renderedElement,hostParent,hostContainerInfo,transaction,context){var markup,checkpoint=transaction.checkpoint();try{markup=this.performInitialMount(renderedElement,hostParent,hostContainerInfo,transaction,context)}catch(e){transaction.rollback(checkpoint),this._instance.unstable_handleError(e),this._pendingStateQueue&&(this._instance.state=this._processPendingState(this._instance.props,this._instance.context)),checkpoint=transaction.checkpoint(),this._renderedComponent.unmountComponent(!0),transaction.rollback(checkpoint),markup=this.performInitialMount(renderedElement,hostParent,hostContainerInfo,transaction,context)}return markup},performInitialMount:function(renderedElement,hostParent,hostContainerInfo,transaction,context){var inst=this._instance,debugID=0;"production"!==process.env.NODE_ENV&&(debugID=this._debugID),inst.componentWillMount&&("production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return inst.componentWillMount()},debugID,"componentWillMount"):inst.componentWillMount(),this._pendingStateQueue&&(inst.state=this._processPendingState(inst.props,inst.context))),void 0===renderedElement&&(renderedElement=this._renderValidatedComponent());var nodeType=ReactNodeTypes.getType(renderedElement);this._renderedNodeType=nodeType;var child=this._instantiateReactComponent(renderedElement,nodeType!==ReactNodeTypes.EMPTY);this._renderedComponent=child;var markup=ReactReconciler.mountComponent(child,transaction,hostParent,hostContainerInfo,this._processChildContext(context),debugID);if("production"!==process.env.NODE_ENV&&0!==debugID){var childDebugIDs=0!==child._debugID?[child._debugID]:[];ReactInstrumentation.debugTool.onSetChildren(debugID,childDebugIDs)}return markup},getHostNode:function(){return ReactReconciler.getHostNode(this._renderedComponent)},unmountComponent:function(safely){if(this._renderedComponent){var inst=this._instance;if(inst.componentWillUnmount&&!inst._calledComponentWillUnmount)if(inst._calledComponentWillUnmount=!0,safely){var name=this.getName()+".componentWillUnmount()";ReactErrorUtils.invokeGuardedCallback(name,inst.componentWillUnmount.bind(inst))}else"production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return inst.componentWillUnmount()},this._debugID,"componentWillUnmount"):inst.componentWillUnmount();this._renderedComponent&&(ReactReconciler.unmountComponent(this._renderedComponent,safely),this._renderedNodeType=null,this._renderedComponent=null,this._instance=null),this._pendingStateQueue=null,this._pendingReplaceState=!1,this._pendingForceUpdate=!1,this._pendingCallbacks=null,this._pendingElement=null,this._context=null,this._rootNodeID=0,this._topLevelWrapper=null,ReactInstanceMap.remove(inst)}},_maskContext:function(context){var Component=this._currentElement.type,contextTypes=Component.contextTypes;if(!contextTypes)return emptyObject;var maskedContext={};for(var contextName in contextTypes)maskedContext[contextName]=context[contextName];return maskedContext},_processContext:function(context){var maskedContext=this._maskContext(context);if("production"!==process.env.NODE_ENV){var Component=this._currentElement.type;Component.contextTypes&&this._checkContextTypes(Component.contextTypes,maskedContext,"context")}return maskedContext},_processChildContext:function(currentContext){var childContext,Component=this._currentElement.type,inst=this._instance;if(inst.getChildContext)if("production"!==process.env.NODE_ENV){ReactInstrumentation.debugTool.onBeginProcessingChildContext();try{childContext=inst.getChildContext()}finally{ReactInstrumentation.debugTool.onEndProcessingChildContext()}}else childContext=inst.getChildContext();if(childContext){"object"!=typeof Component.childContextTypes&&("production"!==process.env.NODE_ENV?invariant(!1,"%s.getChildContext(): childContextTypes must be defined in order to use getChildContext().",this.getName()||"ReactCompositeComponent"):_prodInvariant("107",this.getName()||"ReactCompositeComponent")),"production"!==process.env.NODE_ENV&&this._checkContextTypes(Component.childContextTypes,childContext,"child context");for(var name in childContext)name in Component.childContextTypes||("production"!==process.env.NODE_ENV?invariant(!1,'%s.getChildContext(): key "%s" is not defined in childContextTypes.',this.getName()||"ReactCompositeComponent",name):_prodInvariant("108",this.getName()||"ReactCompositeComponent",name));return _assign({},currentContext,childContext)}return currentContext},_checkContextTypes:function(typeSpecs,values,location){"production"!==process.env.NODE_ENV&&checkReactTypeSpec(typeSpecs,values,location,this.getName(),null,this._debugID)},receiveComponent:function(nextElement,transaction,nextContext){var prevElement=this._currentElement,prevContext=this._context;this._pendingElement=null,this.updateComponent(transaction,prevElement,nextElement,prevContext,nextContext)},performUpdateIfNecessary:function(transaction){null!=this._pendingElement?ReactReconciler.receiveComponent(this,this._pendingElement,transaction,this._context):null!==this._pendingStateQueue||this._pendingForceUpdate?this.updateComponent(transaction,this._currentElement,this._currentElement,this._context,this._context):this._updateBatchNumber=null},updateComponent:function(transaction,prevParentElement,nextParentElement,prevUnmaskedContext,nextUnmaskedContext){var inst=this._instance;null==inst&&("production"!==process.env.NODE_ENV?invariant(!1,"Attempted to update component `%s` that has already been unmounted (or failed to mount).",this.getName()||"ReactCompositeComponent"):_prodInvariant("136",this.getName()||"ReactCompositeComponent"));var nextContext,willReceive=!1;this._context===nextUnmaskedContext?nextContext=inst.context:(nextContext=this._processContext(nextUnmaskedContext),willReceive=!0);var prevProps=prevParentElement.props,nextProps=nextParentElement.props;prevParentElement!==nextParentElement&&(willReceive=!0),willReceive&&inst.componentWillReceiveProps&&("production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return inst.componentWillReceiveProps(nextProps,nextContext)},this._debugID,"componentWillReceiveProps"):inst.componentWillReceiveProps(nextProps,nextContext));var nextState=this._processPendingState(nextProps,nextContext),shouldUpdate=!0;this._pendingForceUpdate||(inst.shouldComponentUpdate?shouldUpdate="production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return inst.shouldComponentUpdate(nextProps,nextState,nextContext)},this._debugID,"shouldComponentUpdate"):inst.shouldComponentUpdate(nextProps,nextState,nextContext):this._compositeType===CompositeTypes.PureClass&&(shouldUpdate=!shallowEqual(prevProps,nextProps)||!shallowEqual(inst.state,nextState))),"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(void 0!==shouldUpdate,"%s.shouldComponentUpdate(): Returned undefined instead of a boolean value. Make sure to return true or false.",this.getName()||"ReactCompositeComponent"),this._updateBatchNumber=null,shouldUpdate?(this._pendingForceUpdate=!1,this._performComponentUpdate(nextParentElement,nextProps,nextState,nextContext,transaction,nextUnmaskedContext)):(this._currentElement=nextParentElement,this._context=nextUnmaskedContext,inst.props=nextProps,inst.state=nextState,inst.context=nextContext)},_processPendingState:function(props,context){var inst=this._instance,queue=this._pendingStateQueue,replace=this._pendingReplaceState;if(this._pendingReplaceState=!1,this._pendingStateQueue=null,!queue)return inst.state;if(replace&&1===queue.length)return queue[0];for(var nextState=_assign({},replace?queue[0]:inst.state),i=replace?1:0;i<queue.length;i++){var partial=queue[i];_assign(nextState,"function"==typeof partial?partial.call(inst,nextState,props,context):partial)}return nextState},_performComponentUpdate:function(nextElement,nextProps,nextState,nextContext,transaction,unmaskedContext){var prevProps,prevState,prevContext,_this2=this,inst=this._instance,hasComponentDidUpdate=Boolean(inst.componentDidUpdate);hasComponentDidUpdate&&(prevProps=inst.props,prevState=inst.state,prevContext=inst.context),inst.componentWillUpdate&&("production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return inst.componentWillUpdate(nextProps,nextState,nextContext)},this._debugID,"componentWillUpdate"):inst.componentWillUpdate(nextProps,nextState,nextContext)),this._currentElement=nextElement,this._context=unmaskedContext,inst.props=nextProps,inst.state=nextState,inst.context=nextContext,this._updateRenderedComponent(transaction,unmaskedContext),hasComponentDidUpdate&&("production"!==process.env.NODE_ENV?transaction.getReactMountReady().enqueue(function(){measureLifeCyclePerf(inst.componentDidUpdate.bind(inst,prevProps,prevState,prevContext),_this2._debugID,"componentDidUpdate")}):transaction.getReactMountReady().enqueue(inst.componentDidUpdate.bind(inst,prevProps,prevState,prevContext),inst))},_updateRenderedComponent:function(transaction,context){var prevComponentInstance=this._renderedComponent,prevRenderedElement=prevComponentInstance._currentElement,nextRenderedElement=this._renderValidatedComponent(),debugID=0;if("production"!==process.env.NODE_ENV&&(debugID=this._debugID),shouldUpdateReactComponent(prevRenderedElement,nextRenderedElement))ReactReconciler.receiveComponent(prevComponentInstance,nextRenderedElement,transaction,this._processChildContext(context));else{var oldHostNode=ReactReconciler.getHostNode(prevComponentInstance);ReactReconciler.unmountComponent(prevComponentInstance,!1);var nodeType=ReactNodeTypes.getType(nextRenderedElement);this._renderedNodeType=nodeType;var child=this._instantiateReactComponent(nextRenderedElement,nodeType!==ReactNodeTypes.EMPTY);this._renderedComponent=child;var nextMarkup=ReactReconciler.mountComponent(child,transaction,this._hostParent,this._hostContainerInfo,this._processChildContext(context),debugID);if("production"!==process.env.NODE_ENV&&0!==debugID){var childDebugIDs=0!==child._debugID?[child._debugID]:[];ReactInstrumentation.debugTool.onSetChildren(debugID,childDebugIDs)}this._replaceNodeWithMarkup(oldHostNode,nextMarkup,prevComponentInstance)}},_replaceNodeWithMarkup:function(oldHostNode,nextMarkup,prevInstance){ReactComponentEnvironment.replaceNodeWithMarkup(oldHostNode,nextMarkup,prevInstance)},_renderValidatedComponentWithoutOwnerOrContext:function(){var renderedElement,inst=this._instance;return renderedElement="production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return inst.render()},this._debugID,"render"):inst.render(),"production"!==process.env.NODE_ENV&&void 0===renderedElement&&inst.render._isMockFunction&&(renderedElement=null),renderedElement},_renderValidatedComponent:function(){var renderedElement;if("production"!==process.env.NODE_ENV||this._compositeType!==CompositeTypes.StatelessFunctional){ReactCurrentOwner.current=this;try{renderedElement=this._renderValidatedComponentWithoutOwnerOrContext()}finally{ReactCurrentOwner.current=null}}else renderedElement=this._renderValidatedComponentWithoutOwnerOrContext();return null===renderedElement||!1===renderedElement||React.isValidElement(renderedElement)||("production"!==process.env.NODE_ENV?invariant(!1,"%s.render(): A valid React element (or null) must be returned. You may have returned undefined, an array or some other invalid object.",this.getName()||"ReactCompositeComponent"):_prodInvariant("109",this.getName()||"ReactCompositeComponent")),renderedElement},attachRef:function(ref,component){var inst=this.getPublicInstance();null==inst&&("production"!==process.env.NODE_ENV?invariant(!1,"Stateless function components cannot have refs."):_prodInvariant("110"));var publicComponentInstance=component.getPublicInstance();if("production"!==process.env.NODE_ENV){var componentName=component&&component.getName?component.getName():"a component";"production"!==process.env.NODE_ENV&&warning(null!=publicComponentInstance||component._compositeType!==CompositeTypes.StatelessFunctional,'Stateless function components cannot be given refs (See ref "%s" in %s created by %s). Attempts to access this ref will fail.',ref,componentName,this.getName())}(inst.refs===emptyObject?inst.refs={}:inst.refs)[ref]=publicComponentInstance},detachRef:function(ref){delete this.getPublicInstance().refs[ref]},getName:function(){var type=this._currentElement.type,constructor=this._instance&&this._instance.constructor;return type.displayName||constructor&&constructor.displayName||type.name||constructor&&constructor.name||null},getPublicInstance:function(){var inst=this._instance;return this._compositeType===CompositeTypes.StatelessFunctional?null:inst},_instantiateReactComponent:null};module.exports=ReactCompositeComponent}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var ReactDOMComponentTree=__webpack_require__(8),ReactDefaultInjection=__webpack_require__(257),ReactMount=__webpack_require__(111),ReactReconciler=__webpack_require__(27),ReactUpdates=__webpack_require__(17),ReactVersion=__webpack_require__(272),findDOMNode=__webpack_require__(289),getHostComponentFromComposite=__webpack_require__(117),renderSubtreeIntoContainer=__webpack_require__(296),warning=__webpack_require__(2);ReactDefaultInjection.inject();var ReactDOM={findDOMNode:findDOMNode,render:ReactMount.render,unmountComponentAtNode:ReactMount.unmountComponentAtNode,version:ReactVersion,unstable_batchedUpdates:ReactUpdates.batchedUpdates,unstable_renderSubtreeIntoContainer:renderSubtreeIntoContainer};if("undefined"!=typeof __REACT_DEVTOOLS_GLOBAL_HOOK__&&"function"==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.inject&&__REACT_DEVTOOLS_GLOBAL_HOOK__.inject({ComponentTree:{getClosestInstanceFromNode:ReactDOMComponentTree.getClosestInstanceFromNode,getNodeFromInstance:function(inst){return inst._renderedComponent&&(inst=getHostComponentFromComposite(inst)),inst?ReactDOMComponentTree.getNodeFromInstance(inst):null}},Mount:ReactMount,Reconciler:ReactReconciler}),"production"!==process.env.NODE_ENV){if(__webpack_require__(9).canUseDOM&&window.top===window.self){if("undefined"==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__&&(navigator.userAgent.indexOf("Chrome")>-1&&-1===navigator.userAgent.indexOf("Edge")||navigator.userAgent.indexOf("Firefox")>-1)){-1===window.location.protocol.indexOf("http")&&navigator.userAgent.indexOf("Firefox")}var testFunc=function(){};"production"!==process.env.NODE_ENV&&warning(-1!==(testFunc.name||testFunc.toString()).indexOf("testFn"),"It looks like you're using a minified copy of the development build of React. When deploying React apps to production, make sure to use the production build which skips development warnings and is faster. See https://fb.me/react-minification for more details.");var ieCompatibilityMode=document.documentMode&&document.documentMode<8;"production"!==process.env.NODE_ENV&&warning(!ieCompatibilityMode,'Internet Explorer is running in compatibility mode; please add the following tag to your HTML to prevent this from happening: <meta http-equiv="X-UA-Compatible" content="IE=edge" />');for(var expectedFeatures=[Array.isArray,Array.prototype.every,Array.prototype.forEach,Array.prototype.indexOf,Array.prototype.map,Date.now,Function.prototype.bind,Object.keys,String.prototype.trim],i=0;i<expectedFeatures.length;i++)if(!expectedFeatures[i]){"production"!==process.env.NODE_ENV&&warning(!1,"One or more ES5 shims expected by React are not available: https://fb.me/react-warning-polyfills");break}}}if("production"!==process.env.NODE_ENV){var ReactInstrumentation=__webpack_require__(14),ReactDOMUnknownPropertyHook=__webpack_require__(254),ReactDOMNullInputValuePropHook=__webpack_require__(248),ReactDOMInvalidARIAHook=__webpack_require__(247);ReactInstrumentation.debugTool.addHook(ReactDOMUnknownPropertyHook),ReactInstrumentation.debugTool.addHook(ReactDOMNullInputValuePropHook),ReactInstrumentation.debugTool.addHook(ReactDOMInvalidARIAHook)}module.exports=ReactDOM}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function getDeclarationErrorAddendum(internalInstance){if(internalInstance){var owner=internalInstance._currentElement._owner||null;if(owner){var name=owner.getName();if(name)return" This DOM node was rendered by `"+name+"`."}}return""}function friendlyStringify(obj){if("object"==typeof obj){if(Array.isArray(obj))return"["+obj.map(friendlyStringify).join(", ")+"]";var pairs=[];for(var key in obj)if(Object.prototype.hasOwnProperty.call(obj,key)){var keyEscaped=/^[a-z$_][\w$_]*$/i.test(key)?key:JSON.stringify(key);pairs.push(keyEscaped+": "+friendlyStringify(obj[key]))}return"{"+pairs.join(", ")+"}"}return"string"==typeof obj?JSON.stringify(obj):"function"==typeof obj?"[function object]":String(obj)}function checkAndWarnForMutatedStyle(style1,style2,component){if(null!=style1&&null!=style2&&!shallowEqual(style1,style2)){var ownerName,componentName=component._tag,owner=component._currentElement._owner;owner&&(ownerName=owner.getName());var hash=ownerName+"|"+componentName;styleMutationWarning.hasOwnProperty(hash)||(styleMutationWarning[hash]=!0,"production"!==process.env.NODE_ENV&&warning(!1,"`%s` was passed a style object that has previously been mutated. Mutating `style` is deprecated. Consider cloning it beforehand. Check the `render` %s. Previous style: %s. Mutated style: %s.",componentName,owner?"of `"+ownerName+"`":"using <"+componentName+">",friendlyStringify(style1),friendlyStringify(style2)))}}function assertValidProps(component,props){props&&(voidElementTags[component._tag]&&(null!=props.children||null!=props.dangerouslySetInnerHTML)&&("production"!==process.env.NODE_ENV?invariant(!1,"%s is a void element tag and must neither have `children` nor use `dangerouslySetInnerHTML`.%s",component._tag,component._currentElement._owner?" Check the render method of "+component._currentElement._owner.getName()+".":""):_prodInvariant("137",component._tag,component._currentElement._owner?" Check the render method of "+component._currentElement._owner.getName()+".":"")),null!=props.dangerouslySetInnerHTML&&(null!=props.children&&("production"!==process.env.NODE_ENV?invariant(!1,"Can only set one of `children` or `props.dangerouslySetInnerHTML`."):_prodInvariant("60")),"object"==typeof props.dangerouslySetInnerHTML&&HTML in props.dangerouslySetInnerHTML||("production"!==process.env.NODE_ENV?invariant(!1,"`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. Please visit https://fb.me/react-invariant-dangerously-set-inner-html for more information."):_prodInvariant("61"))),"production"!==process.env.NODE_ENV&&("production"!==process.env.NODE_ENV&&warning(null==props.innerHTML,"Directly setting property `innerHTML` is not permitted. For more information, lookup documentation on `dangerouslySetInnerHTML`."),"production"!==process.env.NODE_ENV&&warning(props.suppressContentEditableWarning||!props.contentEditable||null==props.children,"A component is `contentEditable` and contains `children` managed by React. It is now your responsibility to guarantee that none of those nodes are unexpectedly modified or duplicated. This is probably not intentional."),"production"!==process.env.NODE_ENV&&warning(null==props.onFocusIn&&null==props.onFocusOut,"React uses onFocus and onBlur instead of onFocusIn and onFocusOut. All React events are normalized to bubble, so onFocusIn and onFocusOut are not needed/supported by React.")),null!=props.style&&"object"!=typeof props.style&&("production"!==process.env.NODE_ENV?invariant(!1,"The `style` prop expects a mapping from style properties to values, not a string. For example, style={{marginRight: spacing + 'em'}} when using JSX.%s",getDeclarationErrorAddendum(component)):_prodInvariant("62",getDeclarationErrorAddendum(component))))}function enqueuePutListener(inst,registrationName,listener,transaction){if(!(transaction instanceof ReactServerRenderingTransaction)){"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning("onScroll"!==registrationName||isEventSupported("scroll",!0),"This browser doesn't support the `onScroll` event");var containerInfo=inst._hostContainerInfo,isDocumentFragment=containerInfo._node&&containerInfo._node.nodeType===DOC_FRAGMENT_TYPE,doc=isDocumentFragment?containerInfo._node:containerInfo._ownerDocument;listenTo(registrationName,doc),transaction.getReactMountReady().enqueue(putListener,{inst:inst,registrationName:registrationName,listener:listener})}}function putListener(){var listenerToPut=this;EventPluginHub.putListener(listenerToPut.inst,listenerToPut.registrationName,listenerToPut.listener)}function inputPostMount(){var inst=this;ReactDOMInput.postMountWrapper(inst)}function textareaPostMount(){var inst=this;ReactDOMTextarea.postMountWrapper(inst)}function optionPostMount(){var inst=this;ReactDOMOption.postMountWrapper(inst)}function trackInputValue(){inputValueTracking.track(this)}function trapBubbledEventsLocal(){var inst=this;inst._rootNodeID||("production"!==process.env.NODE_ENV?invariant(!1,"Must be mounted to trap events"):_prodInvariant("63"));var node=getNode(inst);switch(node||("production"!==process.env.NODE_ENV?invariant(!1,"trapBubbledEvent(...): Requires node to be rendered."):_prodInvariant("64")),inst._tag){case"iframe":case"object":inst._wrapperState.listeners=[ReactBrowserEventEmitter.trapBubbledEvent("topLoad","load",node)];break;case"video":case"audio":inst._wrapperState.listeners=[];for(var event in mediaEvents)mediaEvents.hasOwnProperty(event)&&inst._wrapperState.listeners.push(ReactBrowserEventEmitter.trapBubbledEvent(event,mediaEvents[event],node));break;case"source":inst._wrapperState.listeners=[ReactBrowserEventEmitter.trapBubbledEvent("topError","error",node)];break;case"img":inst._wrapperState.listeners=[ReactBrowserEventEmitter.trapBubbledEvent("topError","error",node),ReactBrowserEventEmitter.trapBubbledEvent("topLoad","load",node)];break;case"form":inst._wrapperState.listeners=[ReactBrowserEventEmitter.trapBubbledEvent("topReset","reset",node),ReactBrowserEventEmitter.trapBubbledEvent("topSubmit","submit",node)];break;case"input":case"select":case"textarea":inst._wrapperState.listeners=[ReactBrowserEventEmitter.trapBubbledEvent("topInvalid","invalid",node)]}}function postUpdateSelectWrapper(){ReactDOMSelect.postUpdateWrapper(this)}function validateDangerousTag(tag){hasOwnProperty.call(validatedTagCache,tag)||(VALID_TAG_REGEX.test(tag)||("production"!==process.env.NODE_ENV?invariant(!1,"Invalid tag: %s",tag):_prodInvariant("65",tag)),validatedTagCache[tag]=!0)}function isCustomComponent(tagName,props){return tagName.indexOf("-")>=0||null!=props.is}function ReactDOMComponent(element){var tag=element.type;validateDangerousTag(tag),this._currentElement=element,this._tag=tag.toLowerCase(),this._namespaceURI=null,this._renderedChildren=null,this._previousStyle=null,this._previousStyleCopy=null,this._hostNode=null,this._hostParent=null,this._rootNodeID=0,this._domID=0,this._hostContainerInfo=null,this._wrapperState=null,this._topLevelWrapper=null,this._flags=0,"production"!==process.env.NODE_ENV&&(this._ancestorInfo=null,setAndValidateContentChildDev.call(this,null))}var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),AutoFocusUtils=__webpack_require__(228),CSSPropertyOperations=__webpack_require__(230),DOMLazyTree=__webpack_require__(26),DOMNamespaces=__webpack_require__(55),DOMProperty=__webpack_require__(21),DOMPropertyOperations=__webpack_require__(104),EventPluginHub=__webpack_require__(30),EventPluginRegistry=__webpack_require__(39),ReactBrowserEventEmitter=__webpack_require__(40),ReactDOMComponentFlags=__webpack_require__(105),ReactDOMComponentTree=__webpack_require__(8),ReactDOMInput=__webpack_require__(246),ReactDOMOption=__webpack_require__(249),ReactDOMSelect=__webpack_require__(106),ReactDOMTextarea=__webpack_require__(252),ReactInstrumentation=__webpack_require__(14),ReactMultiChild=__webpack_require__(265),ReactServerRenderingTransaction=__webpack_require__(270),emptyFunction=__webpack_require__(12),escapeTextContentForBrowser=__webpack_require__(43),invariant=__webpack_require__(1),isEventSupported=__webpack_require__(66),shallowEqual=__webpack_require__(51),inputValueTracking=__webpack_require__(119),validateDOMNesting=__webpack_require__(68),warning=__webpack_require__(2),Flags=ReactDOMComponentFlags,deleteListener=EventPluginHub.deleteListener,getNode=ReactDOMComponentTree.getNodeFromInstance,listenTo=ReactBrowserEventEmitter.listenTo,registrationNameModules=EventPluginRegistry.registrationNameModules,CONTENT_TYPES={string:!0,number:!0},HTML="__html",RESERVED_PROPS={children:null,dangerouslySetInnerHTML:null,suppressContentEditableWarning:null},DOC_FRAGMENT_TYPE=11,styleMutationWarning={},setAndValidateContentChildDev=emptyFunction;"production"!==process.env.NODE_ENV&&(setAndValidateContentChildDev=function(content){var hasExistingContent=null!=this._contentDebugID,debugID=this._debugID,contentDebugID=-debugID;if(null==content)return hasExistingContent&&ReactInstrumentation.debugTool.onUnmountComponent(this._contentDebugID),void(this._contentDebugID=null);validateDOMNesting(null,String(content),this,this._ancestorInfo),this._contentDebugID=contentDebugID,hasExistingContent?(ReactInstrumentation.debugTool.onBeforeUpdateComponent(contentDebugID,content),ReactInstrumentation.debugTool.onUpdateComponent(contentDebugID)):(ReactInstrumentation.debugTool.onBeforeMountComponent(contentDebugID,content,debugID),ReactInstrumentation.debugTool.onMountComponent(contentDebugID),ReactInstrumentation.debugTool.onSetChildren(debugID,[contentDebugID]))});var mediaEvents={topAbort:"abort",topCanPlay:"canplay",topCanPlayThrough:"canplaythrough",topDurationChange:"durationchange",topEmptied:"emptied",topEncrypted:"encrypted",topEnded:"ended",topError:"error",topLoadedData:"loadeddata",topLoadedMetadata:"loadedmetadata",topLoadStart:"loadstart",topPause:"pause",topPlay:"play",topPlaying:"playing",topProgress:"progress",topRateChange:"ratechange",topSeeked:"seeked",topSeeking:"seeking",topStalled:"stalled",topSuspend:"suspend",topTimeUpdate:"timeupdate",topVolumeChange:"volumechange",topWaiting:"waiting"},omittedCloseTags={area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0},newlineEatingTags={listing:!0,pre:!0,textarea:!0},voidElementTags=_assign({menuitem:!0},omittedCloseTags),VALID_TAG_REGEX=/^[a-zA-Z][a-zA-Z:_\.\-\d]*$/,validatedTagCache={},hasOwnProperty={}.hasOwnProperty,globalIdCounter=1;ReactDOMComponent.displayName="ReactDOMComponent",ReactDOMComponent.Mixin={mountComponent:function(transaction,hostParent,hostContainerInfo,context){this._rootNodeID=globalIdCounter++,this._domID=hostContainerInfo._idCounter++,this._hostParent=hostParent,this._hostContainerInfo=hostContainerInfo;var props=this._currentElement.props;switch(this._tag){case"audio":case"form":case"iframe":case"img":case"link":case"object":case"source":case"video":this._wrapperState={listeners:null},transaction.getReactMountReady().enqueue(trapBubbledEventsLocal,this);break;case"input":ReactDOMInput.mountWrapper(this,props,hostParent),props=ReactDOMInput.getHostProps(this,props),transaction.getReactMountReady().enqueue(trackInputValue,this),transaction.getReactMountReady().enqueue(trapBubbledEventsLocal,this);break;case"option":ReactDOMOption.mountWrapper(this,props,hostParent),props=ReactDOMOption.getHostProps(this,props);break;case"select":ReactDOMSelect.mountWrapper(this,props,hostParent),props=ReactDOMSelect.getHostProps(this,props),transaction.getReactMountReady().enqueue(trapBubbledEventsLocal,this);break;case"textarea":ReactDOMTextarea.mountWrapper(this,props,hostParent),props=ReactDOMTextarea.getHostProps(this,props),transaction.getReactMountReady().enqueue(trackInputValue,this),transaction.getReactMountReady().enqueue(trapBubbledEventsLocal,this)}assertValidProps(this,props);var namespaceURI,parentTag;if(null!=hostParent?(namespaceURI=hostParent._namespaceURI,parentTag=hostParent._tag):hostContainerInfo._tag&&(namespaceURI=hostContainerInfo._namespaceURI,parentTag=hostContainerInfo._tag),(null==namespaceURI||namespaceURI===DOMNamespaces.svg&&"foreignobject"===parentTag)&&(namespaceURI=DOMNamespaces.html),namespaceURI===DOMNamespaces.html&&("svg"===this._tag?namespaceURI=DOMNamespaces.svg:"math"===this._tag&&(namespaceURI=DOMNamespaces.mathml)),this._namespaceURI=namespaceURI,"production"!==process.env.NODE_ENV){var parentInfo;null!=hostParent?parentInfo=hostParent._ancestorInfo:hostContainerInfo._tag&&(parentInfo=hostContainerInfo._ancestorInfo),parentInfo&&validateDOMNesting(this._tag,null,this,parentInfo),this._ancestorInfo=validateDOMNesting.updatedAncestorInfo(parentInfo,this._tag,this)}var mountImage;if(transaction.useCreateElement){var el,ownerDocument=hostContainerInfo._ownerDocument;if(namespaceURI===DOMNamespaces.html)if("script"===this._tag){var div=ownerDocument.createElement("div"),type=this._currentElement.type;div.innerHTML="<"+type+"></"+type+">",el=div.removeChild(div.firstChild)}else el=props.is?ownerDocument.createElement(this._currentElement.type,props.is):ownerDocument.createElement(this._currentElement.type);else el=ownerDocument.createElementNS(namespaceURI,this._currentElement.type);ReactDOMComponentTree.precacheNode(this,el),this._flags|=Flags.hasCachedChildNodes,this._hostParent||DOMPropertyOperations.setAttributeForRoot(el),this._updateDOMProperties(null,props,transaction);var lazyTree=DOMLazyTree(el);this._createInitialChildren(transaction,props,context,lazyTree),mountImage=lazyTree}else{var tagOpen=this._createOpenTagMarkupAndPutListeners(transaction,props),tagContent=this._createContentMarkup(transaction,props,context);mountImage=!tagContent&&omittedCloseTags[this._tag]?tagOpen+"/>":tagOpen+">"+tagContent+"</"+this._currentElement.type+">"}switch(this._tag){case"input":transaction.getReactMountReady().enqueue(inputPostMount,this),props.autoFocus&&transaction.getReactMountReady().enqueue(AutoFocusUtils.focusDOMComponent,this);break;case"textarea":transaction.getReactMountReady().enqueue(textareaPostMount,this),props.autoFocus&&transaction.getReactMountReady().enqueue(AutoFocusUtils.focusDOMComponent,this);break;case"select":case"button":props.autoFocus&&transaction.getReactMountReady().enqueue(AutoFocusUtils.focusDOMComponent,this);break;case"option":transaction.getReactMountReady().enqueue(optionPostMount,this)}return mountImage},_createOpenTagMarkupAndPutListeners:function(transaction,props){var ret="<"+this._currentElement.type;for(var propKey in props)if(props.hasOwnProperty(propKey)){var propValue=props[propKey];if(null!=propValue)if(registrationNameModules.hasOwnProperty(propKey))propValue&&enqueuePutListener(this,propKey,propValue,transaction);else{"style"===propKey&&(propValue&&("production"!==process.env.NODE_ENV&&(this._previousStyle=propValue),propValue=this._previousStyleCopy=_assign({},props.style)),propValue=CSSPropertyOperations.createMarkupForStyles(propValue,this));var markup=null;null!=this._tag&&isCustomComponent(this._tag,props)?RESERVED_PROPS.hasOwnProperty(propKey)||(markup=DOMPropertyOperations.createMarkupForCustomAttribute(propKey,propValue)):markup=DOMPropertyOperations.createMarkupForProperty(propKey,propValue),markup&&(ret+=" "+markup)}}return transaction.renderToStaticMarkup?ret:(this._hostParent||(ret+=" "+DOMPropertyOperations.createMarkupForRoot()),ret+=" "+DOMPropertyOperations.createMarkupForID(this._domID))},_createContentMarkup:function(transaction,props,context){var ret="",innerHTML=props.dangerouslySetInnerHTML;if(null!=innerHTML)null!=innerHTML.__html&&(ret=innerHTML.__html);else{var contentToUse=CONTENT_TYPES[typeof props.children]?props.children:null,childrenToUse=null!=contentToUse?null:props.children;if(null!=contentToUse)ret=escapeTextContentForBrowser(contentToUse),"production"!==process.env.NODE_ENV&&setAndValidateContentChildDev.call(this,contentToUse);else if(null!=childrenToUse){var mountImages=this.mountChildren(childrenToUse,transaction,context);ret=mountImages.join("")}}return newlineEatingTags[this._tag]&&"\n"===ret.charAt(0)?"\n"+ret:ret},_createInitialChildren:function(transaction,props,context,lazyTree){var innerHTML=props.dangerouslySetInnerHTML;if(null!=innerHTML)null!=innerHTML.__html&&DOMLazyTree.queueHTML(lazyTree,innerHTML.__html);else{var contentToUse=CONTENT_TYPES[typeof props.children]?props.children:null,childrenToUse=null!=contentToUse?null:props.children;if(null!=contentToUse)""!==contentToUse&&("production"!==process.env.NODE_ENV&&setAndValidateContentChildDev.call(this,contentToUse),DOMLazyTree.queueText(lazyTree,contentToUse));else if(null!=childrenToUse)for(var mountImages=this.mountChildren(childrenToUse,transaction,context),i=0;i<mountImages.length;i++)DOMLazyTree.queueChild(lazyTree,mountImages[i])}},receiveComponent:function(nextElement,transaction,context){var prevElement=this._currentElement;this._currentElement=nextElement,this.updateComponent(transaction,prevElement,nextElement,context)},updateComponent:function(transaction,prevElement,nextElement,context){var lastProps=prevElement.props,nextProps=this._currentElement.props;switch(this._tag){case"input":lastProps=ReactDOMInput.getHostProps(this,lastProps),nextProps=ReactDOMInput.getHostProps(this,nextProps);break;case"option":lastProps=ReactDOMOption.getHostProps(this,lastProps),nextProps=ReactDOMOption.getHostProps(this,nextProps);break;case"select":lastProps=ReactDOMSelect.getHostProps(this,lastProps),nextProps=ReactDOMSelect.getHostProps(this,nextProps);break;case"textarea":lastProps=ReactDOMTextarea.getHostProps(this,lastProps),nextProps=ReactDOMTextarea.getHostProps(this,nextProps)}switch(assertValidProps(this,nextProps),this._updateDOMProperties(lastProps,nextProps,transaction),this._updateDOMChildren(lastProps,nextProps,transaction,context),this._tag){case"input":ReactDOMInput.updateWrapper(this);break;case"textarea":ReactDOMTextarea.updateWrapper(this);break;case"select":transaction.getReactMountReady().enqueue(postUpdateSelectWrapper,this)}},_updateDOMProperties:function(lastProps,nextProps,transaction){var propKey,styleName,styleUpdates;for(propKey in lastProps)if(!nextProps.hasOwnProperty(propKey)&&lastProps.hasOwnProperty(propKey)&&null!=lastProps[propKey])if("style"===propKey){var lastStyle=this._previousStyleCopy;for(styleName in lastStyle)lastStyle.hasOwnProperty(styleName)&&(styleUpdates=styleUpdates||{},styleUpdates[styleName]="");this._previousStyleCopy=null}else registrationNameModules.hasOwnProperty(propKey)?lastProps[propKey]&&deleteListener(this,propKey):isCustomComponent(this._tag,lastProps)?RESERVED_PROPS.hasOwnProperty(propKey)||DOMPropertyOperations.deleteValueForAttribute(getNode(this),propKey):(DOMProperty.properties[propKey]||DOMProperty.isCustomAttribute(propKey))&&DOMPropertyOperations.deleteValueForProperty(getNode(this),propKey);for(propKey in nextProps){var nextProp=nextProps[propKey],lastProp="style"===propKey?this._previousStyleCopy:null!=lastProps?lastProps[propKey]:void 0;if(nextProps.hasOwnProperty(propKey)&&nextProp!==lastProp&&(null!=nextProp||null!=lastProp))if("style"===propKey)if(nextProp?("production"!==process.env.NODE_ENV&&(checkAndWarnForMutatedStyle(this._previousStyleCopy,this._previousStyle,this),this._previousStyle=nextProp),nextProp=this._previousStyleCopy=_assign({},nextProp)):this._previousStyleCopy=null,lastProp){for(styleName in lastProp)!lastProp.hasOwnProperty(styleName)||nextProp&&nextProp.hasOwnProperty(styleName)||(styleUpdates=styleUpdates||{},styleUpdates[styleName]="");for(styleName in nextProp)nextProp.hasOwnProperty(styleName)&&lastProp[styleName]!==nextProp[styleName]&&(styleUpdates=styleUpdates||{},styleUpdates[styleName]=nextProp[styleName])}else styleUpdates=nextProp;else if(registrationNameModules.hasOwnProperty(propKey))nextProp?enqueuePutListener(this,propKey,nextProp,transaction):lastProp&&deleteListener(this,propKey);else if(isCustomComponent(this._tag,nextProps))RESERVED_PROPS.hasOwnProperty(propKey)||DOMPropertyOperations.setValueForAttribute(getNode(this),propKey,nextProp);else if(DOMProperty.properties[propKey]||DOMProperty.isCustomAttribute(propKey)){var node=getNode(this);null!=nextProp?DOMPropertyOperations.setValueForProperty(node,propKey,nextProp):DOMPropertyOperations.deleteValueForProperty(node,propKey)}}styleUpdates&&CSSPropertyOperations.setValueForStyles(getNode(this),styleUpdates,this)},_updateDOMChildren:function(lastProps,nextProps,transaction,context){var lastContent=CONTENT_TYPES[typeof lastProps.children]?lastProps.children:null,nextContent=CONTENT_TYPES[typeof nextProps.children]?nextProps.children:null,lastHtml=lastProps.dangerouslySetInnerHTML&&lastProps.dangerouslySetInnerHTML.__html,nextHtml=nextProps.dangerouslySetInnerHTML&&nextProps.dangerouslySetInnerHTML.__html,lastChildren=null!=lastContent?null:lastProps.children,nextChildren=null!=nextContent?null:nextProps.children,lastHasContentOrHtml=null!=lastContent||null!=lastHtml,nextHasContentOrHtml=null!=nextContent||null!=nextHtml;null!=lastChildren&&null==nextChildren?this.updateChildren(null,transaction,context):lastHasContentOrHtml&&!nextHasContentOrHtml&&(this.updateTextContent(""),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onSetChildren(this._debugID,[])),null!=nextContent?lastContent!==nextContent&&(this.updateTextContent(""+nextContent),"production"!==process.env.NODE_ENV&&setAndValidateContentChildDev.call(this,nextContent)):null!=nextHtml?(lastHtml!==nextHtml&&this.updateMarkup(""+nextHtml),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onSetChildren(this._debugID,[])):null!=nextChildren&&("production"!==process.env.NODE_ENV&&setAndValidateContentChildDev.call(this,null),this.updateChildren(nextChildren,transaction,context))},getHostNode:function(){return getNode(this)},unmountComponent:function(safely){switch(this._tag){case"audio":case"form":case"iframe":case"img":case"link":case"object":case"source":case"video":var listeners=this._wrapperState.listeners;if(listeners)for(var i=0;i<listeners.length;i++)listeners[i].remove();break;case"input":case"textarea":inputValueTracking.stopTracking(this);break;case"html":case"head":case"body":"production"!==process.env.NODE_ENV?invariant(!1,"<%s> tried to unmount. Because of cross-browser quirks it is impossible to unmount some top-level components (eg <html>, <head>, and <body>) reliably and efficiently. To fix this, have a single top-level component that never unmounts render these elements.",this._tag):_prodInvariant("66",this._tag)}this.unmountChildren(safely),ReactDOMComponentTree.uncacheNode(this),EventPluginHub.deleteAllListeners(this),this._rootNodeID=0,this._domID=0,this._wrapperState=null,"production"!==process.env.NODE_ENV&&setAndValidateContentChildDev.call(this,null)},getPublicInstance:function(){return getNode(this)}},_assign(ReactDOMComponent.prototype,ReactDOMComponent.Mixin,ReactMultiChild.Mixin),module.exports=ReactDOMComponent}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function ReactDOMContainerInfo(topLevelWrapper,node){var info={_topLevelWrapper:topLevelWrapper,_idCounter:1,_ownerDocument:node?node.nodeType===DOC_NODE_TYPE?node:node.ownerDocument:null,_node:node,_tag:node?node.nodeName.toLowerCase():null,_namespaceURI:node?node.namespaceURI:null};return"production"!==process.env.NODE_ENV&&(info._ancestorInfo=node?validateDOMNesting.updatedAncestorInfo(null,info._tag,null):null),info}var validateDOMNesting=__webpack_require__(68),DOC_NODE_TYPE=9;module.exports=ReactDOMContainerInfo}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var _assign=__webpack_require__(7),DOMLazyTree=__webpack_require__(26),ReactDOMComponentTree=__webpack_require__(8),ReactDOMEmptyComponent=function(instantiate){this._currentElement=null,this._hostNode=null,this._hostParent=null,this._hostContainerInfo=null,this._domID=0};_assign(ReactDOMEmptyComponent.prototype,{mountComponent:function(transaction,hostParent,hostContainerInfo,context){var domID=hostContainerInfo._idCounter++;this._domID=domID,this._hostParent=hostParent,this._hostContainerInfo=hostContainerInfo;var nodeValue=" react-empty: "+this._domID+" ";if(transaction.useCreateElement){var ownerDocument=hostContainerInfo._ownerDocument,node=ownerDocument.createComment(nodeValue);return ReactDOMComponentTree.precacheNode(this,node),DOMLazyTree(node)}return transaction.renderToStaticMarkup?"":"\x3c!--"+nodeValue+"--\x3e"},receiveComponent:function(){},getHostNode:function(){return ReactDOMComponentTree.getNodeFromInstance(this)},unmountComponent:function(){ReactDOMComponentTree.uncacheNode(this)}}),module.exports=ReactDOMEmptyComponent},function(module,exports,__webpack_require__){"use strict";var ReactDOMFeatureFlags={useCreateElement:!0,useFiber:!1};module.exports=ReactDOMFeatureFlags},function(module,exports,__webpack_require__){"use strict";var DOMChildrenOperations=__webpack_require__(54),ReactDOMComponentTree=__webpack_require__(8),ReactDOMIDOperations={dangerouslyProcessChildrenUpdates:function(parentInst,updates){var node=ReactDOMComponentTree.getNodeFromInstance(parentInst);DOMChildrenOperations.processUpdates(node,updates)}};module.exports=ReactDOMIDOperations},function(module,exports,__webpack_require__){"use strict";(function(process){function forceUpdateIfMounted(){this._rootNodeID&&ReactDOMInput.updateWrapper(this)}function isControlled(props){return"checkbox"===props.type||"radio"===props.type?null!=props.checked:null!=props.value}function _handleChange(event){var props=this._currentElement.props,returnValue=LinkedValueUtils.executeOnChange(props,event);ReactUpdates.asap(forceUpdateIfMounted,this);var name=props.name;if("radio"===props.type&&null!=name){for(var rootNode=ReactDOMComponentTree.getNodeFromInstance(this),queryRoot=rootNode;queryRoot.parentNode;)queryRoot=queryRoot.parentNode;for(var group=queryRoot.querySelectorAll("input[name="+JSON.stringify(""+name)+'][type="radio"]'),i=0;i<group.length;i++){var otherNode=group[i];if(otherNode!==rootNode&&otherNode.form===rootNode.form){var otherInstance=ReactDOMComponentTree.getInstanceFromNode(otherNode);otherInstance||("production"!==process.env.NODE_ENV?invariant(!1,"ReactDOMInput: Mixing React and non-React radio inputs with the same `name` is not supported."):_prodInvariant("90")),ReactUpdates.asap(forceUpdateIfMounted,otherInstance)}}}return returnValue}var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),DOMPropertyOperations=__webpack_require__(104),LinkedValueUtils=__webpack_require__(58),ReactDOMComponentTree=__webpack_require__(8),ReactUpdates=__webpack_require__(17),invariant=__webpack_require__(1),warning=__webpack_require__(2),didWarnValueLink=!1,didWarnCheckedLink=!1,didWarnValueDefaultValue=!1,didWarnCheckedDefaultChecked=!1,didWarnControlledToUncontrolled=!1,didWarnUncontrolledToControlled=!1,ReactDOMInput={getHostProps:function(inst,props){var value=LinkedValueUtils.getValue(props),checked=LinkedValueUtils.getChecked(props);return _assign({type:void 0,step:void 0,min:void 0,max:void 0},props,{defaultChecked:void 0,defaultValue:void 0,value:null!=value?value:inst._wrapperState.initialValue,checked:null!=checked?checked:inst._wrapperState.initialChecked,onChange:inst._wrapperState.onChange})},mountWrapper:function(inst,props){if("production"!==process.env.NODE_ENV){LinkedValueUtils.checkPropTypes("input",props,inst._currentElement._owner);var owner=inst._currentElement._owner;void 0===props.valueLink||didWarnValueLink||("production"!==process.env.NODE_ENV&&warning(!1,"`valueLink` prop on `input` is deprecated; set `value` and `onChange` instead."),didWarnValueLink=!0),void 0===props.checkedLink||didWarnCheckedLink||("production"!==process.env.NODE_ENV&&warning(!1,"`checkedLink` prop on `input` is deprecated; set `value` and `onChange` instead."),didWarnCheckedLink=!0),void 0===props.checked||void 0===props.defaultChecked||didWarnCheckedDefaultChecked||("production"!==process.env.NODE_ENV&&warning(!1,"%s contains an input of type %s with both checked and defaultChecked props. Input elements must be either controlled or uncontrolled (specify either the checked prop, or the defaultChecked prop, but not both). Decide between using a controlled or uncontrolled input element and remove one of these props. More info: https://fb.me/react-controlled-components",owner&&owner.getName()||"A component",props.type),didWarnCheckedDefaultChecked=!0),void 0===props.value||void 0===props.defaultValue||didWarnValueDefaultValue||("production"!==process.env.NODE_ENV&&warning(!1,"%s contains an input of type %s with both value and defaultValue props. Input elements must be either controlled or uncontrolled (specify either the value prop, or the defaultValue prop, but not both). Decide between using a controlled or uncontrolled input element and remove one of these props. More info: https://fb.me/react-controlled-components",owner&&owner.getName()||"A component",props.type),didWarnValueDefaultValue=!0)}var defaultValue=props.defaultValue;inst._wrapperState={initialChecked:null!=props.checked?props.checked:props.defaultChecked,initialValue:null!=props.value?props.value:defaultValue,listeners:null,onChange:_handleChange.bind(inst),controlled:isControlled(props)}},updateWrapper:function(inst){var props=inst._currentElement.props;if("production"!==process.env.NODE_ENV){var controlled=isControlled(props),owner=inst._currentElement._owner;inst._wrapperState.controlled||!controlled||didWarnUncontrolledToControlled||("production"!==process.env.NODE_ENV&&warning(!1,"%s is changing an uncontrolled input of type %s to be controlled. Input elements should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component. More info: https://fb.me/react-controlled-components",owner&&owner.getName()||"A component",props.type),didWarnUncontrolledToControlled=!0),!inst._wrapperState.controlled||controlled||didWarnControlledToUncontrolled||("production"!==process.env.NODE_ENV&&warning(!1,"%s is changing a controlled input of type %s to be uncontrolled. Input elements should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component. More info: https://fb.me/react-controlled-components",owner&&owner.getName()||"A component",props.type),didWarnControlledToUncontrolled=!0)}var checked=props.checked;null!=checked&&DOMPropertyOperations.setValueForProperty(ReactDOMComponentTree.getNodeFromInstance(inst),"checked",checked||!1);var node=ReactDOMComponentTree.getNodeFromInstance(inst),value=LinkedValueUtils.getValue(props);if(null!=value)if(0===value&&""===node.value)node.value="0";else if("number"===props.type){var valueAsNumber=parseFloat(node.value,10)||0;(value!=valueAsNumber||value==valueAsNumber&&node.value!=value)&&(node.value=""+value)}else node.value!==""+value&&(node.value=""+value);else null==props.value&&null!=props.defaultValue&&node.defaultValue!==""+props.defaultValue&&(node.defaultValue=""+props.defaultValue),null==props.checked&&null!=props.defaultChecked&&(node.defaultChecked=!!props.defaultChecked)},postMountWrapper:function(inst){var props=inst._currentElement.props,node=ReactDOMComponentTree.getNodeFromInstance(inst);switch(props.type){case"submit":case"reset":break;case"color":case"date":case"datetime":case"datetime-local":case"month":case"time":case"week":node.value="",node.value=node.defaultValue;break;default:node.value=node.value}var name=node.name;""!==name&&(node.name=""),node.defaultChecked=!node.defaultChecked,node.defaultChecked=!node.defaultChecked,""!==name&&(node.name=name)}};module.exports=ReactDOMInput}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function validateProperty(tagName,name,debugID){if(warnedProperties.hasOwnProperty(name)&&warnedProperties[name])return!0;if(rARIA.test(name)){var lowerCasedName=name.toLowerCase(),standardName=DOMProperty.getPossibleStandardName.hasOwnProperty(lowerCasedName)?DOMProperty.getPossibleStandardName[lowerCasedName]:null;if(null==standardName)return warnedProperties[name]=!0,!1;if(name!==standardName)return"production"!==process.env.NODE_ENV&&warning(!1,"Unknown ARIA attribute %s. Did you mean %s?%s",name,standardName,ReactComponentTreeHook.getStackAddendumByID(debugID)),warnedProperties[name]=!0,!0}return!0}function warnInvalidARIAProps(debugID,element){var invalidProps=[];for(var key in element.props){validateProperty(element.type,key,debugID)||invalidProps.push(key)}var unknownPropString=invalidProps.map(function(prop){return"`"+prop+"`"}).join(", ");1===invalidProps.length?"production"!==process.env.NODE_ENV&&warning(!1,"Invalid aria prop %s on <%s> tag. For details, see https://fb.me/invalid-aria-prop%s",unknownPropString,element.type,ReactComponentTreeHook.getStackAddendumByID(debugID)):invalidProps.length>1&&"production"!==process.env.NODE_ENV&&warning(!1,"Invalid aria props %s on <%s> tag. For details, see https://fb.me/invalid-aria-prop%s",unknownPropString,element.type,ReactComponentTreeHook.getStackAddendumByID(debugID))}function handleElement(debugID,element){null!=element&&"string"==typeof element.type&&(element.type.indexOf("-")>=0||element.props.is||warnInvalidARIAProps(debugID,element))}var DOMProperty=__webpack_require__(21),ReactComponentTreeHook=__webpack_require__(11),warning=__webpack_require__(2),warnedProperties={},rARIA=new RegExp("^(aria)-["+DOMProperty.ATTRIBUTE_NAME_CHAR+"]*$"),ReactDOMInvalidARIAHook={onBeforeMountComponent:function(debugID,element){"production"!==process.env.NODE_ENV&&handleElement(debugID,element)},onBeforeUpdateComponent:function(debugID,element){"production"!==process.env.NODE_ENV&&handleElement(debugID,element)}};module.exports=ReactDOMInvalidARIAHook}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function handleElement(debugID,element){null!=element&&("input"!==element.type&&"textarea"!==element.type&&"select"!==element.type||null==element.props||null!==element.props.value||didWarnValueNull||("production"!==process.env.NODE_ENV&&warning(!1,"`value` prop on `%s` should not be null. Consider using the empty string to clear the component or `undefined` for uncontrolled components.%s",element.type,ReactComponentTreeHook.getStackAddendumByID(debugID)),didWarnValueNull=!0))}var ReactComponentTreeHook=__webpack_require__(11),warning=__webpack_require__(2),didWarnValueNull=!1,ReactDOMNullInputValuePropHook={onBeforeMountComponent:function(debugID,element){handleElement(debugID,element)},onBeforeUpdateComponent:function(debugID,element){handleElement(debugID,element)}};module.exports=ReactDOMNullInputValuePropHook}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function flattenChildren(children){var content="";return React.Children.forEach(children,function(child){null!=child&&("string"==typeof child||"number"==typeof child?content+=child:didWarnInvalidOptionChildren||(didWarnInvalidOptionChildren=!0,"production"!==process.env.NODE_ENV&&warning(!1,"Only strings and numbers are supported as <option> children.")))}),content}var _assign=__webpack_require__(7),React=__webpack_require__(28),ReactDOMComponentTree=__webpack_require__(8),ReactDOMSelect=__webpack_require__(106),warning=__webpack_require__(2),didWarnInvalidOptionChildren=!1,ReactDOMOption={mountWrapper:function(inst,props,hostParent){"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(null==props.selected,"Use the `defaultValue` or `value` props on <select> instead of setting `selected` on <option>.");var selectValue=null;if(null!=hostParent){var selectParent=hostParent;"optgroup"===selectParent._tag&&(selectParent=selectParent._hostParent),null!=selectParent&&"select"===selectParent._tag&&(selectValue=ReactDOMSelect.getSelectValueContext(selectParent))}var selected=null;if(null!=selectValue){var value;if(value=null!=props.value?props.value+"":flattenChildren(props.children),selected=!1,Array.isArray(selectValue)){for(var i=0;i<selectValue.length;i++)if(""+selectValue[i]===value){selected=!0;break}}else selected=""+selectValue===value}inst._wrapperState={selected:selected}},postMountWrapper:function(inst){var props=inst._currentElement.props;if(null!=props.value){ReactDOMComponentTree.getNodeFromInstance(inst).setAttribute("value",props.value)}},getHostProps:function(inst,props){var hostProps=_assign({selected:void 0,children:void 0},props);null!=inst._wrapperState.selected&&(hostProps.selected=inst._wrapperState.selected);var content=flattenChildren(props.children);return content&&(hostProps.children=content),hostProps}};module.exports=ReactDOMOption}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function isCollapsed(anchorNode,anchorOffset,focusNode,focusOffset){return anchorNode===focusNode&&anchorOffset===focusOffset}function getIEOffsets(node){var selection=document.selection,selectedRange=selection.createRange(),selectedLength=selectedRange.text.length,fromStart=selectedRange.duplicate();fromStart.moveToElementText(node),fromStart.setEndPoint("EndToStart",selectedRange);var startOffset=fromStart.text.length;return{start:startOffset,end:startOffset+selectedLength}}function getModernOffsets(node){var selection=window.getSelection&&window.getSelection();if(!selection||0===selection.rangeCount)return null;var anchorNode=selection.anchorNode,anchorOffset=selection.anchorOffset,focusNode=selection.focusNode,focusOffset=selection.focusOffset,currentRange=selection.getRangeAt(0);try{currentRange.startContainer.nodeType,currentRange.endContainer.nodeType}catch(e){return null}var isSelectionCollapsed=isCollapsed(selection.anchorNode,selection.anchorOffset,selection.focusNode,selection.focusOffset),rangeLength=isSelectionCollapsed?0:currentRange.toString().length,tempRange=currentRange.cloneRange();tempRange.selectNodeContents(node),tempRange.setEnd(currentRange.startContainer,currentRange.startOffset);var isTempRangeCollapsed=isCollapsed(tempRange.startContainer,tempRange.startOffset,tempRange.endContainer,tempRange.endOffset),start=isTempRangeCollapsed?0:tempRange.toString().length,end=start+rangeLength,detectionRange=document.createRange();detectionRange.setStart(anchorNode,anchorOffset),detectionRange.setEnd(focusNode,focusOffset);var isBackward=detectionRange.collapsed;return{start:isBackward?end:start,end:isBackward?start:end}}function setIEOffsets(node,offsets){var start,end,range=document.selection.createRange().duplicate();void 0===offsets.end?(start=offsets.start,end=start):offsets.start>offsets.end?(start=offsets.end,end=offsets.start):(start=offsets.start,end=offsets.end),range.moveToElementText(node),range.moveStart("character",start),range.setEndPoint("EndToStart",range),range.moveEnd("character",end-start),range.select()}function setModernOffsets(node,offsets){if(window.getSelection){var selection=window.getSelection(),length=node[getTextContentAccessor()].length,start=Math.min(offsets.start,length),end=void 0===offsets.end?start:Math.min(offsets.end,length);if(!selection.extend&&start>end){var temp=end;end=start,start=temp}var startMarker=getNodeForCharacterOffset(node,start),endMarker=getNodeForCharacterOffset(node,end);if(startMarker&&endMarker){var range=document.createRange();range.setStart(startMarker.node,startMarker.offset),selection.removeAllRanges(),start>end?(selection.addRange(range),selection.extend(endMarker.node,endMarker.offset)):(range.setEnd(endMarker.node,endMarker.offset),selection.addRange(range))}}}var ExecutionEnvironment=__webpack_require__(9),getNodeForCharacterOffset=__webpack_require__(293),getTextContentAccessor=__webpack_require__(118),useIEOffsets=ExecutionEnvironment.canUseDOM&&"selection"in document&&!("getSelection"in window),ReactDOMSelection={getOffsets:useIEOffsets?getIEOffsets:getModernOffsets,setOffsets:useIEOffsets?setIEOffsets:setModernOffsets};module.exports=ReactDOMSelection},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),DOMChildrenOperations=__webpack_require__(54),DOMLazyTree=__webpack_require__(26),ReactDOMComponentTree=__webpack_require__(8),escapeTextContentForBrowser=__webpack_require__(43),invariant=__webpack_require__(1),validateDOMNesting=__webpack_require__(68),ReactDOMTextComponent=function(text){this._currentElement=text,this._stringText=""+text,this._hostNode=null,this._hostParent=null,this._domID=0,this._mountIndex=0,this._closingComment=null,this._commentNodes=null};_assign(ReactDOMTextComponent.prototype,{mountComponent:function(transaction,hostParent,hostContainerInfo,context){if("production"!==process.env.NODE_ENV){var parentInfo;null!=hostParent?parentInfo=hostParent._ancestorInfo:null!=hostContainerInfo&&(parentInfo=hostContainerInfo._ancestorInfo),parentInfo&&validateDOMNesting(null,this._stringText,this,parentInfo)}var domID=hostContainerInfo._idCounter++,openingValue=" react-text: "+domID+" ";if(this._domID=domID,this._hostParent=hostParent,transaction.useCreateElement){var ownerDocument=hostContainerInfo._ownerDocument,openingComment=ownerDocument.createComment(openingValue),closingComment=ownerDocument.createComment(" /react-text "),lazyTree=DOMLazyTree(ownerDocument.createDocumentFragment());return DOMLazyTree.queueChild(lazyTree,DOMLazyTree(openingComment)),this._stringText&&DOMLazyTree.queueChild(lazyTree,DOMLazyTree(ownerDocument.createTextNode(this._stringText))),DOMLazyTree.queueChild(lazyTree,DOMLazyTree(closingComment)),ReactDOMComponentTree.precacheNode(this,openingComment),this._closingComment=closingComment,lazyTree}var escapedText=escapeTextContentForBrowser(this._stringText);return transaction.renderToStaticMarkup?escapedText:"\x3c!--"+openingValue+"--\x3e"+escapedText+"\x3c!-- /react-text --\x3e"},receiveComponent:function(nextText,transaction){if(nextText!==this._currentElement){this._currentElement=nextText;var nextStringText=""+nextText;if(nextStringText!==this._stringText){this._stringText=nextStringText;var commentNodes=this.getHostNode();DOMChildrenOperations.replaceDelimitedText(commentNodes[0],commentNodes[1],nextStringText)}}},getHostNode:function(){var hostNode=this._commentNodes;if(hostNode)return hostNode;if(!this._closingComment)for(var openingComment=ReactDOMComponentTree.getNodeFromInstance(this),node=openingComment.nextSibling;;){if(null==node&&("production"!==process.env.NODE_ENV?invariant(!1,"Missing closing comment for text component %s",this._domID):_prodInvariant("67",this._domID)),8===node.nodeType&&" /react-text "===node.nodeValue){this._closingComment=node;break}node=node.nextSibling}return hostNode=[this._hostNode,this._closingComment],this._commentNodes=hostNode,hostNode},unmountComponent:function(){this._closingComment=null,this._commentNodes=null,ReactDOMComponentTree.uncacheNode(this)}}),module.exports=ReactDOMTextComponent}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function forceUpdateIfMounted(){this._rootNodeID&&ReactDOMTextarea.updateWrapper(this)}function _handleChange(event){var props=this._currentElement.props,returnValue=LinkedValueUtils.executeOnChange(props,event);return ReactUpdates.asap(forceUpdateIfMounted,this),returnValue}var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),LinkedValueUtils=__webpack_require__(58),ReactDOMComponentTree=__webpack_require__(8),ReactUpdates=__webpack_require__(17),invariant=__webpack_require__(1),warning=__webpack_require__(2),didWarnValueLink=!1,didWarnValDefaultVal=!1,ReactDOMTextarea={getHostProps:function(inst,props){return null!=props.dangerouslySetInnerHTML&&("production"!==process.env.NODE_ENV?invariant(!1,"`dangerouslySetInnerHTML` does not make sense on <textarea>."):_prodInvariant("91")),_assign({},props,{value:void 0,defaultValue:void 0,children:""+inst._wrapperState.initialValue,onChange:inst._wrapperState.onChange})},mountWrapper:function(inst,props){"production"!==process.env.NODE_ENV&&(LinkedValueUtils.checkPropTypes("textarea",props,inst._currentElement._owner),void 0===props.valueLink||didWarnValueLink||("production"!==process.env.NODE_ENV&&warning(!1,"`valueLink` prop on `textarea` is deprecated; set `value` and `onChange` instead."),didWarnValueLink=!0),void 0===props.value||void 0===props.defaultValue||didWarnValDefaultVal||("production"!==process.env.NODE_ENV&&warning(!1,"Textarea elements must be either controlled or uncontrolled (specify either the value prop, or the defaultValue prop, but not both). Decide between using a controlled or uncontrolled textarea and remove one of these props. More info: https://fb.me/react-controlled-components"),didWarnValDefaultVal=!0));var value=LinkedValueUtils.getValue(props),initialValue=value;if(null==value){var defaultValue=props.defaultValue,children=props.children;null!=children&&("production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(!1,"Use the `defaultValue` or `value` props instead of setting children on <textarea>."),null!=defaultValue&&("production"!==process.env.NODE_ENV?invariant(!1,"If you supply `defaultValue` on a <textarea>, do not pass children."):_prodInvariant("92")),Array.isArray(children)&&(children.length<=1||("production"!==process.env.NODE_ENV?invariant(!1,"<textarea> can only have at most one child."):_prodInvariant("93")),children=children[0]),defaultValue=""+children),null==defaultValue&&(defaultValue=""),initialValue=defaultValue}inst._wrapperState={initialValue:""+initialValue,listeners:null,onChange:_handleChange.bind(inst)}},updateWrapper:function(inst){var props=inst._currentElement.props,node=ReactDOMComponentTree.getNodeFromInstance(inst),value=LinkedValueUtils.getValue(props);if(null!=value){var newValue=""+value;newValue!==node.value&&(node.value=newValue),null==props.defaultValue&&(node.defaultValue=newValue)}null!=props.defaultValue&&(node.defaultValue=props.defaultValue)},postMountWrapper:function(inst){var node=ReactDOMComponentTree.getNodeFromInstance(inst),textContent=node.textContent;textContent===inst._wrapperState.initialValue&&(node.value=textContent)}};module.exports=ReactDOMTextarea}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function getLowestCommonAncestor(instA,instB){"_hostNode"in instA||("production"!==process.env.NODE_ENV?invariant(!1,"getNodeFromInstance: Invalid argument."):_prodInvariant("33")),"_hostNode"in instB||("production"!==process.env.NODE_ENV?invariant(!1,"getNodeFromInstance: Invalid argument."):_prodInvariant("33"));for(var depthA=0,tempA=instA;tempA;tempA=tempA._hostParent)depthA++;for(var depthB=0,tempB=instB;tempB;tempB=tempB._hostParent)depthB++;for(;depthA-depthB>0;)instA=instA._hostParent,depthA--;for(;depthB-depthA>0;)instB=instB._hostParent,depthB--;for(var depth=depthA;depth--;){if(instA===instB)return instA;instA=instA._hostParent,instB=instB._hostParent}return null}function isAncestor(instA,instB){"_hostNode"in instA||("production"!==process.env.NODE_ENV?invariant(!1,"isAncestor: Invalid argument."):_prodInvariant("35")),"_hostNode"in instB||("production"!==process.env.NODE_ENV?invariant(!1,"isAncestor: Invalid argument."):_prodInvariant("35"));for(;instB;){if(instB===instA)return!0;instB=instB._hostParent}return!1}function getParentInstance(inst){return"_hostNode"in inst||("production"!==process.env.NODE_ENV?invariant(!1,"getParentInstance: Invalid argument."):_prodInvariant("36")),inst._hostParent}function traverseTwoPhase(inst,fn,arg){for(var path=[];inst;)path.push(inst),inst=inst._hostParent;var i;for(i=path.length;i-- >0;)fn(path[i],"captured",arg);for(i=0;i<path.length;i++)fn(path[i],"bubbled",arg)}function traverseEnterLeave(from,to,fn,argFrom,argTo){for(var common=from&&to?getLowestCommonAncestor(from,to):null,pathFrom=[];from&&from!==common;)pathFrom.push(from),from=from._hostParent;for(var pathTo=[];to&&to!==common;)pathTo.push(to),to=to._hostParent;var i;for(i=0;i<pathFrom.length;i++)fn(pathFrom[i],"bubbled",argFrom);for(i=pathTo.length;i-- >0;)fn(pathTo[i],"captured",argTo)}var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1);module.exports={isAncestor:isAncestor,getLowestCommonAncestor:getLowestCommonAncestor,getParentInstance:getParentInstance,traverseTwoPhase:traverseTwoPhase,traverseEnterLeave:traverseEnterLeave}}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function handleElement(debugID,element){null!=element&&"string"==typeof element.type&&(element.type.indexOf("-")>=0||element.props.is||warnUnknownProperties(debugID,element))}var DOMProperty=__webpack_require__(21),EventPluginRegistry=__webpack_require__(39),ReactComponentTreeHook=__webpack_require__(11),warning=__webpack_require__(2);if("production"!==process.env.NODE_ENV)var reactProps={children:!0,dangerouslySetInnerHTML:!0,key:!0,ref:!0,autoFocus:!0,defaultValue:!0,valueLink:!0,defaultChecked:!0,checkedLink:!0,innerHTML:!0,suppressContentEditableWarning:!0,onFocusIn:!0,onFocusOut:!0},warnedProperties={},validateProperty=function(tagName,name,debugID){if(DOMProperty.properties.hasOwnProperty(name)||DOMProperty.isCustomAttribute(name))return!0;if(reactProps.hasOwnProperty(name)&&reactProps[name]||warnedProperties.hasOwnProperty(name)&&warnedProperties[name])return!0;if(EventPluginRegistry.registrationNameModules.hasOwnProperty(name))return!0;warnedProperties[name]=!0;var lowerCasedName=name.toLowerCase(),standardName=DOMProperty.isCustomAttribute(lowerCasedName)?lowerCasedName:DOMProperty.getPossibleStandardName.hasOwnProperty(lowerCasedName)?DOMProperty.getPossibleStandardName[lowerCasedName]:null,registrationName=EventPluginRegistry.possibleRegistrationNames.hasOwnProperty(lowerCasedName)?EventPluginRegistry.possibleRegistrationNames[lowerCasedName]:null;return null!=standardName?("production"!==process.env.NODE_ENV&&warning(!1,"Unknown DOM property %s. Did you mean %s?%s",name,standardName,ReactComponentTreeHook.getStackAddendumByID(debugID)),!0):null!=registrationName&&("production"!==process.env.NODE_ENV&&warning(!1,"Unknown event handler property %s. Did you mean `%s`?%s",name,registrationName,ReactComponentTreeHook.getStackAddendumByID(debugID)),!0)};var warnUnknownProperties=function(debugID,element){var unknownProps=[];for(var key in element.props){validateProperty(element.type,key,debugID)||unknownProps.push(key)}var unknownPropString=unknownProps.map(function(prop){return"`"+prop+"`"}).join(", ");1===unknownProps.length?"production"!==process.env.NODE_ENV&&warning(!1,"Unknown prop %s on <%s> tag. Remove this prop from the element. For details, see https://fb.me/react-unknown-prop%s",unknownPropString,element.type,ReactComponentTreeHook.getStackAddendumByID(debugID)):unknownProps.length>1&&"production"!==process.env.NODE_ENV&&warning(!1,"Unknown props %s on <%s> tag. Remove these props from the element. For details, see https://fb.me/react-unknown-prop%s",unknownPropString,element.type,ReactComponentTreeHook.getStackAddendumByID(debugID))},ReactDOMUnknownPropertyHook={onBeforeMountComponent:function(debugID,element){handleElement(debugID,element)},onBeforeUpdateComponent:function(debugID,element){handleElement(debugID,element)}};module.exports=ReactDOMUnknownPropertyHook}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function callHook(event,fn,context,arg1,arg2,arg3,arg4,arg5){try{fn.call(context,arg1,arg2,arg3,arg4,arg5)}catch(e){"production"!==process.env.NODE_ENV&&warning(didHookThrowForEvent[event],"Exception thrown by hook while handling %s: %s",event,e+"\n"+e.stack),didHookThrowForEvent[event]=!0}}function emitEvent(event,arg1,arg2,arg3,arg4,arg5){for(var i=0;i<hooks.length;i++){var hook=hooks[i],fn=hook[event];fn&&callHook(event,fn,hook,arg1,arg2,arg3,arg4,arg5)}}function clearHistory(){ReactComponentTreeHook.purgeUnmountedComponents(),ReactHostOperationHistoryHook.clearHistory()}function getTreeSnapshot(registeredIDs){return registeredIDs.reduce(function(tree,id){var ownerID=ReactComponentTreeHook.getOwnerID(id),parentID=ReactComponentTreeHook.getParentID(id);return tree[id]={displayName:ReactComponentTreeHook.getDisplayName(id),text:ReactComponentTreeHook.getText(id),updateCount:ReactComponentTreeHook.getUpdateCount(id),childIDs:ReactComponentTreeHook.getChildIDs(id),ownerID:ownerID||parentID&&ReactComponentTreeHook.getOwnerID(parentID)||0,parentID:parentID},tree},{})}function resetMeasurements(){var previousStartTime=currentFlushStartTime,previousMeasurements=currentFlushMeasurements,previousOperations=ReactHostOperationHistoryHook.getHistory();if(0===currentFlushNesting)return currentFlushStartTime=0,currentFlushMeasurements=[],void clearHistory();if(previousMeasurements.length||previousOperations.length){var registeredIDs=ReactComponentTreeHook.getRegisteredIDs();flushHistory.push({duration:performanceNow()-previousStartTime,measurements:previousMeasurements||[],operations:previousOperations||[],treeSnapshot:getTreeSnapshot(registeredIDs)})}clearHistory(),currentFlushStartTime=performanceNow(),currentFlushMeasurements=[]}function checkDebugID(debugID){arguments.length>1&&void 0!==arguments[1]&&arguments[1]&&0===debugID||debugID||"production"!==process.env.NODE_ENV&&warning(!1,"ReactDebugTool: debugID may not be empty.")}function beginLifeCycleTimer(debugID,timerType){0!==currentFlushNesting&&(currentTimerType&&!lifeCycleTimerHasWarned&&("production"!==process.env.NODE_ENV&&warning(!1,"There is an internal error in the React performance measurement code. Did not expect %s timer to start while %s timer is still in progress for %s instance.",timerType,currentTimerType||"no",debugID===currentTimerDebugID?"the same":"another"),lifeCycleTimerHasWarned=!0),currentTimerStartTime=performanceNow(),currentTimerNestedFlushDuration=0,currentTimerDebugID=debugID,currentTimerType=timerType)}function endLifeCycleTimer(debugID,timerType){0!==currentFlushNesting&&(currentTimerType===timerType||lifeCycleTimerHasWarned||("production"!==process.env.NODE_ENV&&warning(!1,"There is an internal error in the React performance measurement code. We did not expect %s timer to stop while %s timer is still in progress for %s instance. Please report this as a bug in React.",timerType,currentTimerType||"no",debugID===currentTimerDebugID?"the same":"another"),lifeCycleTimerHasWarned=!0),isProfiling&&currentFlushMeasurements.push({timerType:timerType,instanceID:debugID,duration:performanceNow()-currentTimerStartTime-currentTimerNestedFlushDuration}),currentTimerStartTime=0,currentTimerNestedFlushDuration=0,currentTimerDebugID=null,currentTimerType=null)}function pauseCurrentLifeCycleTimer(){var currentTimer={startTime:currentTimerStartTime,nestedFlushStartTime:performanceNow(),debugID:currentTimerDebugID,timerType:currentTimerType};lifeCycleTimerStack.push(currentTimer),currentTimerStartTime=0,currentTimerNestedFlushDuration=0,currentTimerDebugID=null,currentTimerType=null}function resumeCurrentLifeCycleTimer(){var _lifeCycleTimerStack$=lifeCycleTimerStack.pop(),startTime=_lifeCycleTimerStack$.startTime,nestedFlushStartTime=_lifeCycleTimerStack$.nestedFlushStartTime,debugID=_lifeCycleTimerStack$.debugID,timerType=_lifeCycleTimerStack$.timerType,nestedFlushDuration=performanceNow()-nestedFlushStartTime;currentTimerStartTime=startTime,currentTimerNestedFlushDuration+=nestedFlushDuration,currentTimerDebugID=debugID,currentTimerType=timerType}function shouldMark(debugID){if(!isProfiling||!canUsePerformanceMeasure)return!1;var element=ReactComponentTreeHook.getElement(debugID);return null!=element&&"object"==typeof element&&!("string"==typeof element.type)}function markBegin(debugID,markType){if(shouldMark(debugID)){var markName=debugID+"::"+markType;lastMarkTimeStamp=performanceNow(),performance.mark(markName)}}function markEnd(debugID,markType){if(shouldMark(debugID)){var markName=debugID+"::"+markType,displayName=ReactComponentTreeHook.getDisplayName(debugID)||"Unknown";if(performanceNow()-lastMarkTimeStamp>.1){var measurementName=displayName+" ["+markType+"]";performance.measure(measurementName,markName)}performance.clearMarks(markName),measurementName&&performance.clearMeasures(measurementName)}}var ReactInvalidSetStateWarningHook=__webpack_require__(263),ReactHostOperationHistoryHook=__webpack_require__(261),ReactComponentTreeHook=__webpack_require__(11),ExecutionEnvironment=__webpack_require__(9),performanceNow=__webpack_require__(200),warning=__webpack_require__(2),hooks=[],didHookThrowForEvent={},isProfiling=!1,flushHistory=[],lifeCycleTimerStack=[],currentFlushNesting=0,currentFlushMeasurements=[],currentFlushStartTime=0,currentTimerDebugID=null,currentTimerStartTime=0,currentTimerNestedFlushDuration=0,currentTimerType=null,lifeCycleTimerHasWarned=!1,lastMarkTimeStamp=0,canUsePerformanceMeasure="undefined"!=typeof performance&&"function"==typeof performance.mark&&"function"==typeof performance.clearMarks&&"function"==typeof performance.measure&&"function"==typeof performance.clearMeasures,ReactDebugTool={addHook:function(hook){hooks.push(hook)},removeHook:function(hook){for(var i=0;i<hooks.length;i++)hooks[i]===hook&&(hooks.splice(i,1),i--)},isProfiling:function(){return isProfiling},beginProfiling:function(){isProfiling||(isProfiling=!0,flushHistory.length=0,resetMeasurements(),ReactDebugTool.addHook(ReactHostOperationHistoryHook))},endProfiling:function(){isProfiling&&(isProfiling=!1,resetMeasurements(),ReactDebugTool.removeHook(ReactHostOperationHistoryHook))},getFlushHistory:function(){return flushHistory},onBeginFlush:function(){currentFlushNesting++,resetMeasurements(),pauseCurrentLifeCycleTimer(),emitEvent("onBeginFlush")},onEndFlush:function(){resetMeasurements(),currentFlushNesting--,resumeCurrentLifeCycleTimer(),emitEvent("onEndFlush")},onBeginLifeCycleTimer:function(debugID,timerType){checkDebugID(debugID),emitEvent("onBeginLifeCycleTimer",debugID,timerType),markBegin(debugID,timerType),beginLifeCycleTimer(debugID,timerType)},onEndLifeCycleTimer:function(debugID,timerType){checkDebugID(debugID),endLifeCycleTimer(debugID,timerType),markEnd(debugID,timerType),emitEvent("onEndLifeCycleTimer",debugID,timerType)},onBeginProcessingChildContext:function(){emitEvent("onBeginProcessingChildContext")},onEndProcessingChildContext:function(){emitEvent("onEndProcessingChildContext")},onHostOperation:function(operation){checkDebugID(operation.instanceID),emitEvent("onHostOperation",operation)},onSetState:function(){emitEvent("onSetState")},onSetChildren:function(debugID,childDebugIDs){checkDebugID(debugID),childDebugIDs.forEach(checkDebugID),emitEvent("onSetChildren",debugID,childDebugIDs)},onBeforeMountComponent:function(debugID,element,parentDebugID){checkDebugID(debugID),checkDebugID(parentDebugID,!0),emitEvent("onBeforeMountComponent",debugID,element,parentDebugID),markBegin(debugID,"mount")},onMountComponent:function(debugID){checkDebugID(debugID),markEnd(debugID,"mount"),emitEvent("onMountComponent",debugID)},onBeforeUpdateComponent:function(debugID,element){checkDebugID(debugID),emitEvent("onBeforeUpdateComponent",debugID,element),markBegin(debugID,"update")},onUpdateComponent:function(debugID){checkDebugID(debugID),markEnd(debugID,"update"),emitEvent("onUpdateComponent",debugID)},onBeforeUnmountComponent:function(debugID){checkDebugID(debugID),emitEvent("onBeforeUnmountComponent",debugID),markBegin(debugID,"unmount")},onUnmountComponent:function(debugID){checkDebugID(debugID),markEnd(debugID,"unmount"),emitEvent("onUnmountComponent",debugID)},onTestEvent:function(){emitEvent("onTestEvent")}};ReactDebugTool.addDevtool=ReactDebugTool.addHook,ReactDebugTool.removeDevtool=ReactDebugTool.removeHook,ReactDebugTool.addHook(ReactInvalidSetStateWarningHook),ReactDebugTool.addHook(ReactComponentTreeHook),/[?&]react_perf\b/.test(ExecutionEnvironment.canUseDOM&&window.location.href||"")&&ReactDebugTool.beginProfiling(),module.exports=ReactDebugTool}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function ReactDefaultBatchingStrategyTransaction(){this.reinitializeTransaction()}var _assign=__webpack_require__(7),ReactUpdates=__webpack_require__(17),Transaction=__webpack_require__(42),emptyFunction=__webpack_require__(12),RESET_BATCHED_UPDATES={initialize:emptyFunction,close:function(){ReactDefaultBatchingStrategy.isBatchingUpdates=!1}},FLUSH_BATCHED_UPDATES={initialize:emptyFunction,close:ReactUpdates.flushBatchedUpdates.bind(ReactUpdates)},TRANSACTION_WRAPPERS=[FLUSH_BATCHED_UPDATES,RESET_BATCHED_UPDATES];_assign(ReactDefaultBatchingStrategyTransaction.prototype,Transaction,{getTransactionWrappers:function(){return TRANSACTION_WRAPPERS}});var transaction=new ReactDefaultBatchingStrategyTransaction,ReactDefaultBatchingStrategy={isBatchingUpdates:!1,batchedUpdates:function(callback,a,b,c,d,e){var alreadyBatchingUpdates=ReactDefaultBatchingStrategy.isBatchingUpdates;return ReactDefaultBatchingStrategy.isBatchingUpdates=!0,alreadyBatchingUpdates?callback(a,b,c,d,e):transaction.perform(callback,null,a,b,c,d,e)}};module.exports=ReactDefaultBatchingStrategy},function(module,exports,__webpack_require__){"use strict";function inject(){alreadyInjected||(alreadyInjected=!0,ReactInjection.EventEmitter.injectReactEventListener(ReactEventListener),ReactInjection.EventPluginHub.injectEventPluginOrder(DefaultEventPluginOrder),ReactInjection.EventPluginUtils.injectComponentTree(ReactDOMComponentTree),ReactInjection.EventPluginUtils.injectTreeTraversal(ReactDOMTreeTraversal),ReactInjection.EventPluginHub.injectEventPluginsByName({SimpleEventPlugin:SimpleEventPlugin,EnterLeaveEventPlugin:EnterLeaveEventPlugin,ChangeEventPlugin:ChangeEventPlugin,SelectEventPlugin:SelectEventPlugin,BeforeInputEventPlugin:BeforeInputEventPlugin}),ReactInjection.HostComponent.injectGenericComponentClass(ReactDOMComponent),ReactInjection.HostComponent.injectTextComponentClass(ReactDOMTextComponent),ReactInjection.DOMProperty.injectDOMPropertyConfig(ARIADOMPropertyConfig),ReactInjection.DOMProperty.injectDOMPropertyConfig(HTMLDOMPropertyConfig),ReactInjection.DOMProperty.injectDOMPropertyConfig(SVGDOMPropertyConfig),ReactInjection.EmptyComponent.injectEmptyComponentFactory(function(instantiate){return new ReactDOMEmptyComponent(instantiate)}),ReactInjection.Updates.injectReconcileTransaction(ReactReconcileTransaction),ReactInjection.Updates.injectBatchingStrategy(ReactDefaultBatchingStrategy),ReactInjection.Component.injectEnvironment(ReactComponentBrowserEnvironment))}var ARIADOMPropertyConfig=__webpack_require__(227),BeforeInputEventPlugin=__webpack_require__(229),ChangeEventPlugin=__webpack_require__(231),DefaultEventPluginOrder=__webpack_require__(233),EnterLeaveEventPlugin=__webpack_require__(234),HTMLDOMPropertyConfig=__webpack_require__(236),ReactComponentBrowserEnvironment=__webpack_require__(238),ReactDOMComponent=__webpack_require__(241),ReactDOMComponentTree=__webpack_require__(8),ReactDOMEmptyComponent=__webpack_require__(243),ReactDOMTreeTraversal=__webpack_require__(253),ReactDOMTextComponent=__webpack_require__(251),ReactDefaultBatchingStrategy=__webpack_require__(256),ReactEventListener=__webpack_require__(260),ReactInjection=__webpack_require__(262),ReactReconcileTransaction=__webpack_require__(268),SVGDOMPropertyConfig=__webpack_require__(273),SelectEventPlugin=__webpack_require__(274),SimpleEventPlugin=__webpack_require__(275),alreadyInjected=!1;module.exports={inject:inject}},function(module,exports,__webpack_require__){"use strict";var REACT_ELEMENT_TYPE="function"==typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103;module.exports=REACT_ELEMENT_TYPE},function(module,exports,__webpack_require__){"use strict";function runEventQueueInBatch(events){EventPluginHub.enqueueEvents(events),EventPluginHub.processEventQueue(!1)}var EventPluginHub=__webpack_require__(30),ReactEventEmitterMixin={handleTopLevel:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){runEventQueueInBatch(EventPluginHub.extractEvents(topLevelType,targetInst,nativeEvent,nativeEventTarget))}};module.exports=ReactEventEmitterMixin},function(module,exports,__webpack_require__){"use strict";function findParent(inst){for(;inst._hostParent;)inst=inst._hostParent;var rootNode=ReactDOMComponentTree.getNodeFromInstance(inst),container=rootNode.parentNode;return ReactDOMComponentTree.getClosestInstanceFromNode(container)}function TopLevelCallbackBookKeeping(topLevelType,nativeEvent){this.topLevelType=topLevelType,this.nativeEvent=nativeEvent,this.ancestors=[]}function handleTopLevelImpl(bookKeeping){var nativeEventTarget=getEventTarget(bookKeeping.nativeEvent),targetInst=ReactDOMComponentTree.getClosestInstanceFromNode(nativeEventTarget),ancestor=targetInst;do{bookKeeping.ancestors.push(ancestor),ancestor=ancestor&&findParent(ancestor)}while(ancestor);for(var i=0;i<bookKeeping.ancestors.length;i++)targetInst=bookKeeping.ancestors[i],ReactEventListener._handleTopLevel(bookKeeping.topLevelType,targetInst,bookKeeping.nativeEvent,getEventTarget(bookKeeping.nativeEvent))}function scrollValueMonitor(cb){cb(getUnboundedScrollPosition(window))}var _assign=__webpack_require__(7),EventListener=__webpack_require__(93),ExecutionEnvironment=__webpack_require__(9),PooledClass=__webpack_require__(23),ReactDOMComponentTree=__webpack_require__(8),ReactUpdates=__webpack_require__(17),getEventTarget=__webpack_require__(65),getUnboundedScrollPosition=__webpack_require__(193);_assign(TopLevelCallbackBookKeeping.prototype,{destructor:function(){this.topLevelType=null,this.nativeEvent=null,this.ancestors.length=0}}),PooledClass.addPoolingTo(TopLevelCallbackBookKeeping,PooledClass.twoArgumentPooler);var ReactEventListener={_enabled:!0,_handleTopLevel:null,WINDOW_HANDLE:ExecutionEnvironment.canUseDOM?window:null,setHandleTopLevel:function(handleTopLevel){ReactEventListener._handleTopLevel=handleTopLevel},setEnabled:function(enabled){ReactEventListener._enabled=!!enabled},isEnabled:function(){return ReactEventListener._enabled},trapBubbledEvent:function(topLevelType,handlerBaseName,element){return element?EventListener.listen(element,handlerBaseName,ReactEventListener.dispatchEvent.bind(null,topLevelType)):null},trapCapturedEvent:function(topLevelType,handlerBaseName,element){return element?EventListener.capture(element,handlerBaseName,ReactEventListener.dispatchEvent.bind(null,topLevelType)):null},monitorScrollValue:function(refresh){var callback=scrollValueMonitor.bind(null,refresh);EventListener.listen(window,"scroll",callback)},dispatchEvent:function(topLevelType,nativeEvent){if(ReactEventListener._enabled){var bookKeeping=TopLevelCallbackBookKeeping.getPooled(topLevelType,nativeEvent);try{ReactUpdates.batchedUpdates(handleTopLevelImpl,bookKeeping)}finally{TopLevelCallbackBookKeeping.release(bookKeeping)}}}};module.exports=ReactEventListener},function(module,exports,__webpack_require__){"use strict";var history=[],ReactHostOperationHistoryHook={onHostOperation:function(operation){history.push(operation)},clearHistory:function(){ReactHostOperationHistoryHook._preventClearing||(history=[])},getHistory:function(){return history}};module.exports=ReactHostOperationHistoryHook},function(module,exports,__webpack_require__){"use strict";var DOMProperty=__webpack_require__(21),EventPluginHub=__webpack_require__(30),EventPluginUtils=__webpack_require__(56),ReactComponentEnvironment=__webpack_require__(59),ReactEmptyComponent=__webpack_require__(107),ReactBrowserEventEmitter=__webpack_require__(40),ReactHostComponent=__webpack_require__(109),ReactUpdates=__webpack_require__(17),ReactInjection={Component:ReactComponentEnvironment.injection,DOMProperty:DOMProperty.injection,EmptyComponent:ReactEmptyComponent.injection,EventPluginHub:EventPluginHub.injection,EventPluginUtils:EventPluginUtils.injection,EventEmitter:ReactBrowserEventEmitter.injection,HostComponent:ReactHostComponent.injection,Updates:ReactUpdates.injection};module.exports=ReactInjection},function(module,exports,__webpack_require__){"use strict";(function(process){var warning=__webpack_require__(2);if("production"!==process.env.NODE_ENV)var processingChildContext=!1,warnInvalidSetState=function(){"production"!==process.env.NODE_ENV&&warning(!processingChildContext,"setState(...): Cannot call setState() inside getChildContext()")};var ReactInvalidSetStateWarningHook={onBeginProcessingChildContext:function(){processingChildContext=!0},onEndProcessingChildContext:function(){processingChildContext=!1},onSetState:function(){warnInvalidSetState()}};module.exports=ReactInvalidSetStateWarningHook}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var adler32=__webpack_require__(286),TAG_END=/\/?>/,COMMENT_START=/^<\!\-\-/,ReactMarkupChecksum={CHECKSUM_ATTR_NAME:"data-react-checksum",addChecksumToMarkup:function(markup){var checksum=adler32(markup);return COMMENT_START.test(markup)?markup:markup.replace(TAG_END," "+ReactMarkupChecksum.CHECKSUM_ATTR_NAME+'="'+checksum+'"$&')},canReuseMarkup:function(markup,element){var existingChecksum=element.getAttribute(ReactMarkupChecksum.CHECKSUM_ATTR_NAME);return existingChecksum=existingChecksum&&parseInt(existingChecksum,10),adler32(markup)===existingChecksum}};module.exports=ReactMarkupChecksum},function(module,exports,__webpack_require__){"use strict";(function(process){function makeInsertMarkup(markup,afterNode,toIndex){return{type:"INSERT_MARKUP",content:markup,fromIndex:null,fromNode:null,toIndex:toIndex,afterNode:afterNode}}function makeMove(child,afterNode,toIndex){return{type:"MOVE_EXISTING",content:null,fromIndex:child._mountIndex,fromNode:ReactReconciler.getHostNode(child),toIndex:toIndex,afterNode:afterNode}}function makeRemove(child,node){return{type:"REMOVE_NODE",content:null,fromIndex:child._mountIndex,fromNode:node,toIndex:null,afterNode:null}}function makeSetMarkup(markup){return{type:"SET_MARKUP",content:markup,fromIndex:null,fromNode:null,toIndex:null,afterNode:null}}function makeTextContent(textContent){return{type:"TEXT_CONTENT",content:textContent,fromIndex:null,fromNode:null,toIndex:null,afterNode:null}}function enqueue(queue,update){return update&&(queue=queue||[],queue.push(update)),queue}function processQueue(inst,updateQueue){ReactComponentEnvironment.processChildrenUpdates(inst,updateQueue)}var _prodInvariant=__webpack_require__(4),ReactComponentEnvironment=__webpack_require__(59),ReactInstanceMap=__webpack_require__(32),ReactInstrumentation=__webpack_require__(14),ReactCurrentOwner=__webpack_require__(18),ReactReconciler=__webpack_require__(27),ReactChildReconciler=__webpack_require__(237),emptyFunction=__webpack_require__(12),flattenChildren=__webpack_require__(290),invariant=__webpack_require__(1),setChildrenForInstrumentation=emptyFunction;if("production"!==process.env.NODE_ENV){var getDebugID=function(inst){if(!inst._debugID){var internal;(internal=ReactInstanceMap.get(inst))&&(inst=internal)}return inst._debugID};setChildrenForInstrumentation=function(children){var debugID=getDebugID(this);0!==debugID&&ReactInstrumentation.debugTool.onSetChildren(debugID,children?Object.keys(children).map(function(key){return children[key]._debugID}):[])}}var ReactMultiChild={Mixin:{_reconcilerInstantiateChildren:function(nestedChildren,transaction,context){if("production"!==process.env.NODE_ENV){var selfDebugID=getDebugID(this);if(this._currentElement)try{return ReactCurrentOwner.current=this._currentElement._owner,ReactChildReconciler.instantiateChildren(nestedChildren,transaction,context,selfDebugID)}finally{ReactCurrentOwner.current=null}}return ReactChildReconciler.instantiateChildren(nestedChildren,transaction,context)},_reconcilerUpdateChildren:function(prevChildren,nextNestedChildrenElements,mountImages,removedNodes,transaction,context){var nextChildren,selfDebugID=0;if("production"!==process.env.NODE_ENV&&(selfDebugID=getDebugID(this),this._currentElement)){try{ReactCurrentOwner.current=this._currentElement._owner,nextChildren=flattenChildren(nextNestedChildrenElements,selfDebugID)}finally{ReactCurrentOwner.current=null}return ReactChildReconciler.updateChildren(prevChildren,nextChildren,mountImages,removedNodes,transaction,this,this._hostContainerInfo,context,selfDebugID),nextChildren}return nextChildren=flattenChildren(nextNestedChildrenElements,selfDebugID),ReactChildReconciler.updateChildren(prevChildren,nextChildren,mountImages,removedNodes,transaction,this,this._hostContainerInfo,context,selfDebugID),nextChildren},mountChildren:function(nestedChildren,transaction,context){var children=this._reconcilerInstantiateChildren(nestedChildren,transaction,context);this._renderedChildren=children;var mountImages=[],index=0;for(var name in children)if(children.hasOwnProperty(name)){var child=children[name],selfDebugID=0;"production"!==process.env.NODE_ENV&&(selfDebugID=getDebugID(this));var mountImage=ReactReconciler.mountComponent(child,transaction,this,this._hostContainerInfo,context,selfDebugID);child._mountIndex=index++,mountImages.push(mountImage)}return"production"!==process.env.NODE_ENV&&setChildrenForInstrumentation.call(this,children),mountImages},updateTextContent:function(nextContent){var prevChildren=this._renderedChildren;ReactChildReconciler.unmountChildren(prevChildren,!1);for(var name in prevChildren)prevChildren.hasOwnProperty(name)&&("production"!==process.env.NODE_ENV?invariant(!1,"updateTextContent called on non-empty component."):_prodInvariant("118"));processQueue(this,[makeTextContent(nextContent)])},updateMarkup:function(nextMarkup){var prevChildren=this._renderedChildren;ReactChildReconciler.unmountChildren(prevChildren,!1);for(var name in prevChildren)prevChildren.hasOwnProperty(name)&&("production"!==process.env.NODE_ENV?invariant(!1,"updateTextContent called on non-empty component."):_prodInvariant("118"));processQueue(this,[makeSetMarkup(nextMarkup)])},updateChildren:function(nextNestedChildrenElements,transaction,context){this._updateChildren(nextNestedChildrenElements,transaction,context)},_updateChildren:function(nextNestedChildrenElements,transaction,context){var prevChildren=this._renderedChildren,removedNodes={},mountImages=[],nextChildren=this._reconcilerUpdateChildren(prevChildren,nextNestedChildrenElements,mountImages,removedNodes,transaction,context);if(nextChildren||prevChildren){var name,updates=null,nextIndex=0,lastIndex=0,nextMountIndex=0,lastPlacedNode=null;for(name in nextChildren)if(nextChildren.hasOwnProperty(name)){var prevChild=prevChildren&&prevChildren[name],nextChild=nextChildren[name];prevChild===nextChild?(updates=enqueue(updates,this.moveChild(prevChild,lastPlacedNode,nextIndex,lastIndex)),lastIndex=Math.max(prevChild._mountIndex,lastIndex),prevChild._mountIndex=nextIndex):(prevChild&&(lastIndex=Math.max(prevChild._mountIndex,lastIndex)),updates=enqueue(updates,this._mountChildAtIndex(nextChild,mountImages[nextMountIndex],lastPlacedNode,nextIndex,transaction,context)),nextMountIndex++),nextIndex++,lastPlacedNode=ReactReconciler.getHostNode(nextChild)}for(name in removedNodes)removedNodes.hasOwnProperty(name)&&(updates=enqueue(updates,this._unmountChild(prevChildren[name],removedNodes[name])));updates&&processQueue(this,updates),this._renderedChildren=nextChildren,"production"!==process.env.NODE_ENV&&setChildrenForInstrumentation.call(this,nextChildren)}},unmountChildren:function(safely){var renderedChildren=this._renderedChildren;ReactChildReconciler.unmountChildren(renderedChildren,safely),this._renderedChildren=null},moveChild:function(child,afterNode,toIndex,lastIndex){if(child._mountIndex<lastIndex)return makeMove(child,afterNode,toIndex)},createChild:function(child,afterNode,mountImage){return makeInsertMarkup(mountImage,afterNode,child._mountIndex)},removeChild:function(child,node){return makeRemove(child,node)},_mountChildAtIndex:function(child,mountImage,afterNode,index,transaction,context){return child._mountIndex=index,this.createChild(child,afterNode,mountImage)},_unmountChild:function(child,node){var update=this.removeChild(child,node);return child._mountIndex=null,update}}};module.exports=ReactMultiChild}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function isValidOwner(object){return!(!object||"function"!=typeof object.attachRef||"function"!=typeof object.detachRef)}var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),ReactOwner={addComponentAsRefTo:function(component,ref,owner){isValidOwner(owner)||("production"!==process.env.NODE_ENV?invariant(!1,"addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's `render` method, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner)."):_prodInvariant("119")),owner.attachRef(ref,component)},removeComponentAsRefFrom:function(component,ref,owner){isValidOwner(owner)||("production"!==process.env.NODE_ENV?invariant(!1,"removeComponentAsRefFrom(...): Only a ReactOwner can have refs. You might be removing a ref to a component that was not created inside a component's `render` method, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner)."):_prodInvariant("120"));var ownerPublicInstance=owner.getPublicInstance();ownerPublicInstance&&ownerPublicInstance.refs[ref]===component.getPublicInstance()&&owner.detachRef(ref)}};module.exports=ReactOwner}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var ReactPropTypeLocationNames={};"production"!==process.env.NODE_ENV&&(ReactPropTypeLocationNames={prop:"prop",context:"context",childContext:"child context"}),module.exports=ReactPropTypeLocationNames}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function ReactReconcileTransaction(useCreateElement){this.reinitializeTransaction(),this.renderToStaticMarkup=!1,this.reactMountReady=CallbackQueue.getPooled(null),this.useCreateElement=useCreateElement}var _assign=__webpack_require__(7),CallbackQueue=__webpack_require__(103),PooledClass=__webpack_require__(23),ReactBrowserEventEmitter=__webpack_require__(40),ReactInputSelection=__webpack_require__(110),ReactInstrumentation=__webpack_require__(14),Transaction=__webpack_require__(42),ReactUpdateQueue=__webpack_require__(61),SELECTION_RESTORATION={initialize:ReactInputSelection.getSelectionInformation,close:ReactInputSelection.restoreSelection},EVENT_SUPPRESSION={initialize:function(){var currentlyEnabled=ReactBrowserEventEmitter.isEnabled();return ReactBrowserEventEmitter.setEnabled(!1),currentlyEnabled},close:function(previouslyEnabled){ReactBrowserEventEmitter.setEnabled(previouslyEnabled)}},ON_DOM_READY_QUEUEING={initialize:function(){this.reactMountReady.reset()},close:function(){this.reactMountReady.notifyAll()}},TRANSACTION_WRAPPERS=[SELECTION_RESTORATION,EVENT_SUPPRESSION,ON_DOM_READY_QUEUEING];"production"!==process.env.NODE_ENV&&TRANSACTION_WRAPPERS.push({initialize:ReactInstrumentation.debugTool.onBeginFlush,close:ReactInstrumentation.debugTool.onEndFlush});var Mixin={getTransactionWrappers:function(){return TRANSACTION_WRAPPERS},getReactMountReady:function(){return this.reactMountReady},getUpdateQueue:function(){return ReactUpdateQueue},checkpoint:function(){return this.reactMountReady.checkpoint()},rollback:function(checkpoint){this.reactMountReady.rollback(checkpoint)},destructor:function(){CallbackQueue.release(this.reactMountReady),this.reactMountReady=null}};_assign(ReactReconcileTransaction.prototype,Transaction,Mixin),PooledClass.addPoolingTo(ReactReconcileTransaction),module.exports=ReactReconcileTransaction}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function attachRef(ref,component,owner){"function"==typeof ref?ref(component.getPublicInstance()):ReactOwner.addComponentAsRefTo(component,ref,owner)}function detachRef(ref,component,owner){"function"==typeof ref?ref(null):ReactOwner.removeComponentAsRefFrom(component,ref,owner)}var ReactOwner=__webpack_require__(266),ReactRef={};ReactRef.attachRefs=function(instance,element){if(null!==element&&"object"==typeof element){var ref=element.ref;null!=ref&&attachRef(ref,instance,element._owner)}},ReactRef.shouldUpdateRefs=function(prevElement,nextElement){var prevRef=null,prevOwner=null;null!==prevElement&&"object"==typeof prevElement&&(prevRef=prevElement.ref,prevOwner=prevElement._owner);var nextRef=null,nextOwner=null;return null!==nextElement&&"object"==typeof nextElement&&(nextRef=nextElement.ref,nextOwner=nextElement._owner),prevRef!==nextRef||"string"==typeof nextRef&&nextOwner!==prevOwner},ReactRef.detachRefs=function(instance,element){if(null!==element&&"object"==typeof element){var ref=element.ref;null!=ref&&detachRef(ref,instance,element._owner)}},module.exports=ReactRef},function(module,exports,__webpack_require__){"use strict";(function(process){function ReactServerRenderingTransaction(renderToStaticMarkup){this.reinitializeTransaction(),this.renderToStaticMarkup=renderToStaticMarkup,this.useCreateElement=!1,this.updateQueue=new ReactServerUpdateQueue(this)}var _assign=__webpack_require__(7),PooledClass=__webpack_require__(23),Transaction=__webpack_require__(42),ReactInstrumentation=__webpack_require__(14),ReactServerUpdateQueue=__webpack_require__(271),TRANSACTION_WRAPPERS=[];"production"!==process.env.NODE_ENV&&TRANSACTION_WRAPPERS.push({initialize:ReactInstrumentation.debugTool.onBeginFlush,close:ReactInstrumentation.debugTool.onEndFlush});var noopCallbackQueue={enqueue:function(){}},Mixin={getTransactionWrappers:function(){return TRANSACTION_WRAPPERS},getReactMountReady:function(){return noopCallbackQueue},getUpdateQueue:function(){return this.updateQueue},destructor:function(){},checkpoint:function(){},rollback:function(){}};_assign(ReactServerRenderingTransaction.prototype,Transaction,Mixin),PooledClass.addPoolingTo(ReactServerRenderingTransaction),module.exports=ReactServerRenderingTransaction}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function warnNoop(publicInstance,callerName){if("production"!==process.env.NODE_ENV){var constructor=publicInstance.constructor;"production"!==process.env.NODE_ENV&&warning(!1,"%s(...): Can only update a mounting component. This usually means you called %s() outside componentWillMount() on the server. This is a no-op. Please check the code for the %s component.",callerName,callerName,constructor&&(constructor.displayName||constructor.name)||"ReactClass")}}var ReactUpdateQueue=__webpack_require__(61),warning=__webpack_require__(2),ReactServerUpdateQueue=function(){function ReactServerUpdateQueue(transaction){_classCallCheck(this,ReactServerUpdateQueue),this.transaction=transaction}return ReactServerUpdateQueue.prototype.isMounted=function(publicInstance){return!1},ReactServerUpdateQueue.prototype.enqueueCallback=function(publicInstance,callback,callerName){this.transaction.isInTransaction()&&ReactUpdateQueue.enqueueCallback(publicInstance,callback,callerName)},ReactServerUpdateQueue.prototype.enqueueForceUpdate=function(publicInstance){this.transaction.isInTransaction()?ReactUpdateQueue.enqueueForceUpdate(publicInstance):warnNoop(publicInstance,"forceUpdate")},ReactServerUpdateQueue.prototype.enqueueReplaceState=function(publicInstance,completeState){this.transaction.isInTransaction()?ReactUpdateQueue.enqueueReplaceState(publicInstance,completeState):warnNoop(publicInstance,"replaceState")},ReactServerUpdateQueue.prototype.enqueueSetState=function(publicInstance,partialState){this.transaction.isInTransaction()?ReactUpdateQueue.enqueueSetState(publicInstance,partialState):warnNoop(publicInstance,"setState")},ReactServerUpdateQueue}();module.exports=ReactServerUpdateQueue}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";module.exports="15.6.1"},function(module,exports,__webpack_require__){"use strict";var NS={xlink:"http://www.w3.org/1999/xlink",xml:"http://www.w3.org/XML/1998/namespace"},ATTRS={accentHeight:"accent-height",accumulate:0,additive:0,alignmentBaseline:"alignment-baseline",allowReorder:"allowReorder",alphabetic:0,amplitude:0,arabicForm:"arabic-form",ascent:0,attributeName:"attributeName",attributeType:"attributeType",autoReverse:"autoReverse",azimuth:0,baseFrequency:"baseFrequency",baseProfile:"baseProfile",baselineShift:"baseline-shift",bbox:0,begin:0,bias:0,by:0,calcMode:"calcMode",capHeight:"cap-height",clip:0,clipPath:"clip-path",clipRule:"clip-rule",clipPathUnits:"clipPathUnits",colorInterpolation:"color-interpolation",colorInterpolationFilters:"color-interpolation-filters",colorProfile:"color-profile",colorRendering:"color-rendering",contentScriptType:"contentScriptType",contentStyleType:"contentStyleType",cursor:0,cx:0,cy:0,d:0,decelerate:0,descent:0,diffuseConstant:"diffuseConstant",direction:0,display:0,divisor:0,dominantBaseline:"dominant-baseline",dur:0,dx:0,dy:0,edgeMode:"edgeMode",elevation:0,enableBackground:"enable-background",end:0,exponent:0,externalResourcesRequired:"externalResourcesRequired",fill:0,fillOpacity:"fill-opacity",fillRule:"fill-rule",filter:0,filterRes:"filterRes",filterUnits:"filterUnits",floodColor:"flood-color",floodOpacity:"flood-opacity",focusable:0,fontFamily:"font-family",fontSize:"font-size",fontSizeAdjust:"font-size-adjust",fontStretch:"font-stretch",fontStyle:"font-style",fontVariant:"font-variant",fontWeight:"font-weight",format:0,from:0,fx:0,fy:0,g1:0,g2:0,glyphName:"glyph-name",glyphOrientationHorizontal:"glyph-orientation-horizontal",glyphOrientationVertical:"glyph-orientation-vertical",glyphRef:"glyphRef",gradientTransform:"gradientTransform",gradientUnits:"gradientUnits",hanging:0,horizAdvX:"horiz-adv-x",horizOriginX:"horiz-origin-x",ideographic:0,imageRendering:"image-rendering",in:0,in2:0,intercept:0,k:0,k1:0,k2:0,k3:0,k4:0,kernelMatrix:"kernelMatrix",kernelUnitLength:"kernelUnitLength",kerning:0,keyPoints:"keyPoints",keySplines:"keySplines",keyTimes:"keyTimes",lengthAdjust:"lengthAdjust",letterSpacing:"letter-spacing",lightingColor:"lighting-color",limitingConeAngle:"limitingConeAngle",local:0,markerEnd:"marker-end",markerMid:"marker-mid",markerStart:"marker-start",markerHeight:"markerHeight",markerUnits:"markerUnits",markerWidth:"markerWidth",mask:0,maskContentUnits:"maskContentUnits",maskUnits:"maskUnits",mathematical:0,mode:0,numOctaves:"numOctaves",offset:0,opacity:0,operator:0,order:0,orient:0,orientation:0,origin:0,overflow:0,overlinePosition:"overline-position",overlineThickness:"overline-thickness",paintOrder:"paint-order",panose1:"panose-1",pathLength:"pathLength",patternContentUnits:"patternContentUnits",patternTransform:"patternTransform",patternUnits:"patternUnits",pointerEvents:"pointer-events",points:0,pointsAtX:"pointsAtX",pointsAtY:"pointsAtY",pointsAtZ:"pointsAtZ",preserveAlpha:"preserveAlpha",preserveAspectRatio:"preserveAspectRatio",primitiveUnits:"primitiveUnits",r:0,radius:0,refX:"refX",refY:"refY",renderingIntent:"rendering-intent",repeatCount:"repeatCount",repeatDur:"repeatDur",requiredExtensions:"requiredExtensions",requiredFeatures:"requiredFeatures",restart:0,result:0,rotate:0,rx:0,ry:0,scale:0,seed:0,shapeRendering:"shape-rendering",slope:0,spacing:0,specularConstant:"specularConstant",specularExponent:"specularExponent",speed:0,spreadMethod:"spreadMethod",startOffset:"startOffset",stdDeviation:"stdDeviation",stemh:0,stemv:0,stitchTiles:"stitchTiles",stopColor:"stop-color",stopOpacity:"stop-opacity",strikethroughPosition:"strikethrough-position",strikethroughThickness:"strikethrough-thickness",string:0,stroke:0,strokeDasharray:"stroke-dasharray",strokeDashoffset:"stroke-dashoffset",strokeLinecap:"stroke-linecap",strokeLinejoin:"stroke-linejoin",strokeMiterlimit:"stroke-miterlimit",strokeOpacity:"stroke-opacity",strokeWidth:"stroke-width",surfaceScale:"surfaceScale",systemLanguage:"systemLanguage",tableValues:"tableValues",targetX:"targetX",targetY:"targetY",textAnchor:"text-anchor",textDecoration:"text-decoration",textRendering:"text-rendering",textLength:"textLength",to:0,transform:0,u1:0,u2:0,underlinePosition:"underline-position",underlineThickness:"underline-thickness",unicode:0,unicodeBidi:"unicode-bidi",unicodeRange:"unicode-range",unitsPerEm:"units-per-em",vAlphabetic:"v-alphabetic",vHanging:"v-hanging",vIdeographic:"v-ideographic",vMathematical:"v-mathematical",values:0,vectorEffect:"vector-effect",version:0,vertAdvY:"vert-adv-y",vertOriginX:"vert-origin-x",vertOriginY:"vert-origin-y",viewBox:"viewBox",viewTarget:"viewTarget",visibility:0,widths:0,wordSpacing:"word-spacing",writingMode:"writing-mode",x:0,xHeight:"x-height",x1:0,x2:0,xChannelSelector:"xChannelSelector",xlinkActuate:"xlink:actuate",xlinkArcrole:"xlink:arcrole",xlinkHref:"xlink:href",xlinkRole:"xlink:role",xlinkShow:"xlink:show",xlinkTitle:"xlink:title",xlinkType:"xlink:type",xmlBase:"xml:base",xmlns:0,xmlnsXlink:"xmlns:xlink",xmlLang:"xml:lang",xmlSpace:"xml:space",y:0,y1:0,y2:0,yChannelSelector:"yChannelSelector",z:0,zoomAndPan:"zoomAndPan"},SVGDOMPropertyConfig={Properties:{},DOMAttributeNamespaces:{xlinkActuate:NS.xlink,xlinkArcrole:NS.xlink,xlinkHref:NS.xlink,xlinkRole:NS.xlink,xlinkShow:NS.xlink,xlinkTitle:NS.xlink,xlinkType:NS.xlink,xmlBase:NS.xml,xmlLang:NS.xml,xmlSpace:NS.xml},DOMAttributeNames:{}};Object.keys(ATTRS).forEach(function(key){SVGDOMPropertyConfig.Properties[key]=0,ATTRS[key]&&(SVGDOMPropertyConfig.DOMAttributeNames[key]=ATTRS[key])}),module.exports=SVGDOMPropertyConfig},function(module,exports,__webpack_require__){"use strict";function getSelection(node){if("selectionStart"in node&&ReactInputSelection.hasSelectionCapabilities(node))return{start:node.selectionStart,end:node.selectionEnd};if(window.getSelection){var selection=window.getSelection();return{anchorNode:selection.anchorNode,anchorOffset:selection.anchorOffset,focusNode:selection.focusNode,focusOffset:selection.focusOffset}}if(document.selection){var range=document.selection.createRange();return{parentElement:range.parentElement(),text:range.text,top:range.boundingTop,left:range.boundingLeft}}}function constructSelectEvent(nativeEvent,nativeEventTarget){if(mouseDown||null==activeElement||activeElement!==getActiveElement())return null;var currentSelection=getSelection(activeElement);if(!lastSelection||!shallowEqual(lastSelection,currentSelection)){lastSelection=currentSelection;var syntheticEvent=SyntheticEvent.getPooled(eventTypes.select,activeElementInst,nativeEvent,nativeEventTarget);return syntheticEvent.type="select",syntheticEvent.target=activeElement,EventPropagators.accumulateTwoPhaseDispatches(syntheticEvent),syntheticEvent}return null}var EventPropagators=__webpack_require__(31),ExecutionEnvironment=__webpack_require__(9),ReactDOMComponentTree=__webpack_require__(8),ReactInputSelection=__webpack_require__(110),SyntheticEvent=__webpack_require__(20),getActiveElement=__webpack_require__(95),isTextInputElement=__webpack_require__(121),shallowEqual=__webpack_require__(51),skipSelectionChangeEvent=ExecutionEnvironment.canUseDOM&&"documentMode"in document&&document.documentMode<=11,eventTypes={select:{phasedRegistrationNames:{bubbled:"onSelect",captured:"onSelectCapture"},dependencies:["topBlur","topContextMenu","topFocus","topKeyDown","topKeyUp","topMouseDown","topMouseUp","topSelectionChange"]}},activeElement=null,activeElementInst=null,lastSelection=null,mouseDown=!1,hasListener=!1,SelectEventPlugin={eventTypes:eventTypes,extractEvents:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){if(!hasListener)return null;var targetNode=targetInst?ReactDOMComponentTree.getNodeFromInstance(targetInst):window;switch(topLevelType){case"topFocus":(isTextInputElement(targetNode)||"true"===targetNode.contentEditable)&&(activeElement=targetNode,activeElementInst=targetInst,lastSelection=null);break;case"topBlur":activeElement=null,activeElementInst=null,lastSelection=null;break;case"topMouseDown":mouseDown=!0;break;case"topContextMenu":case"topMouseUp":return mouseDown=!1,constructSelectEvent(nativeEvent,nativeEventTarget);case"topSelectionChange":if(skipSelectionChangeEvent)break;case"topKeyDown":case"topKeyUp":return constructSelectEvent(nativeEvent,nativeEventTarget)}return null},didPutListener:function(inst,registrationName,listener){"onSelect"===registrationName&&(hasListener=!0)}};module.exports=SelectEventPlugin},function(module,exports,__webpack_require__){"use strict";(function(process){function getDictionaryKey(inst){return"."+inst._rootNodeID}function isInteractive(tag){return"button"===tag||"input"===tag||"select"===tag||"textarea"===tag}var _prodInvariant=__webpack_require__(4),EventListener=__webpack_require__(93),EventPropagators=__webpack_require__(31),ReactDOMComponentTree=__webpack_require__(8),SyntheticAnimationEvent=__webpack_require__(276),SyntheticClipboardEvent=__webpack_require__(277),SyntheticEvent=__webpack_require__(20),SyntheticFocusEvent=__webpack_require__(280),SyntheticKeyboardEvent=__webpack_require__(282),SyntheticMouseEvent=__webpack_require__(41),SyntheticDragEvent=__webpack_require__(279),SyntheticTouchEvent=__webpack_require__(283),SyntheticTransitionEvent=__webpack_require__(284),SyntheticUIEvent=__webpack_require__(33),SyntheticWheelEvent=__webpack_require__(285),emptyFunction=__webpack_require__(12),getEventCharCode=__webpack_require__(63),invariant=__webpack_require__(1),eventTypes={},topLevelEventsToDispatchConfig={};["abort","animationEnd","animationIteration","animationStart","blur","canPlay","canPlayThrough","click","contextMenu","copy","cut","doubleClick","drag","dragEnd","dragEnter","dragExit","dragLeave","dragOver","dragStart","drop","durationChange","emptied","encrypted","ended","error","focus","input","invalid","keyDown","keyPress","keyUp","load","loadedData","loadedMetadata","loadStart","mouseDown","mouseMove","mouseOut","mouseOver","mouseUp","paste","pause","play","playing","progress","rateChange","reset","scroll","seeked","seeking","stalled","submit","suspend","timeUpdate","touchCancel","touchEnd","touchMove","touchStart","transitionEnd","volumeChange","waiting","wheel"].forEach(function(event){var capitalizedEvent=event[0].toUpperCase()+event.slice(1),onEvent="on"+capitalizedEvent,topEvent="top"+capitalizedEvent,type={phasedRegistrationNames:{bubbled:onEvent,captured:onEvent+"Capture"},dependencies:[topEvent]};eventTypes[event]=type,topLevelEventsToDispatchConfig[topEvent]=type});var onClickListeners={},SimpleEventPlugin={eventTypes:eventTypes,extractEvents:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){var dispatchConfig=topLevelEventsToDispatchConfig[topLevelType];if(!dispatchConfig)return null;var EventConstructor;switch(topLevelType){case"topAbort":case"topCanPlay":case"topCanPlayThrough":case"topDurationChange":case"topEmptied":case"topEncrypted":case"topEnded":case"topError":case"topInput":case"topInvalid":case"topLoad":case"topLoadedData":case"topLoadedMetadata":case"topLoadStart":case"topPause":case"topPlay":case"topPlaying":case"topProgress":case"topRateChange":case"topReset":case"topSeeked":case"topSeeking":case"topStalled":case"topSubmit":case"topSuspend":case"topTimeUpdate":case"topVolumeChange":case"topWaiting":EventConstructor=SyntheticEvent;break;case"topKeyPress":if(0===getEventCharCode(nativeEvent))return null;case"topKeyDown":case"topKeyUp":EventConstructor=SyntheticKeyboardEvent;break;case"topBlur":case"topFocus":EventConstructor=SyntheticFocusEvent;break;case"topClick":if(2===nativeEvent.button)return null;case"topDoubleClick":case"topMouseDown":case"topMouseMove":case"topMouseUp":case"topMouseOut":case"topMouseOver":case"topContextMenu":EventConstructor=SyntheticMouseEvent;break;case"topDrag":case"topDragEnd":case"topDragEnter":case"topDragExit":case"topDragLeave":case"topDragOver":case"topDragStart":case"topDrop":EventConstructor=SyntheticDragEvent;break;case"topTouchCancel":case"topTouchEnd":case"topTouchMove":case"topTouchStart":EventConstructor=SyntheticTouchEvent;break;case"topAnimationEnd":case"topAnimationIteration":case"topAnimationStart":EventConstructor=SyntheticAnimationEvent;break;case"topTransitionEnd":EventConstructor=SyntheticTransitionEvent;break;case"topScroll":EventConstructor=SyntheticUIEvent;break;case"topWheel":EventConstructor=SyntheticWheelEvent;break;case"topCopy":case"topCut":case"topPaste":EventConstructor=SyntheticClipboardEvent}EventConstructor||("production"!==process.env.NODE_ENV?invariant(!1,"SimpleEventPlugin: Unhandled event type, `%s`.",topLevelType):_prodInvariant("86",topLevelType));var event=EventConstructor.getPooled(dispatchConfig,targetInst,nativeEvent,nativeEventTarget);return EventPropagators.accumulateTwoPhaseDispatches(event),event},didPutListener:function(inst,registrationName,listener){if("onClick"===registrationName&&!isInteractive(inst._tag)){var key=getDictionaryKey(inst),node=ReactDOMComponentTree.getNodeFromInstance(inst);onClickListeners[key]||(onClickListeners[key]=EventListener.listen(node,"click",emptyFunction))}},willDeleteListener:function(inst,registrationName){if("onClick"===registrationName&&!isInteractive(inst._tag)){var key=getDictionaryKey(inst);onClickListeners[key].remove(),delete onClickListeners[key]}}};module.exports=SimpleEventPlugin}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function SyntheticAnimationEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticEvent=__webpack_require__(20),AnimationEventInterface={animationName:null,elapsedTime:null,pseudoElement:null};SyntheticEvent.augmentClass(SyntheticAnimationEvent,AnimationEventInterface),module.exports=SyntheticAnimationEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticClipboardEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticEvent=__webpack_require__(20),ClipboardEventInterface={clipboardData:function(event){return"clipboardData"in event?event.clipboardData:window.clipboardData}};SyntheticEvent.augmentClass(SyntheticClipboardEvent,ClipboardEventInterface),module.exports=SyntheticClipboardEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticCompositionEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticEvent=__webpack_require__(20),CompositionEventInterface={data:null};SyntheticEvent.augmentClass(SyntheticCompositionEvent,CompositionEventInterface),module.exports=SyntheticCompositionEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticDragEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticMouseEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticMouseEvent=__webpack_require__(41),DragEventInterface={dataTransfer:null};SyntheticMouseEvent.augmentClass(SyntheticDragEvent,DragEventInterface),module.exports=SyntheticDragEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticFocusEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticUIEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticUIEvent=__webpack_require__(33),FocusEventInterface={relatedTarget:null};SyntheticUIEvent.augmentClass(SyntheticFocusEvent,FocusEventInterface),module.exports=SyntheticFocusEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticInputEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticEvent=__webpack_require__(20),InputEventInterface={data:null};SyntheticEvent.augmentClass(SyntheticInputEvent,InputEventInterface),module.exports=SyntheticInputEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticKeyboardEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticUIEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticUIEvent=__webpack_require__(33),getEventCharCode=__webpack_require__(63),getEventKey=__webpack_require__(291),getEventModifierState=__webpack_require__(64),KeyboardEventInterface={key:getEventKey,location:null,ctrlKey:null,shiftKey:null,altKey:null,metaKey:null,repeat:null,locale:null,getModifierState:getEventModifierState,charCode:function(event){return"keypress"===event.type?getEventCharCode(event):0},keyCode:function(event){return"keydown"===event.type||"keyup"===event.type?event.keyCode:0},which:function(event){return"keypress"===event.type?getEventCharCode(event):"keydown"===event.type||"keyup"===event.type?event.keyCode:0}};SyntheticUIEvent.augmentClass(SyntheticKeyboardEvent,KeyboardEventInterface),module.exports=SyntheticKeyboardEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticTouchEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticUIEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticUIEvent=__webpack_require__(33),getEventModifierState=__webpack_require__(64),TouchEventInterface={touches:null,targetTouches:null,changedTouches:null,altKey:null,metaKey:null,ctrlKey:null,shiftKey:null,getModifierState:getEventModifierState};SyntheticUIEvent.augmentClass(SyntheticTouchEvent,TouchEventInterface),module.exports=SyntheticTouchEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticTransitionEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticEvent=__webpack_require__(20),TransitionEventInterface={propertyName:null,elapsedTime:null,pseudoElement:null};SyntheticEvent.augmentClass(SyntheticTransitionEvent,TransitionEventInterface),module.exports=SyntheticTransitionEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticWheelEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticMouseEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticMouseEvent=__webpack_require__(41),WheelEventInterface={deltaX:function(event){return"deltaX"in event?event.deltaX:"wheelDeltaX"in event?-event.wheelDeltaX:0},deltaY:function(event){return"deltaY"in event?event.deltaY:"wheelDeltaY"in event?-event.wheelDeltaY:"wheelDelta"in event?-event.wheelDelta:0},deltaZ:null,deltaMode:null};SyntheticMouseEvent.augmentClass(SyntheticWheelEvent,WheelEventInterface),module.exports=SyntheticWheelEvent},function(module,exports,__webpack_require__){"use strict";function adler32(data){for(var a=1,b=0,i=0,l=data.length,m=-4&l;i<m;){for(var n=Math.min(i+4096,m);i<n;i+=4)b+=(a+=data.charCodeAt(i))+(a+=data.charCodeAt(i+1))+(a+=data.charCodeAt(i+2))+(a+=data.charCodeAt(i+3));a%=MOD,b%=MOD}for(;i<l;i++)b+=a+=data.charCodeAt(i);return a%=MOD,b%=MOD,a|b<<16}var MOD=65521;module.exports=adler32},function(module,exports,__webpack_require__){"use strict";(function(process){function checkReactTypeSpec(typeSpecs,values,location,componentName,element,debugID){for(var typeSpecName in typeSpecs)if(typeSpecs.hasOwnProperty(typeSpecName)){var error;try{"function"!=typeof typeSpecs[typeSpecName]&&("production"!==process.env.NODE_ENV?invariant(!1,"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName):_prodInvariant("84",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName)),error=typeSpecs[typeSpecName](values,typeSpecName,componentName,location,null,ReactPropTypesSecret)}catch(ex){error=ex}if("production"!==process.env.NODE_ENV&&warning(!error||error instanceof Error,"%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName,typeof error),error instanceof Error&&!(error.message in loggedTypeFailures)){loggedTypeFailures[error.message]=!0;var componentStackInfo="";"production"!==process.env.NODE_ENV&&(ReactComponentTreeHook||(ReactComponentTreeHook=__webpack_require__(11)),null!==debugID?componentStackInfo=ReactComponentTreeHook.getStackAddendumByID(debugID):null!==element&&(componentStackInfo=ReactComponentTreeHook.getCurrentStackAddendum(element))),"production"!==process.env.NODE_ENV&&warning(!1,"Failed %s type: %s%s",location,error.message,componentStackInfo)}}}var ReactComponentTreeHook,_prodInvariant=__webpack_require__(4),ReactPropTypeLocationNames=__webpack_require__(267),ReactPropTypesSecret=__webpack_require__(113),invariant=__webpack_require__(1),warning=__webpack_require__(2);void 0!==process&&process.env&&"test"===process.env.NODE_ENV&&(ReactComponentTreeHook=__webpack_require__(11));var loggedTypeFailures={};module.exports=checkReactTypeSpec}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function dangerousStyleValue(name,value,component,isCustomProperty){if(null==value||"boolean"==typeof value||""===value)return"";var isNonNumeric=isNaN(value);if(isCustomProperty||isNonNumeric||0===value||isUnitlessNumber.hasOwnProperty(name)&&isUnitlessNumber[name])return""+value;if("string"==typeof value){if("production"!==process.env.NODE_ENV&&component&&"0"!==value){var owner=component._currentElement._owner,ownerName=owner?owner.getName():null;ownerName&&!styleWarnings[ownerName]&&(styleWarnings[ownerName]={});var warned=!1;if(ownerName){var warnings=styleWarnings[ownerName];warned=warnings[name],warned||(warnings[name]=!0)}warned||"production"!==process.env.NODE_ENV&&warning(!1,"a `%s` tag (owner: `%s`) was passed a numeric string value for CSS property `%s` (value: `%s`) which will be treated as a unitless number in a future version of React.",component._currentElement.type,ownerName||"unknown",name,value)}value=value.trim()}return value+"px"}var CSSProperty=__webpack_require__(102),warning=__webpack_require__(2),isUnitlessNumber=CSSProperty.isUnitlessNumber,styleWarnings={};module.exports=dangerousStyleValue}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function findDOMNode(componentOrElement){if("production"!==process.env.NODE_ENV){var owner=ReactCurrentOwner.current;null!==owner&&("production"!==process.env.NODE_ENV&&warning(owner._warnedAboutRefsInRender,"%s is accessing findDOMNode inside its render(). render() should be a pure function of props and state. It should never access something that requires stale data from the previous render, such as refs. Move this logic to componentDidMount and componentDidUpdate instead.",owner.getName()||"A component"),owner._warnedAboutRefsInRender=!0)}if(null==componentOrElement)return null;if(1===componentOrElement.nodeType)return componentOrElement;var inst=ReactInstanceMap.get(componentOrElement);if(inst)return inst=getHostComponentFromComposite(inst),inst?ReactDOMComponentTree.getNodeFromInstance(inst):null;"function"==typeof componentOrElement.render?"production"!==process.env.NODE_ENV?invariant(!1,"findDOMNode was called on an unmounted component."):_prodInvariant("44"):"production"!==process.env.NODE_ENV?invariant(!1,"Element appears to be neither ReactComponent nor DOMNode (keys: %s)",Object.keys(componentOrElement)):_prodInvariant("45",Object.keys(componentOrElement))}var _prodInvariant=__webpack_require__(4),ReactCurrentOwner=__webpack_require__(18),ReactDOMComponentTree=__webpack_require__(8),ReactInstanceMap=__webpack_require__(32),getHostComponentFromComposite=__webpack_require__(117),invariant=__webpack_require__(1),warning=__webpack_require__(2);module.exports=findDOMNode}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function flattenSingleChildIntoContext(traverseContext,child,name,selfDebugID){if(traverseContext&&"object"==typeof traverseContext){var result=traverseContext,keyUnique=void 0===result[name];"production"!==process.env.NODE_ENV&&(ReactComponentTreeHook||(ReactComponentTreeHook=__webpack_require__(11)),keyUnique||"production"!==process.env.NODE_ENV&&warning(!1,"flattenChildren(...): Encountered two children with the same key, `%s`. Child keys must be unique; when two children share a key, only the first child will be used.%s",KeyEscapeUtils.unescape(name),ReactComponentTreeHook.getStackAddendumByID(selfDebugID))),keyUnique&&null!=child&&(result[name]=child)}}function flattenChildren(children,selfDebugID){if(null==children)return children;var result={};return"production"!==process.env.NODE_ENV?traverseAllChildren(children,function(traverseContext,child,name){return flattenSingleChildIntoContext(traverseContext,child,name,selfDebugID)},result):traverseAllChildren(children,flattenSingleChildIntoContext,result),result}var ReactComponentTreeHook,KeyEscapeUtils=__webpack_require__(57),traverseAllChildren=__webpack_require__(123),warning=__webpack_require__(2);void 0!==process&&process.env&&"test"===process.env.NODE_ENV&&(ReactComponentTreeHook=__webpack_require__(11)),module.exports=flattenChildren}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function getEventKey(nativeEvent){if(nativeEvent.key){var key=normalizeKey[nativeEvent.key]||nativeEvent.key;if("Unidentified"!==key)return key}if("keypress"===nativeEvent.type){var charCode=getEventCharCode(nativeEvent);return 13===charCode?"Enter":String.fromCharCode(charCode)}return"keydown"===nativeEvent.type||"keyup"===nativeEvent.type?translateToKey[nativeEvent.keyCode]||"Unidentified":""}var getEventCharCode=__webpack_require__(63),normalizeKey={Esc:"Escape",Spacebar:" ",Left:"ArrowLeft",Up:"ArrowUp",Right:"ArrowRight",Down:"ArrowDown",Del:"Delete",Win:"OS",Menu:"ContextMenu",Apps:"ContextMenu",Scroll:"ScrollLock",MozPrintableKey:"Unidentified"},translateToKey={8:"Backspace",9:"Tab",12:"Clear",13:"Enter",16:"Shift",17:"Control",18:"Alt",19:"Pause",20:"CapsLock",27:"Escape",32:" ",33:"PageUp",34:"PageDown",35:"End",36:"Home",37:"ArrowLeft",38:"ArrowUp",39:"ArrowRight",40:"ArrowDown",45:"Insert",46:"Delete",112:"F1",113:"F2",114:"F3",115:"F4",116:"F5",117:"F6",118:"F7",119:"F8",120:"F9",121:"F10",122:"F11",123:"F12",144:"NumLock",145:"ScrollLock",224:"Meta"};module.exports=getEventKey},function(module,exports,__webpack_require__){"use strict";function getIteratorFn(maybeIterable){var iteratorFn=maybeIterable&&(ITERATOR_SYMBOL&&maybeIterable[ITERATOR_SYMBOL]||maybeIterable[FAUX_ITERATOR_SYMBOL]);if("function"==typeof iteratorFn)return iteratorFn}var ITERATOR_SYMBOL="function"==typeof Symbol&&Symbol.iterator,FAUX_ITERATOR_SYMBOL="@@iterator";module.exports=getIteratorFn},function(module,exports,__webpack_require__){"use strict";function getLeafNode(node){for(;node&&node.firstChild;)node=node.firstChild;return node}function getSiblingNode(node){for(;node;){if(node.nextSibling)return node.nextSibling;node=node.parentNode}}function getNodeForCharacterOffset(root,offset){for(var node=getLeafNode(root),nodeStart=0,nodeEnd=0;node;){if(3===node.nodeType){if(nodeEnd=nodeStart+node.textContent.length,nodeStart<=offset&&nodeEnd>=offset)return{node:node,offset:offset-nodeStart};nodeStart=nodeEnd}node=getLeafNode(getSiblingNode(node))}}module.exports=getNodeForCharacterOffset},function(module,exports,__webpack_require__){"use strict";function makePrefixMap(styleProp,eventName){var prefixes={};return prefixes[styleProp.toLowerCase()]=eventName.toLowerCase(),prefixes["Webkit"+styleProp]="webkit"+eventName,prefixes["Moz"+styleProp]="moz"+eventName,prefixes["ms"+styleProp]="MS"+eventName,prefixes["O"+styleProp]="o"+eventName.toLowerCase(),prefixes}function getVendorPrefixedEventName(eventName){if(prefixedEventNames[eventName])return prefixedEventNames[eventName];if(!vendorPrefixes[eventName])return eventName;var prefixMap=vendorPrefixes[eventName];for(var styleProp in prefixMap)if(prefixMap.hasOwnProperty(styleProp)&&styleProp in style)return prefixedEventNames[eventName]=prefixMap[styleProp];return""}var ExecutionEnvironment=__webpack_require__(9),vendorPrefixes={animationend:makePrefixMap("Animation","AnimationEnd"),animationiteration:makePrefixMap("Animation","AnimationIteration"),animationstart:makePrefixMap("Animation","AnimationStart"),transitionend:makePrefixMap("Transition","TransitionEnd")},prefixedEventNames={},style={};ExecutionEnvironment.canUseDOM&&(style=document.createElement("div").style,"AnimationEvent"in window||(delete vendorPrefixes.animationend.animation,delete vendorPrefixes.animationiteration.animation,delete vendorPrefixes.animationstart.animation),"TransitionEvent"in window||delete vendorPrefixes.transitionend.transition),module.exports=getVendorPrefixedEventName},function(module,exports,__webpack_require__){"use strict";function quoteAttributeValueForBrowser(value){return'"'+escapeTextContentForBrowser(value)+'"'}var escapeTextContentForBrowser=__webpack_require__(43);module.exports=quoteAttributeValueForBrowser},function(module,exports,__webpack_require__){"use strict";var ReactMount=__webpack_require__(111);module.exports=ReactMount.renderSubtreeIntoContainer},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function reactElementToJSXString(ReactElement){function toJSXString(_ref2){var _ref2$ReactElement=_ref2.ReactElement,Element=void 0===_ref2$ReactElement?null:_ref2$ReactElement,_ref2$lvl=_ref2.lvl,lvl=void 0===_ref2$lvl?0:_ref2$lvl,_ref2$inline=_ref2.inline,inline=void 0!==_ref2$inline&&_ref2$inline;if("string"==typeof Element||"number"==typeof Element)return Element;if(!(0,_react.isValidElement)(Element))throw new Error("react-element-to-jsx-string: Expected a ReactElement,\ngot `"+(void 0===Element?"undefined":_typeof(Element))+"`");var tagName=getDisplayName(Element),out="<"+tagName,props=formatProps(Element.props,getDefaultProps(Element),inline,sortProps,lvl),attributes=[],children=_react2.default.Children.toArray(Element.props.children).filter(onlyMeaningfulChildren);null!==Element.ref&&attributes.push(getJSXAttribute("ref",Element.ref,inline,lvl)),null===Element.key||/^\./.test(Element.key)||attributes.push(getJSXAttribute("key",Element.key,inline,lvl)),attributes=attributes.concat(props).filter(function(_ref3){var name=_ref3.name;return-1===filterProps.indexOf(name)});var outMultilineAttr=out,outInlineAttr=out,containsMultilineAttr=!1;return attributes.forEach(function(attribute){var isMultilineAttr=!1;["plainObject","array","function"].indexOf(attribute.type)>-1&&(isMultilineAttr=attribute.value.indexOf("\n")>-1),isMultilineAttr&&(containsMultilineAttr=!0),outInlineAttr+=" ",outMultilineAttr+="\n"+spacer(lvl+1,tabStop),useBooleanShorthandSyntax&&"{true}"===attribute.value?(outInlineAttr+=""+attribute.name,outMultilineAttr+=""+attribute.name):(outInlineAttr+=attribute.name+"="+attribute.value,outMultilineAttr+=attribute.name+"="+attribute.value)}),outMultilineAttr+="\n"+spacer(lvl,tabStop),out=shouldRenderMultilineAttr(attributes,outInlineAttr,containsMultilineAttr,inline,lvl)?outMultilineAttr:outInlineAttr,children.length>0?(out+=">",lvl++,inline||(out+="\n",out+=spacer(lvl,tabStop)),out+="string"==typeof children?children:children.reduce(mergePlainStringChildren,[]).map(recurse({lvl:lvl,inline:inline})).join("\n"+spacer(lvl,tabStop)),inline||(out+="\n",out+=spacer(lvl-1,tabStop)),out+="</"+tagName+">"):(isInlineAttributeTooLong(attributes,outInlineAttr,lvl)||(out+=" "),out+="/>"),out}function shouldRenderMultilineAttr(attributes,inlineAttributeString,containsMultilineAttr,inline,lvl){return(isInlineAttributeTooLong(attributes,inlineAttributeString,lvl)||containsMultilineAttr)&&!inline}function isInlineAttributeTooLong(attributes,inlineAttributeString,lvl){return void 0===maxInlineAttributesLineLength?attributes.length>1:spacer(lvl,tabStop).length+inlineAttributeString.length>maxInlineAttributesLineLength}function formatProps(props,defaultProps,inline,sortProps,lvl){var formatted=Object.keys(props).filter(noChildren);return useBooleanShorthandSyntax&&(formatted=formatted.filter(function(key){return noFalse(props[key],defaultProps[key])})),showDefaultProps||(formatted=formatted.filter(function(key){return void 0===defaultProps[key]?void 0!==props[key]:defaultProps[key]!==props[key]})),sortProps&&(formatted=formatted.sort()),formatted.map(function(propName){return getJSXAttribute(propName,props[propName],inline,lvl)})}function getJSXAttribute(name,value,inline,lvl){return{name:name,type:getValueType(value),value:formatJSXAttribute(value,inline,lvl).replace(/'?<__reactElementToJSXString__Wrapper__>/g,"").replace(/<\/__reactElementToJSXString__Wrapper__>'?/g,"")}}function formatJSXAttribute(propValue,inline,lvl){return"string"==typeof propValue?'"'+escape(propValue)+'"':"symbol"===(void 0===propValue?"undefined":_typeof(propValue))?"{"+propValue.toString()+"}":"{"+formatValue(propValue,inline,lvl)+"}"}function getValueType(value){return(0,_react.isValidElement)(value)?"element":(0,_isPlainObject2.default)(value)?"plainObject":Array.isArray(value)?"array":void 0===value?"undefined":_typeof(value)}function isFunction(value){return"function"==typeof value}function formatValue(value,inline,lvl){var wrapper="__reactElementToJSXString__Wrapper__";return isFunction(value)?functionValue(!1===showFunctions&&functionValue===defaultFunctionValue?function(){}:value):(0,_react.isValidElement)(value)?"<"+wrapper+">"+toJSXString({ReactElement:value,inline:!0})+"</"+wrapper+">":(0,_isPlainObject2.default)(value)||Array.isArray(value)?"<"+wrapper+">"+stringifyObject(value,inline,lvl)+"</"+wrapper+">":value}function recurse(_ref4){var lvl=_ref4.lvl,inline=_ref4.inline;return function(Element){return toJSXString({ReactElement:Element,lvl:lvl,inline:inline})}}function stringifyObject(obj,inline,lvl){(Object.keys(obj).length>0||obj.length>0)&&(obj=(0,_traverse2.default)(obj).map(function(value){((0,_react.isValidElement)(value)||this.isLeaf)&&this.update(formatValue(value,inline,lvl))}),obj=(0,_sortobject2.default)(obj));var stringified=(0,_stringifyObject2.default)(obj);return inline?(0,_collapseWhiteSpace2.default)(stringified).replace(/{ /g,"{").replace(/ }/g,"}").replace(/\[ /g,"[").replace(/ ]/g,"]"):stringified.replace(/\\\'/g,"'").replace(/\t/g,spacer(1,tabStop)).replace(/\n([^$])/g,"\n"+spacer(lvl+1,tabStop)+"$1")}var _ref=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},displayName=_ref.displayName,_ref$filterProps=_ref.filterProps,filterProps=void 0===_ref$filterProps?[]:_ref$filterProps,_ref$showDefaultProps=_ref.showDefaultProps,showDefaultProps=void 0===_ref$showDefaultProps||_ref$showDefaultProps,_ref$showFunctions=_ref.showFunctions,showFunctions=void 0!==_ref$showFunctions&&_ref$showFunctions,_ref$functionValue=_ref.functionValue,functionValue=void 0===_ref$functionValue?defaultFunctionValue:_ref$functionValue,_ref$tabStop=_ref.tabStop,tabStop=void 0===_ref$tabStop?2:_ref$tabStop,_ref$useBooleanShorth=_ref.useBooleanShorthandSyntax,useBooleanShorthandSyntax=void 0===_ref$useBooleanShorth||_ref$useBooleanShorth,maxInlineAttributesLineLength=_ref.maxInlineAttributesLineLength,_ref$sortProps=_ref.sortProps,sortProps=void 0===_ref$sortProps||_ref$sortProps,getDisplayName=displayName||getDefaultDisplayName;return toJSXString({ReactElement:ReactElement})}function getDefaultDisplayName(ReactElement){return ReactElement.type.displayName||ReactElement.type.name||("function"==typeof ReactElement.type?"No Display Name":ReactElement.type)}function getDefaultProps(ReactElement){return ReactElement.type.defaultProps||{}}function mergePlainStringChildren(prev,cur){var lastItem=prev[prev.length-1];return"number"==typeof cur&&(cur=String(cur)),"string"==typeof lastItem&&"string"==typeof cur?prev[prev.length-1]+=cur:prev.push(cur),prev}function spacer(times,tabStop){return 0===times?"":(0,_fill3.default)(new Array(times*tabStop)," ").join("")}function noChildren(propName){return"children"!==propName}function noFalse(propValue,defaultValue){return"boolean"!=typeof propValue||propValue||Boolean(defaultValue)}function onlyMeaningfulChildren(children){return!0!==children&&!1!==children&&null!==children&&""!==children}Object.defineProperty(exports,"__esModule",{value:!0});var _fill2=__webpack_require__(214),_fill3=_interopRequireDefault(_fill2),_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj};exports.default=reactElementToJSXString;var _react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_collapseWhiteSpace=__webpack_require__(185),_collapseWhiteSpace2=_interopRequireDefault(_collapseWhiteSpace),_isPlainObject=__webpack_require__(202),_isPlainObject2=_interopRequireDefault(_isPlainObject),_stringifyObject=__webpack_require__(148),_stringifyObject2=_interopRequireDefault(_stringifyObject),_sortobject=__webpack_require__(311),_sortobject2=_interopRequireDefault(_sortobject),_traverse=__webpack_require__(312),_traverse2=_interopRequireDefault(_traverse),escape=function(s){return s.replace(/"/g,"&quot;")},defaultFunctionValue=function(fn){return fn}},function(module,exports,__webpack_require__){"use strict";function escape(key){var escaperLookup={"=":"=0",":":"=2"};return"$"+(""+key).replace(/[=:]/g,function(match){return escaperLookup[match]})}function unescape(key){var unescapeRegex=/(=0|=2)/g,unescaperLookup={"=0":"=","=2":":"};return(""+("."===key[0]&&"$"===key[1]?key.substring(2):key.substring(1))).replace(unescapeRegex,function(match){return unescaperLookup[match]})}var KeyEscapeUtils={escape:escape,unescape:unescape};module.exports=KeyEscapeUtils},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(29),invariant=__webpack_require__(1),oneArgumentPooler=function(copyFieldsFrom){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,copyFieldsFrom),instance}return new Klass(copyFieldsFrom)},twoArgumentPooler=function(a1,a2){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2),instance}return new Klass(a1,a2)},threeArgumentPooler=function(a1,a2,a3){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2,a3),instance}return new Klass(a1,a2,a3)},fourArgumentPooler=function(a1,a2,a3,a4){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2,a3,a4),instance}return new Klass(a1,a2,a3,a4)},standardReleaser=function(instance){var Klass=this;instance instanceof Klass||("production"!==process.env.NODE_ENV?invariant(!1,"Trying to release an instance into a pool of a different type."):_prodInvariant("25")),instance.destructor(),Klass.instancePool.length<Klass.poolSize&&Klass.instancePool.push(instance)},DEFAULT_POOLER=oneArgumentPooler,addPoolingTo=function(CopyConstructor,pooler){var NewKlass=CopyConstructor;return NewKlass.instancePool=[],NewKlass.getPooled=pooler||DEFAULT_POOLER,NewKlass.poolSize||(NewKlass.poolSize=10),NewKlass.release=standardReleaser,NewKlass},PooledClass={addPoolingTo:addPoolingTo,oneArgumentPooler:oneArgumentPooler,twoArgumentPooler:twoArgumentPooler,threeArgumentPooler:threeArgumentPooler,fourArgumentPooler:fourArgumentPooler};module.exports=PooledClass}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function escapeUserProvidedKey(text){return(""+text).replace(userProvidedKeyEscapeRegex,"$&/")}function ForEachBookKeeping(forEachFunction,forEachContext){this.func=forEachFunction,this.context=forEachContext,this.count=0}function forEachSingleChild(bookKeeping,child,name){var func=bookKeeping.func,context=bookKeeping.context;func.call(context,child,bookKeeping.count++)}function forEachChildren(children,forEachFunc,forEachContext){if(null==children)return children;var traverseContext=ForEachBookKeeping.getPooled(forEachFunc,forEachContext);traverseAllChildren(children,forEachSingleChild,traverseContext),ForEachBookKeeping.release(traverseContext)}function MapBookKeeping(mapResult,keyPrefix,mapFunction,mapContext){this.result=mapResult,this.keyPrefix=keyPrefix,this.func=mapFunction,this.context=mapContext,this.count=0}function mapSingleChildIntoContext(bookKeeping,child,childKey){var result=bookKeeping.result,keyPrefix=bookKeeping.keyPrefix,func=bookKeeping.func,context=bookKeeping.context,mappedChild=func.call(context,child,bookKeeping.count++);Array.isArray(mappedChild)?mapIntoWithKeyPrefixInternal(mappedChild,result,childKey,emptyFunction.thatReturnsArgument):null!=mappedChild&&(ReactElement.isValidElement(mappedChild)&&(mappedChild=ReactElement.cloneAndReplaceKey(mappedChild,keyPrefix+(!mappedChild.key||child&&child.key===mappedChild.key?"":escapeUserProvidedKey(mappedChild.key)+"/")+childKey)),result.push(mappedChild))}function mapIntoWithKeyPrefixInternal(children,array,prefix,func,context){var escapedPrefix="";null!=prefix&&(escapedPrefix=escapeUserProvidedKey(prefix)+"/");var traverseContext=MapBookKeeping.getPooled(array,escapedPrefix,func,context);traverseAllChildren(children,mapSingleChildIntoContext,traverseContext),MapBookKeeping.release(traverseContext)}function mapChildren(children,func,context){if(null==children)return children;var result=[];return mapIntoWithKeyPrefixInternal(children,result,null,func,context),result}function forEachSingleChildDummy(traverseContext,child,name){return null}function countChildren(children,context){return traverseAllChildren(children,forEachSingleChildDummy,null)}function toArray(children){var result=[];return mapIntoWithKeyPrefixInternal(children,result,null,emptyFunction.thatReturnsArgument),result}var PooledClass=__webpack_require__(299),ReactElement=__webpack_require__(24),emptyFunction=__webpack_require__(12),traverseAllChildren=__webpack_require__(310),twoArgumentPooler=PooledClass.twoArgumentPooler,fourArgumentPooler=PooledClass.fourArgumentPooler,userProvidedKeyEscapeRegex=/\/+/g;ForEachBookKeeping.prototype.destructor=function(){this.func=null,this.context=null,this.count=0},PooledClass.addPoolingTo(ForEachBookKeeping,twoArgumentPooler),MapBookKeeping.prototype.destructor=function(){this.result=null,this.keyPrefix=null,this.func=null,this.context=null,this.count=0},PooledClass.addPoolingTo(MapBookKeeping,fourArgumentPooler);var ReactChildren={forEach:forEachChildren,map:mapChildren,mapIntoWithKeyPrefixInternal:mapIntoWithKeyPrefixInternal,count:countChildren,toArray:toArray};module.exports=ReactChildren},function(module,exports,__webpack_require__){"use strict";(function(process){var ReactElement=__webpack_require__(24),createDOMFactory=ReactElement.createFactory;if("production"!==process.env.NODE_ENV){createDOMFactory=__webpack_require__(126).createFactory}var ReactDOMFactories={a:createDOMFactory("a"),abbr:createDOMFactory("abbr"),address:createDOMFactory("address"),area:createDOMFactory("area"),article:createDOMFactory("article"),aside:createDOMFactory("aside"),audio:createDOMFactory("audio"),b:createDOMFactory("b"),base:createDOMFactory("base"),bdi:createDOMFactory("bdi"),bdo:createDOMFactory("bdo"),big:createDOMFactory("big"),blockquote:createDOMFactory("blockquote"),body:createDOMFactory("body"),br:createDOMFactory("br"),button:createDOMFactory("button"),canvas:createDOMFactory("canvas"),caption:createDOMFactory("caption"),cite:createDOMFactory("cite"),code:createDOMFactory("code"),col:createDOMFactory("col"),colgroup:createDOMFactory("colgroup"),data:createDOMFactory("data"),datalist:createDOMFactory("datalist"),dd:createDOMFactory("dd"),del:createDOMFactory("del"),details:createDOMFactory("details"),dfn:createDOMFactory("dfn"),dialog:createDOMFactory("dialog"),div:createDOMFactory("div"),dl:createDOMFactory("dl"),dt:createDOMFactory("dt"),em:createDOMFactory("em"),embed:createDOMFactory("embed"),fieldset:createDOMFactory("fieldset"),figcaption:createDOMFactory("figcaption"),figure:createDOMFactory("figure"),footer:createDOMFactory("footer"),form:createDOMFactory("form"),h1:createDOMFactory("h1"),h2:createDOMFactory("h2"),h3:createDOMFactory("h3"),h4:createDOMFactory("h4"),h5:createDOMFactory("h5"),h6:createDOMFactory("h6"),head:createDOMFactory("head"),header:createDOMFactory("header"),hgroup:createDOMFactory("hgroup"),hr:createDOMFactory("hr"),html:createDOMFactory("html"),i:createDOMFactory("i"),iframe:createDOMFactory("iframe"),img:createDOMFactory("img"),input:createDOMFactory("input"),ins:createDOMFactory("ins"),kbd:createDOMFactory("kbd"),keygen:createDOMFactory("keygen"),label:createDOMFactory("label"),legend:createDOMFactory("legend"),li:createDOMFactory("li"),link:createDOMFactory("link"),main:createDOMFactory("main"),map:createDOMFactory("map"),mark:createDOMFactory("mark"),menu:createDOMFactory("menu"),menuitem:createDOMFactory("menuitem"),meta:createDOMFactory("meta"),meter:createDOMFactory("meter"),nav:createDOMFactory("nav"),noscript:createDOMFactory("noscript"),object:createDOMFactory("object"),ol:createDOMFactory("ol"),optgroup:createDOMFactory("optgroup"),option:createDOMFactory("option"),output:createDOMFactory("output"),p:createDOMFactory("p"),param:createDOMFactory("param"),picture:createDOMFactory("picture"),pre:createDOMFactory("pre"),progress:createDOMFactory("progress"),q:createDOMFactory("q"),rp:createDOMFactory("rp"),rt:createDOMFactory("rt"),ruby:createDOMFactory("ruby"),s:createDOMFactory("s"),samp:createDOMFactory("samp"),script:createDOMFactory("script"),section:createDOMFactory("section"),select:createDOMFactory("select"),small:createDOMFactory("small"),source:createDOMFactory("source"),span:createDOMFactory("span"),strong:createDOMFactory("strong"),style:createDOMFactory("style"),sub:createDOMFactory("sub"),summary:createDOMFactory("summary"),sup:createDOMFactory("sup"),table:createDOMFactory("table"),tbody:createDOMFactory("tbody"),td:createDOMFactory("td"),textarea:createDOMFactory("textarea"),tfoot:createDOMFactory("tfoot"),th:createDOMFactory("th"),thead:createDOMFactory("thead"),time:createDOMFactory("time"),title:createDOMFactory("title"),tr:createDOMFactory("tr"),track:createDOMFactory("track"),u:createDOMFactory("u"),ul:createDOMFactory("ul"),var:createDOMFactory("var"),video:createDOMFactory("video"),wbr:createDOMFactory("wbr"),circle:createDOMFactory("circle"),clipPath:createDOMFactory("clipPath"),defs:createDOMFactory("defs"),ellipse:createDOMFactory("ellipse"),g:createDOMFactory("g"),image:createDOMFactory("image"),line:createDOMFactory("line"),linearGradient:createDOMFactory("linearGradient"),mask:createDOMFactory("mask"),path:createDOMFactory("path"),pattern:createDOMFactory("pattern"),polygon:createDOMFactory("polygon"),polyline:createDOMFactory("polyline"),radialGradient:createDOMFactory("radialGradient"),rect:createDOMFactory("rect"),stop:createDOMFactory("stop"),svg:createDOMFactory("svg"),text:createDOMFactory("text"),tspan:createDOMFactory("tspan")};module.exports=ReactDOMFactories}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var ReactPropTypeLocationNames={};"production"!==process.env.NODE_ENV&&(ReactPropTypeLocationNames={prop:"prop",context:"context",childContext:"child context"}),module.exports=ReactPropTypeLocationNames}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var _require=__webpack_require__(24),isValidElement=_require.isValidElement,factory=__webpack_require__(100);module.exports=factory(isValidElement)},function(module,exports,__webpack_require__){"use strict";module.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(module,exports,__webpack_require__){"use strict";module.exports="15.6.1"},function(module,exports,__webpack_require__){"use strict";(function(process){function checkReactTypeSpec(typeSpecs,values,location,componentName,element,debugID){for(var typeSpecName in typeSpecs)if(typeSpecs.hasOwnProperty(typeSpecName)){var error;try{"function"!=typeof typeSpecs[typeSpecName]&&("production"!==process.env.NODE_ENV?invariant(!1,"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName):_prodInvariant("84",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName)),error=typeSpecs[typeSpecName](values,typeSpecName,componentName,location,null,ReactPropTypesSecret)}catch(ex){error=ex}if("production"!==process.env.NODE_ENV&&warning(!error||error instanceof Error,"%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName,typeof error),error instanceof Error&&!(error.message in loggedTypeFailures)){loggedTypeFailures[error.message]=!0;var componentStackInfo="";"production"!==process.env.NODE_ENV&&(ReactComponentTreeHook||(ReactComponentTreeHook=__webpack_require__(11)),null!==debugID?componentStackInfo=ReactComponentTreeHook.getStackAddendumByID(debugID):null!==element&&(componentStackInfo=ReactComponentTreeHook.getCurrentStackAddendum(element))),"production"!==process.env.NODE_ENV&&warning(!1,"Failed %s type: %s%s",location,error.message,componentStackInfo)}}}var ReactComponentTreeHook,_prodInvariant=__webpack_require__(29),ReactPropTypeLocationNames=__webpack_require__(302),ReactPropTypesSecret=__webpack_require__(304),invariant=__webpack_require__(1),warning=__webpack_require__(2);void 0!==process&&process.env&&"test"===process.env.NODE_ENV&&(ReactComponentTreeHook=__webpack_require__(11));var loggedTypeFailures={};module.exports=checkReactTypeSpec}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var _require=__webpack_require__(124),Component=_require.Component,_require2=__webpack_require__(24),isValidElement=_require2.isValidElement,ReactNoopUpdateQueue=__webpack_require__(127),factory=__webpack_require__(186);module.exports=factory(Component,isValidElement,ReactNoopUpdateQueue)},function(module,exports,__webpack_require__){"use strict";function getNextDebugID(){return nextDebugID++}var nextDebugID=1;module.exports=getNextDebugID},function(module,exports,__webpack_require__){"use strict";(function(process){function onlyChild(children){return ReactElement.isValidElement(children)||("production"!==process.env.NODE_ENV?invariant(!1,"React.Children.only expected to receive a single React element child."):_prodInvariant("143")),children}var _prodInvariant=__webpack_require__(29),ReactElement=__webpack_require__(24),invariant=__webpack_require__(1);module.exports=onlyChild}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function getComponentKey(component,index){return component&&"object"==typeof component&&null!=component.key?KeyEscapeUtils.escape(component.key):index.toString(36)}function traverseAllChildrenImpl(children,nameSoFar,callback,traverseContext){var type=typeof children;if("undefined"!==type&&"boolean"!==type||(children=null),null===children||"string"===type||"number"===type||"object"===type&&children.$$typeof===REACT_ELEMENT_TYPE)return callback(traverseContext,children,""===nameSoFar?SEPARATOR+getComponentKey(children,0):nameSoFar),1;var child,nextName,subtreeCount=0,nextNamePrefix=""===nameSoFar?SEPARATOR:nameSoFar+SUBSEPARATOR;if(Array.isArray(children))for(var i=0;i<children.length;i++)child=children[i],nextName=nextNamePrefix+getComponentKey(child,i),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext);else{var iteratorFn=getIteratorFn(children);if(iteratorFn){var step,iterator=iteratorFn.call(children);if(iteratorFn!==children.entries)for(var ii=0;!(step=iterator.next()).done;)child=step.value,nextName=nextNamePrefix+getComponentKey(child,ii++),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext);else{if("production"!==process.env.NODE_ENV){var mapsAsChildrenAddendum="";if(ReactCurrentOwner.current){var mapsAsChildrenOwnerName=ReactCurrentOwner.current.getName();mapsAsChildrenOwnerName&&(mapsAsChildrenAddendum=" Check the render method of `"+mapsAsChildrenOwnerName+"`.")}"production"!==process.env.NODE_ENV&&warning(didWarnAboutMaps,"Using Maps as children is not yet fully supported. It is an experimental feature that might be removed. Convert it to a sequence / iterable of keyed ReactElements instead.%s",mapsAsChildrenAddendum),didWarnAboutMaps=!0}for(;!(step=iterator.next()).done;){var entry=step.value;entry&&(child=entry[1],nextName=nextNamePrefix+KeyEscapeUtils.escape(entry[0])+SUBSEPARATOR+getComponentKey(child,0),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext))}}}else if("object"===type){var addendum="";if("production"!==process.env.NODE_ENV&&(addendum=" If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons.",children._isReactElement&&(addendum=" It looks like you're using an element created by a different version of React. Make sure to use only one copy of React."),ReactCurrentOwner.current)){var name=ReactCurrentOwner.current.getName();name&&(addendum+=" Check the render method of `"+name+"`.")}var childrenString=String(children);"production"!==process.env.NODE_ENV?invariant(!1,"Objects are not valid as a React child (found: %s).%s","[object Object]"===childrenString?"object with keys {"+Object.keys(children).join(", ")+"}":childrenString,addendum):_prodInvariant("31","[object Object]"===childrenString?"object with keys {"+Object.keys(children).join(", ")+"}":childrenString,addendum)}}return subtreeCount}function traverseAllChildren(children,callback,traverseContext){return null==children?0:traverseAllChildrenImpl(children,"",callback,traverseContext)}var _prodInvariant=__webpack_require__(29),ReactCurrentOwner=__webpack_require__(18),REACT_ELEMENT_TYPE=__webpack_require__(125),getIteratorFn=__webpack_require__(128),invariant=__webpack_require__(1),KeyEscapeUtils=__webpack_require__(298),warning=__webpack_require__(2),SEPARATOR=".",SUBSEPARATOR=":",didWarnAboutMaps=!1;module.exports=traverseAllChildren}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol?"symbol":typeof obj};module.exports=function sortObject(obj,comparator){if(Array.isArray(obj)){for(var result=[],i=0;i<obj.length;++i){var value=obj[i];null!=value&&"object"===(void 0===value?"undefined":_typeof(value))&&(value=sortObject(value,comparator)),result.push(value)}return result}for(var _result={},sortedKeys=Object.keys(obj).sort(comparator),_i=0;_i<sortedKeys.length;++_i){var key=sortedKeys[_i],_value=obj[key];null!=_value&&"object"===(void 0===_value?"undefined":_typeof(_value))&&(_value=sortObject(_value,comparator)),_result[key]=_value}return _result}},function(module,exports){function Traverse(obj){this.value=obj}function walk(root,cb,immutable){var path=[],parents=[],alive=!0;return function walker(node_){function updateState(){if("object"==typeof state.node&&null!==state.node){state.keys&&state.node_===state.node||(state.keys=objectKeys(state.node)),state.isLeaf=0==state.keys.length;for(var i=0;i<parents.length;i++)if(parents[i].node_===node_){state.circular=parents[i];break}}else state.isLeaf=!0,state.keys=null;state.notLeaf=!state.isLeaf,state.notRoot=!state.isRoot}var node=immutable?copy(node_):node_,modifiers={},keepGoing=!0,state={node:node,node_:node_,path:[].concat(path),parent:parents[parents.length-1],parents:parents,key:path.slice(-1)[0],isRoot:0===path.length,level:path.length,circular:null,update:function(x,stopHere){state.isRoot||(state.parent.node[state.key]=x),state.node=x,stopHere&&(keepGoing=!1)},delete:function(stopHere){delete state.parent.node[state.key],stopHere&&(keepGoing=!1)},remove:function(stopHere){isArray(state.parent.node)?state.parent.node.splice(state.key,1):delete state.parent.node[state.key],stopHere&&(keepGoing=!1)},keys:null,before:function(f){modifiers.before=f},after:function(f){modifiers.after=f},pre:function(f){modifiers.pre=f},post:function(f){modifiers.post=f},stop:function(){alive=!1},block:function(){keepGoing=!1}};if(!alive)return state;updateState();var ret=cb.call(state,state.node);return void 0!==ret&&state.update&&state.update(ret),modifiers.before&&modifiers.before.call(state,state.node),keepGoing?("object"!=typeof state.node||null===state.node||state.circular||(parents.push(state),updateState(),forEach(state.keys,function(key,i){path.push(key),modifiers.pre&&modifiers.pre.call(state,state.node[key],key);var child=walker(state.node[key]);immutable&&hasOwnProperty.call(state.node,key)&&(state.node[key]=child.node),child.isLast=i==state.keys.length-1,child.isFirst=0==i,modifiers.post&&modifiers.post.call(state,child),path.pop()}),parents.pop()),modifiers.after&&modifiers.after.call(state,state.node),state):state}(root).node}function copy(src){if("object"==typeof src&&null!==src){var dst;if(isArray(src))dst=[];else if(isDate(src))dst=new Date(src.getTime?src.getTime():src);else if(isRegExp(src))dst=new RegExp(src);else if(isError(src))dst={message:src.message};else if(isBoolean(src))dst=new Boolean(src);else if(isNumber(src))dst=new Number(src);else if(isString(src))dst=new String(src);else if(Object.create&&Object.getPrototypeOf)dst=Object.create(Object.getPrototypeOf(src));else if(src.constructor===Object)dst={};else{var proto=src.constructor&&src.constructor.prototype||src.__proto__||{},T=function(){};T.prototype=proto,dst=new T}return forEach(objectKeys(src),function(key){dst[key]=src[key]}),dst}return src}function toS(obj){return Object.prototype.toString.call(obj)}function isDate(obj){return"[object Date]"===toS(obj)}function isRegExp(obj){return"[object RegExp]"===toS(obj)}function isError(obj){return"[object Error]"===toS(obj)}function isBoolean(obj){return"[object Boolean]"===toS(obj)}function isNumber(obj){return"[object Number]"===toS(obj)}function isString(obj){return"[object String]"===toS(obj)}var traverse=module.exports=function(obj){return new Traverse(obj)};Traverse.prototype.get=function(ps){for(var node=this.value,i=0;i<ps.length;i++){var key=ps[i];if(!node||!hasOwnProperty.call(node,key)){node=void 0;break}node=node[key]}return node},Traverse.prototype.has=function(ps){for(var node=this.value,i=0;i<ps.length;i++){var key=ps[i];if(!node||!hasOwnProperty.call(node,key))return!1;node=node[key]}return!0},Traverse.prototype.set=function(ps,value){for(var node=this.value,i=0;i<ps.length-1;i++){var key=ps[i];hasOwnProperty.call(node,key)||(node[key]={}),node=node[key]}return node[ps[i]]=value,value},Traverse.prototype.map=function(cb){return walk(this.value,cb,!0)},Traverse.prototype.forEach=function(cb){return this.value=walk(this.value,cb,!1),this.value},Traverse.prototype.reduce=function(cb,init){var skip=1===arguments.length,acc=skip?this.value:init;return this.forEach(function(x){this.isRoot&&skip||(acc=cb.call(this,acc,x))}),acc},Traverse.prototype.paths=function(){var acc=[];return this.forEach(function(x){acc.push(this.path)}),acc},Traverse.prototype.nodes=function(){var acc=[];return this.forEach(function(x){acc.push(this.node)}),acc},Traverse.prototype.clone=function(){var parents=[],nodes=[];return function clone(src){for(var i=0;i<parents.length;i++)if(parents[i]===src)return nodes[i];if("object"==typeof src&&null!==src){var dst=copy(src);return parents.push(src),nodes.push(dst),forEach(objectKeys(src),function(key){dst[key]=clone(src[key])}),parents.pop(),nodes.pop(),dst}return src}(this.value)};var objectKeys=Object.keys||function(obj){var res=[];for(var key in obj)res.push(key);return res},isArray=Array.isArray||function(xs){return"[object Array]"===Object.prototype.toString.call(xs)},forEach=function(xs,fn){if(xs.forEach)return xs.forEach(fn);for(var i=0;i<xs.length;i++)fn(xs[i],i,xs)};forEach(objectKeys(Traverse.prototype),function(key){traverse[key]=function(obj){var args=[].slice.call(arguments,1),t=new Traverse(obj);return t[key].apply(t,args)}});var hasOwnProperty=Object.hasOwnProperty||function(obj,key){return key in obj}},function(module,exports){module.exports={"core/src/components/Alert/Alert.jsx":[{description:"",methods:[{name:"heading",docblock:null,modifiers:[],params:[],returns:null}],props:{children:{type:{name:"node"},required:!0,description:""},heading:{type:{name:"string"},required:!1,description:""},role:{type:{name:"enum",value:[{value:"'alert'",computed:!1},{value:"'alertdialog'",computed:!1}]},required:!1,description:"<p>ARIA <code>role</code></p>\n"},variation:{type:{name:"enum",value:[{value:"'error'",computed:!1},{value:"'warn'",computed:!1},{value:"'success'",computed:!1}]},required:!1,description:""}}}],"core/src/components/Badge/Badge.jsx":[{description:"",methods:[],props:{children:{type:{name:"union",value:[{name:"node"},{name:"string"}]},required:!0,description:"<p>In most cases this will be the badge&#39;s label, but you could also use this\nto nest more advanced JSX.</p>\n"}}}],"core/src/components/Button/Button.jsx":[{description:"<p>The <code>Button</code> component accepts its text as children (AKA inner HTML), which\nmeans you can also pass in HTML or custom components. This gives you a lot of\nflexibility and supports a variety of advanced use cases. The most common use\ncase would be passing in an SVG icon along with the text.</p>\n<p>In addition to the supported props listed, you can also pass in additional\nprops, which will be passed to the rendered root component. For example,\nyou could pass in a <code>target</code> prop to pass to the rendered anchor element.</p>\n",methods:[{name:"attrs",docblock:null,modifiers:[],params:[],returns:null},{name:"classNames",docblock:null,modifiers:[],params:[],returns:null},{name:"handleClick",docblock:null,modifiers:[],params:[{name:"e",type:null}],returns:null}],props:{children:{type:{name:"node"},required:!0,description:""},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root button element.\nUseful for adding utility classes.</p>\n"},component:{type:{name:"union",value:[{name:"element"},{name:"func"}]},required:!1,description:"<p>When provided, this will render the passed in component. This is useful when\nintegrating with React Router&#39;s <code>&lt;Link&gt;</code> or using your own custom component.</p>\n"},disabled:{type:{name:"bool"},required:!1,description:""},href:{type:{name:"string"},required:!1,description:"<p>When provided the root component will render as an <code>&lt;a&gt;</code> element\nrather than <code>button</code>.</p>\n"},inverse:{type:{name:"bool"},required:!1,description:"<p>Applies the inverse theme styling</p>\n"},onClick:{type:{name:"func"},required:!1,description:'<p>Returns the <a href="https://facebook.github.io/react/docs/events.html"><code>SyntheticEvent</code></a>.\nNot called when the button is disabled.</p>\n'},size:{type:{name:"enum",value:[{value:"'small'",computed:!1},{value:"'big'",computed:!1}]},required:!1,description:""},type:{type:{name:"enum",value:[{value:"'button'",computed:!1},{value:"'submit'",computed:!1}]},required:!1,description:'<p>Button <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type"><code>type</code></a> attribute</p>\n',defaultValue:{value:"'button'",computed:!1}},variation:{type:{name:"enum",value:[{value:"'primary'",computed:!1},{value:"'danger'",computed:!1},{value:"'success'",computed:!1},{value:"'transparent'",computed:!1}]},required:!1,description:""}}}],"core/src/components/ChoiceList/Choice.jsx":[{description:"<p>A <code>Choice</code> component can be used to render a checkbox or radio button.\nAny <em>undocumented</em> props that you pass to this component will be passed\nto the <code>input</code> element, so you can use this to set additional attributes if\nnecessary.</p>\n",methods:[],props:{children:{type:{name:"node"},required:!0,description:"<p>Label text or HTML.</p>\n"},checked:{type:{name:"bool"},required:!1,description:"<p>Setting this prop will render a read-only field and require an <code>onChange</code>\nevent handler if you&#39;d want to check its checked stated. Use <code>defaultChecked</code>\nif you want the field to be mutable.</p>\n"},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root <code>div</code> element.</p>\n"},defaultChecked:{type:{name:"bool"},required:!1,description:"<p>Sets the initial checked state and allows the user to check/uncheck the\nfield without also requiring an <code>onChange</code> event handler.</p>\n"},id:{type:{name:"string"},required:!1,description:"<p>A unique ID to be used for the input field, as well as the label&#39;s\n<code>for</code> attribute. A unique ID will be generated if one isn&#39;t provided.</p>\n"},inversed:{type:{name:"bool"},required:!1,description:"<p>Applies the &quot;inverse&quot; UI theme</p>\n"},name:{type:{name:"string"},required:!0,description:"<p>The <code>input</code> <code>name</code> attribute</p>\n"},onBlur:{type:{name:"func"},required:!1,description:""},onChange:{type:{name:"func"},required:!1,description:""},type:{type:{name:"enum",value:[{value:"'checkbox'",computed:!1},{value:"'radio'",computed:!1}]},required:!1,description:"",defaultValue:{value:"'checkbox'",computed:!1}},value:{type:{name:"union",value:[{name:"number"},{name:"string"}]},required:!0,description:"<p>The <code>input</code> <code>value</code> attribute</p>\n"}}}],"core/src/components/ChoiceList/ChoiceList.jsx":[{description:"<p>A <code>ChoiceList</code> component can be used to render a <code>select</code> menu, radio\nbutton group, or checkbox group, and their corresponding <code>label</code> or <code>legend</code>.</p>\n<p>You can manually pass in the <code>type</code> prop, but the real power of this component\nis unleashed when you let it determine the type of fields for you. It takes\ninto account accessibility and usability best practices, so you can pass in\nan array of choices and let it determine whether the choices should be\npresented as radio buttons, checkboxes, or a <code>select</code> menu.</p>\n",methods:[{name:"field",docblock:"Creates the field component(s) based on the type of field we've determined\nit should be.",modifiers:[],params:[],returns:null,description:"Creates the field component(s) based on the type of field we've determined\nit should be."},{name:"id",docblock:"If this is a <select> element, then we need to generate the ID here\nso it can be shared between the FormLabel and Select component",modifiers:[],params:[],returns:null,description:"If this is a <select> element, then we need to generate the ID here\nso it can be shared between the FormLabel and Select component"},{name:"select",docblock:"@param {object} selectProps\n@param {array} options - <option> components",modifiers:[],params:[{name:"selectProps",description:null,type:{name:"object"}},{name:"options",description:"<option> components",type:{name:"array"}}],returns:null,description:null},{name:"type",docblock:"Determines the type of field(s) we should render based on a few factors",modifiers:[],params:[],returns:null,description:"Determines the type of field(s) we should render based on a few factors"}],props:{choices:{type:{name:"arrayOf",value:{name:"shape",value:{checked:{name:"custom",raw:"Choice.propTypes.checked",required:!1},defaultChecked:{name:"custom",raw:"Choice.propTypes.defaultChecked",required:!1},disabled:{name:"custom",raw:"Choice.propTypes.disabled",required:!1},label:{name:"custom",raw:"Choice.propTypes.children",required:!1},value:{name:"custom",raw:"Choice.propTypes.value",required:!1}}}},required:!0,description:"<p>The list of choices to be rendered. The number of choices you pass in may\naffect the type of field(s) rendered. See <code>type</code> for more info.</p>\n"},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root element.</p>\n"},disabled:{type:{name:"bool"},required:!1,description:"<p>Disables the entire field.</p>\n"},errorMessage:{type:{name:"string"},required:!1,description:""},hint:{type:{name:"node"},required:!1,description:"<p>Hint text</p>\n"},inversed:{type:{name:"bool"},required:!1,description:"<p>Applies the &quot;inverse&quot; UI theme</p>\n"},label:{type:{name:"node"},required:!0,description:"<p>The label for the entire list of choices</p>\n"},labelClassName:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the <code>FormLabel</code>.</p>\n"},multiple:{type:{name:"bool"},required:!1,description:"<p>Allows the user to select multiple choices. Setting this to <code>true</code> results\nin a list of checkbox fields to be rendered.</p>\n"},name:{type:{name:"string"},required:!0,description:""},onBlur:{type:{name:"func"},required:!1,description:""},onChange:{type:{name:"func"},required:!1,description:""},type:{type:{name:"enum",value:[{value:"'checkbox'",computed:!1},{value:"'radio'",computed:!1},{value:"'select'",computed:!1}]},required:!1,description:"<p>You can manually set the <code>type</code> if you prefer things to be less magical.\nOtherwise, the type will be inferred by the other <code>props</code>, based\non what&#39;s best for accessibility and usability. If <code>multiple</code> is <code>true</code>, then\n<code>checkbox</code> fields will be rendered. If less than 10 choices are passed in,\nthen <code>radio</code> buttons will be rendered.</p>\n"}}}],"core/src/components/ChoiceList/Select.jsx":[{description:"<p>A <code>Select</code> component can be used to render an HTML <code>select</code> menu.\nAny <em>undocumented</em> props that you pass to this component will be passed\nto the <code>select</code> element, so you can use this to set additional attributes if\nnecessary.</p>\n",methods:[],props:{children:{type:{name:"node"},required:!0,description:""},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root <code>select</code> element.</p>\n"},defaultValue:{type:{name:"string"},required:!1,description:"<p>Sets the initial <code>selected</code> state and allows the user to select a different\noption without also requiring an <code>onChange</code> event handler.</p>\n"},disabled:{type:{name:"bool"},required:!1,description:""},id:{type:{name:"string"},required:!1,description:"<p>A unique ID to be used for the select field. A unique ID will be generated\nif one isn&#39;t provided.</p>\n"},inversed:{type:{name:"bool"},required:!1,description:"<p>Applies the &quot;inverse&quot; UI theme</p>\n"},multiple:{type:{name:"custom",raw:"function(props, propName, componentName) {\n  if (props[propName]) {\n    return new Error(\n      `'${propName}' supplied to '${componentName}'. [A11Y]: Users often don’t` +\n      ` understand how to select multiple items from dropdowns. Use checkboxes instead.`\n    );\n  }\n}"},required:!1,description:"<p>Setting this prop to <code>true</code> will result in an error message due to\naccessibility concerns. See the usability guidelines for more info.</p>\n"},name:{type:{name:"string"},required:!0,description:""},onBlur:{type:{name:"func"},required:!1,description:""},onChange:{type:{name:"func"},required:!1,description:""},value:{type:{name:"string"},required:!1,description:"<p>Setting this prop will render a read-only field and require an <code>onChange</code>\nevent handler if you&#39;d want to change its <code>selected</code> stated. Use\n<code>defaultValue</code> if you want the field to be mutable.</p>\n"}}}],"core/src/components/FormLabel/FormLabel.jsx":[{description:"<p>The FormLabel component provides the label/legend for a field, along with any\nassociated hint text and error messaging.</p>\n<p>TODO(sawyer): Show this in the documentation</p>\n",methods:[{name:"errorMessage",docblock:null,modifiers:[],params:[],returns:null},{name:"hint",docblock:null,modifiers:[],params:[],returns:null}],props:{children:{type:{name:"node"},required:!0,description:""},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root element.</p>\n"},component:{type:{name:"enum",value:[{value:"'label'",computed:!1},{value:"'legend'",computed:!1}]},required:!1,description:"<p>The root HTML element used to render the label</p>\n",defaultValue:{value:"'label'",computed:!1}},errorMessage:{type:{name:"string"},required:!1,description:"<p>Enable the error state by providing an error message.</p>\n"},fieldId:{type:{name:"string"},required:!1,description:"<p>The ID of the field this label is for. This is used for the label&#39;s <code>for</code>\nattribute and any related ARIA attributes, such as for the error message.</p>\n"},hint:{type:{name:"node"},required:!1,description:"<p>Hint text</p>\n"},inversed:{type:{name:"bool"},required:!1,description:"<p>Set to <code>true</code> to apply the &quot;inverse&quot; theme</p>\n"}}}],"core/src/components/Tabs/Tab.jsx":[{description:"",methods:[{name:"handleClick",docblock:null,modifiers:[],params:[{name:"evt",type:null}],returns:null}],props:{children:{type:{name:"node"},required:!0,description:""},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root tab element.</p>\n"},id:{type:{name:"string"},required:!0,description:"<p>A unique <code>id</code>, to be used on the rendered tab element.</p>\n"},href:{type:{name:"string"},required:!1,description:"<p>You can optionally set the <code>href</code> attribute used for the tab. This can be\nuseful if you want to use relative links rather than a URL hash (the default)</p>\n"},onClick:{type:{name:"func"},required:!1,description:'<p>Called when the tab is clicked, with the following arguments:\n<a href="https://facebook.github.io/react/docs/events.html"><code>SyntheticEvent</code></a>,\n<code>id</code>, <code>panelId</code></p>\n'},panelId:{type:{name:"string"},required:!0,description:"<p>The <code>id</code> of the associated <code>TabPanel</code>. Used for the <code>aria-controls</code> attribute</p>\n"},selected:{type:{name:"bool"},required:!1,description:"",defaultValue:{value:"false",computed:!1}}}}],"core/src/components/Tabs/TabPanel.jsx":[{description:"",methods:[],props:{children:{type:{name:"node"},required:!0,description:""},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root element.</p>\n"},id:{type:{name:"string"},required:!0,description:"<p>A unique <code>id</code>, to be used on the rendered panel element.</p>\n"},selected:{type:{name:"bool"},required:!1,description:"",defaultValue:{value:"false",computed:!1}},tab:{type:{name:"string"},required:!1,description:"<p>The associated tab&#39;s label. Only applicable when the panel is a\nchild of <code>Tabs</code>.</p>\n"},tabClassName:{type:{name:"string"},required:!1,description:"<p>Additional classes for the associated tab. Only applicable when the panel\nis a child of <code>Tabs</code>.</p>\n"},tabHref:{type:{name:"string"},required:!1,description:"<p>The associated tab&#39;s <code>href</code>. Only applicable when the panel is a\nchild of <code>Tabs</code>.</p>\n"},tabId:{type:{name:"string"},required:!1,description:"<p>The <code>id</code> of the associated <code>Tab</code>. Used for the <code>aria-labelledby</code> attribute</p>\n"}}}],"core/src/components/Tabs/Tabs.jsx":[{description:"<p>A container component that manages the state of your tabs for you. For most\ncases, you&#39;ll want to use this component rather than the presentational\ncomponents (<code>Tab</code>, <code>TabPanel</code>) on their own.</p>\n",methods:[{name:"handleTabClick",docblock:null,modifiers:[],params:[{name:"evt",type:null},{name:"panelId",type:null},{name:"tabId",type:null},{name:"href",type:null}],returns:null},{name:"panelChildren",docblock:null,modifiers:[],params:[],returns:null},{name:"renderChildren",docblock:null,modifiers:[],params:[],returns:null},{name:"renderTabs",docblock:null,modifiers:[],params:[],returns:null},{name:"replaceState",docblock:"Update the URL in the browser without adding a new entry to the history.\n@param {String} url - Absolute or relative URL",modifiers:[],params:[{name:"url",description:"Absolute or relative URL",type:{name:"String"}}],returns:null,description:"Update the URL in the browser without adding a new entry to the history."}],props:{children:{type:{name:"node"},required:!0,description:""},defaultSelectedId:{type:{name:"string"},required:!1,description:"<p>Default selected <code>TabPanel</code>&#39;s <code>id</code>. If this isn&#39;t set, the first <code>TabPanel</code>\nwill be selected.</p>\n"},onChange:{type:{name:"func"},required:!1,description:"<p>A callback function that&#39;s invoked when the selected tab is changed.\n<code>(selectedId, prevSelectedId) =&gt; void</code></p>\n"},tablistClassName:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the component wrapping the tabs</p>\n"}}}],"core/src/components/TextField/TextField.jsx":[{description:"<p>The <code>TextField</code> component affords a user to type text into a form.\nBy default it renders a field for capturing a single line of text,\nbut can be configured to support multiline text.</p>\n",methods:[],props:{className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root element</p>\n"},defaultValue:{type:{name:"string"},required:!1,description:"<p>Default value of the text field, if any. Use this for an uncontrolled\ncomponent; otherwise, use the <code>value</code> property</p>\n"},disabled:{type:{name:"bool"},required:!1,description:""},errorMessage:{type:{name:"string"},required:!1,description:""},fieldClassName:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the field element</p>\n"},hint:{type:{name:"node"},required:!1,description:"<p>Hint text</p>\n"},inversed:{type:{name:"bool"},required:!1,description:"<p>Applies the &quot;inverse&quot; UI theme</p>\n"},label:{type:{name:"node"},required:!0,description:"<p>The label for the entire list of choices</p>\n"},labelClassName:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the <code>FormLabel</code></p>\n"},multiline:{type:{name:"bool"},required:!1,description:"<p>Whether or not the textfield is a multiline textfield</p>\n"},name:{type:{name:"string"},required:!0,description:""},onBlur:{type:{name:"func"},required:!1,description:""},onChange:{type:{name:"func"},required:!1,description:""},rows:{type:{name:"union",value:[{name:"number"},{name:"string"}]},required:!1,description:"<p>Optionally specify the number of visible text lines for the control. Only\napplicable if this is a multiline field</p>\n"},type:{type:{name:"string"},required:!1,description:'<p>Any valid <code>input</code> <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input">type</a>.</p>\n',defaultValue:{value:"'text'",computed:!1}},value:{type:{name:"string"},required:!1,description:"<p>Current value of the text field. Use this for a controlled component where\nyou are maintaining its current state; otherwise, use the <code>defaultValue</code> property</p>\n"}}}],"core/src/components/VerticalNav/VerticalNav.jsx":[{description:"<p>The <code>VerticalNav</code> React component accepts list items as a JSON object and\nincludes additional functionality like collapsible nested menus.</p>\n",methods:[{name:"renderItems",docblock:null,modifiers:[],params:[],returns:null}],props:{className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root element</p>\n"},collapsed:{type:{name:"bool"},required:!1,description:"<p>Whether or not the menu is in a collapsed state</p>\n",defaultValue:{value:"false",computed:!1}},selectedId:{type:{name:"string"},required:!1,description:"<p>The <code>id</code> of the selected <code>VerticalNavItem</code>. This will also set the\n<code>selected</code> prop on the item&#39;s parents.</p>\n"},id:{type:{name:"string"},required:!1,description:""},items:{type:{name:"arrayOf",value:{name:"object"}},required:!0,description:"<p>An array of <code>VerticalNavItem</code> data objects</p>\n"},nested:{type:{name:"bool"},required:!1,description:"<p>Indicates this list is nested within another nav item.</p>\n"},onLinkClick:{type:{name:"func"},required:!1,description:'<p>Called when one of the nav links is clicked, with the following arguments:\n<a href="https://facebook.github.io/react/docs/events.html"><code>SyntheticEvent</code></a>,\n<code>id</code>, <code>url</code></p>\n'}}}],"core/src/components/VerticalNav/VerticalNavItem.jsx":[{description:"",methods:[{name:"handleLinkClick",docblock:null,modifiers:[],params:[{name:"evt",type:null}],returns:null},{name:"handleToggleClick",docblock:null,modifiers:[],params:[],returns:null},{name:"hasSubnav",docblock:null,modifiers:[],params:[],returns:null},{name:"isSelected",docblock:"Check if this item is selected or if it is a parent of a selected item",modifiers:[],params:[],returns:null,description:"Check if this item is selected or if it is a parent of a selected item"},{name:"childIsSelected",docblock:"Checks if a descendant is selected\n@param {Array} children - The nested items",modifiers:[],params:[{name:"children",description:"The nested items",type:{name:"Array"}}],returns:null,description:"Checks if a descendant is selected"},{name:"renderSubnavToggle",docblock:null,modifiers:[],params:[],returns:null},{name:"renderSubnav",docblock:null,modifiers:[],params:[],returns:null}],props:{_selectedId:{type:{name:"string"},required:!1,description:""},ariaCollapsedStateButtonLabel:{type:{name:"string"},required:!1,description:"<p>Aria label for the toggle button when the sub-navigation is collapsed</p>\n",defaultValue:{value:"'Expand sub-navigation'",computed:!1}},ariaExpandedStateButtonLabel:{type:{name:"string"},required:!1,description:"<p>Aria label for the toggle button when the sub-navigation is expanded</p>\n",defaultValue:{value:"'Collapse sub-navigation'",computed:!1}},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root element</p>\n"},defaultCollapsed:{type:{name:"bool"},required:!1,description:"<p>Whether or not the item&#39;s sub-navigation is in a collapsed state by default</p>\n",defaultValue:{value:"false",computed:!1}},onClick:{type:{name:"func"},required:!1,description:'<p>Called when the item is clicked, with the following arguments:\n<a href="https://facebook.github.io/react/docs/events.html"><code>SyntheticEvent</code></a>,\n<code>id</code>, <code>url</code>.</p>\n<p>This takes precedence over the <code>VerticalNav</code> <code>onLinkClick</code> prop</p>\n'},onSubnavToggle:{type:{name:"func"},required:!1,description:"<p>Called when this item&#39;s subnav is collapsed or expanded, with the\nfollowing arguments: <code>id</code>, <code>collapsed</code></p>\n"},id:{type:{name:"string"},required:!1,description:"<p>Optional identifier. This can be handy if you&#39;re passing in an\n<code>onClick</code> handler. A unique ID will be generated if one isn&#39;t provided.</p>\n"},items:{type:{name:"arrayOf",value:{name:"shape",value:"VerticalNavItem.propTypes",computed:!0}},required:!1,description:"<p>An array of nested <code>VerticalNavItem</code> data objects to be rendered in a\nsub-navigation list.</p>\n"},label:{type:{name:"node"},required:!0,description:"<p>Text to render for this nav item</p>\n"},url:{type:{name:"string"},required:!1,description:"<p>A URL to navigate to if this item is a link</p>\n"},selected:{type:{name:"bool"},required:!1,description:"<p>If this item is currently selected</p>\n"}}}]}},function(module,exports,__webpack_require__){module.exports=__webpack_require__(129)}]);
\ No newline at end of file
+module.exports=function(val){return null!=val&&"object"==typeof val&&!Array.isArray(val)}},function(module,exports){function baseClamp(number,lower,upper){return number===number&&(void 0!==upper&&(number=number<=upper?number:upper),void 0!==lower&&(number=number>=lower?number:lower)),number}module.exports=baseClamp},function(module,exports,__webpack_require__){function baseFill(array,value,start,end){var length=array.length;for(start=toInteger(start),start<0&&(start=-start>length?0:length+start),end=void 0===end||end>length?length:toInteger(end),end<0&&(end+=length),end=start>end?0:toLength(end);start<end;)array[start++]=value;return array}var toInteger=__webpack_require__(98),toLength=__webpack_require__(222);module.exports=baseFill},function(module,exports,__webpack_require__){(function(global){var freeGlobal="object"==typeof global&&global&&global.Object===Object&&global;module.exports=freeGlobal}).call(exports,__webpack_require__(46))},function(module,exports,__webpack_require__){function getRawTag(value){var isOwn=hasOwnProperty.call(value,symToStringTag),tag=value[symToStringTag];try{value[symToStringTag]=void 0;var unmasked=!0}catch(e){}var result=nativeObjectToString.call(value);return unmasked&&(isOwn?value[symToStringTag]=tag:delete value[symToStringTag]),result}var Symbol=__webpack_require__(96),objectProto=Object.prototype,hasOwnProperty=objectProto.hasOwnProperty,nativeObjectToString=objectProto.toString,symToStringTag=Symbol?Symbol.toStringTag:void 0;module.exports=getRawTag},function(module,exports){function isIndex(value,length){return!!(length=null==length?MAX_SAFE_INTEGER:length)&&("number"==typeof value||reIsUint.test(value))&&value>-1&&value%1==0&&value<length}var MAX_SAFE_INTEGER=9007199254740991,reIsUint=/^(?:0|[1-9]\d*)$/;module.exports=isIndex},function(module,exports,__webpack_require__){function isIterateeCall(value,index,object){if(!isObject(object))return!1;var type=typeof index;return!!("number"==type?isArrayLike(object)&&isIndex(index,object.length):"string"==type&&index in object)&&eq(object[index],value)}var eq=__webpack_require__(214),isArrayLike=__webpack_require__(216),isIndex=__webpack_require__(210),isObject=__webpack_require__(52);module.exports=isIterateeCall},function(module,exports){function objectToString(value){return nativeObjectToString.call(value)}var objectProto=Object.prototype,nativeObjectToString=objectProto.toString;module.exports=objectToString},function(module,exports,__webpack_require__){var freeGlobal=__webpack_require__(208),freeSelf="object"==typeof self&&self&&self.Object===Object&&self,root=freeGlobal||freeSelf||Function("return this")();module.exports=root},function(module,exports){function eq(value,other){return value===other||value!==value&&other!==other}module.exports=eq},function(module,exports,__webpack_require__){function fill(array,value,start,end){var length=null==array?0:array.length;return length?(start&&"number"!=typeof start&&isIterateeCall(array,value,start)&&(start=0,end=length),baseFill(array,value,start,end)):[]}var baseFill=__webpack_require__(207),isIterateeCall=__webpack_require__(211);module.exports=fill},function(module,exports,__webpack_require__){function isArrayLike(value){return null!=value&&isLength(value.length)&&!isFunction(value)}var isFunction=__webpack_require__(217),isLength=__webpack_require__(218);module.exports=isArrayLike},function(module,exports,__webpack_require__){function isFunction(value){if(!isObject(value))return!1;var tag=baseGetTag(value);return tag==funcTag||tag==genTag||tag==asyncTag||tag==proxyTag}var baseGetTag=__webpack_require__(97),isObject=__webpack_require__(52),asyncTag="[object AsyncFunction]",funcTag="[object Function]",genTag="[object GeneratorFunction]",proxyTag="[object Proxy]";module.exports=isFunction},function(module,exports){function isLength(value){return"number"==typeof value&&value>-1&&value%1==0&&value<=MAX_SAFE_INTEGER}var MAX_SAFE_INTEGER=9007199254740991;module.exports=isLength},function(module,exports){function isObjectLike(value){return null!=value&&"object"==typeof value}module.exports=isObjectLike},function(module,exports,__webpack_require__){function isSymbol(value){return"symbol"==typeof value||isObjectLike(value)&&baseGetTag(value)==symbolTag}var baseGetTag=__webpack_require__(97),isObjectLike=__webpack_require__(219),symbolTag="[object Symbol]";module.exports=isSymbol},function(module,exports,__webpack_require__){function toFinite(value){if(!value)return 0===value?value:0;if((value=toNumber(value))===INFINITY||value===-INFINITY){return(value<0?-1:1)*MAX_INTEGER}return value===value?value:0}var toNumber=__webpack_require__(223),INFINITY=1/0,MAX_INTEGER=1.7976931348623157e308;module.exports=toFinite},function(module,exports,__webpack_require__){function toLength(value){return value?baseClamp(toInteger(value),0,MAX_ARRAY_LENGTH):0}var baseClamp=__webpack_require__(206),toInteger=__webpack_require__(98),MAX_ARRAY_LENGTH=4294967295;module.exports=toLength},function(module,exports,__webpack_require__){function toNumber(value){if("number"==typeof value)return value;if(isSymbol(value))return NAN;if(isObject(value)){var other="function"==typeof value.valueOf?value.valueOf():value;value=isObject(other)?other+"":other}if("string"!=typeof value)return 0===value?value:+value;value=value.replace(reTrim,"");var isBinary=reIsBinary.test(value);return isBinary||reIsOctal.test(value)?freeParseInt(value.slice(2),isBinary?2:8):reIsBadHex.test(value)?NAN:+value}var isObject=__webpack_require__(52),isSymbol=__webpack_require__(220),NAN=NaN,reTrim=/^\s+|\s+$/g,reIsBadHex=/^[-+]0x[0-9a-f]+$/i,reIsBinary=/^0b[01]+$/i,reIsOctal=/^0o[0-7]+$/i,freeParseInt=parseInt;module.exports=toNumber},function(module,exports){!function(Prism){var javascript=Prism.util.clone(Prism.languages.javascript);Prism.languages.jsx=Prism.languages.extend("markup",javascript),Prism.languages.jsx.tag.pattern=/<\/?[\w\.:-]+\s*(?:\s+[\w\.:-]+(?:=(?:("|')(\\?[\w\W])*?\1|[^\s'">=]+|(\{[\w\W]*?\})))?\s*)*\/?>/i,Prism.languages.jsx.tag.inside["attr-value"].pattern=/=[^\{](?:('|")[\w\W]*?(\1)|[^\s>]+)/i;var jsxExpression=Prism.util.clone(Prism.languages.jsx);delete jsxExpression.punctuation,jsxExpression=Prism.languages.insertBefore("jsx","operator",{punctuation:/=(?={)|[{}[\];(),.:]/},{jsx:jsxExpression}),Prism.languages.insertBefore("inside","attr-value",{script:{pattern:/=(\{(?:\{[^}]*\}|[^}])+\})/i,inside:jsxExpression,alias:"language-javascript"}},Prism.languages.jsx.tag)}(Prism)},function(module,exports,__webpack_require__){"use strict";(function(process){function checkPropTypes(typeSpecs,values,location,componentName,getStack){if("production"!==process.env.NODE_ENV)for(var typeSpecName in typeSpecs)if(typeSpecs.hasOwnProperty(typeSpecName)){var error;try{invariant("function"==typeof typeSpecs[typeSpecName],"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",componentName||"React class",location,typeSpecName),error=typeSpecs[typeSpecName](values,typeSpecName,componentName,location,null,ReactPropTypesSecret)}catch(ex){error=ex}if(warning(!error||error instanceof Error,"%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",componentName||"React class",location,typeSpecName,typeof error),error instanceof Error&&!(error.message in loggedTypeFailures)){loggedTypeFailures[error.message]=!0;var stack=getStack?getStack():"";warning(!1,"Failed %s type: %s%s",location,error.message,null!=stack?stack:"")}}}if("production"!==process.env.NODE_ENV)var invariant=__webpack_require__(1),warning=__webpack_require__(2),ReactPropTypesSecret=__webpack_require__(53),loggedTypeFailures={};module.exports=checkPropTypes}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var emptyFunction=__webpack_require__(12),invariant=__webpack_require__(1),ReactPropTypesSecret=__webpack_require__(53);module.exports=function(){function shim(props,propName,componentName,location,propFullName,secret){secret!==ReactPropTypesSecret&&invariant(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function getShim(){return shim}shim.isRequired=shim;var ReactPropTypes={array:shim,bool:shim,func:shim,number:shim,object:shim,string:shim,symbol:shim,any:shim,arrayOf:getShim,element:shim,instanceOf:getShim,node:shim,objectOf:getShim,oneOf:getShim,oneOfType:getShim,shape:getShim};return ReactPropTypes.checkPropTypes=emptyFunction,ReactPropTypes.PropTypes=ReactPropTypes,ReactPropTypes}},function(module,exports,__webpack_require__){"use strict";module.exports=__webpack_require__(241)},function(module,exports,__webpack_require__){"use strict";var ARIADOMPropertyConfig={Properties:{"aria-current":0,"aria-details":0,"aria-disabled":0,"aria-hidden":0,"aria-invalid":0,"aria-keyshortcuts":0,"aria-label":0,"aria-roledescription":0,"aria-autocomplete":0,"aria-checked":0,"aria-expanded":0,"aria-haspopup":0,"aria-level":0,"aria-modal":0,"aria-multiline":0,"aria-multiselectable":0,"aria-orientation":0,"aria-placeholder":0,"aria-pressed":0,"aria-readonly":0,"aria-required":0,"aria-selected":0,"aria-sort":0,"aria-valuemax":0,"aria-valuemin":0,"aria-valuenow":0,"aria-valuetext":0,"aria-atomic":0,"aria-busy":0,"aria-live":0,"aria-relevant":0,"aria-dropeffect":0,"aria-grabbed":0,"aria-activedescendant":0,"aria-colcount":0,"aria-colindex":0,"aria-colspan":0,"aria-controls":0,"aria-describedby":0,"aria-errormessage":0,"aria-flowto":0,"aria-labelledby":0,"aria-owns":0,"aria-posinset":0,"aria-rowcount":0,"aria-rowindex":0,"aria-rowspan":0,"aria-setsize":0},DOMAttributeNames:{},DOMPropertyNames:{}};module.exports=ARIADOMPropertyConfig},function(module,exports,__webpack_require__){"use strict";var ReactDOMComponentTree=__webpack_require__(8),focusNode=__webpack_require__(94),AutoFocusUtils={focusDOMComponent:function(){focusNode(ReactDOMComponentTree.getNodeFromInstance(this))}};module.exports=AutoFocusUtils},function(module,exports,__webpack_require__){"use strict";function isKeypressCommand(nativeEvent){return(nativeEvent.ctrlKey||nativeEvent.altKey||nativeEvent.metaKey)&&!(nativeEvent.ctrlKey&&nativeEvent.altKey)}function getCompositionEventType(topLevelType){switch(topLevelType){case"topCompositionStart":return eventTypes.compositionStart;case"topCompositionEnd":return eventTypes.compositionEnd;case"topCompositionUpdate":return eventTypes.compositionUpdate}}function isFallbackCompositionStart(topLevelType,nativeEvent){return"topKeyDown"===topLevelType&&nativeEvent.keyCode===START_KEYCODE}function isFallbackCompositionEnd(topLevelType,nativeEvent){switch(topLevelType){case"topKeyUp":return-1!==END_KEYCODES.indexOf(nativeEvent.keyCode);case"topKeyDown":return nativeEvent.keyCode!==START_KEYCODE;case"topKeyPress":case"topMouseDown":case"topBlur":return!0;default:return!1}}function getDataFromCustomEvent(nativeEvent){var detail=nativeEvent.detail;return"object"==typeof detail&&"data"in detail?detail.data:null}function extractCompositionEvent(topLevelType,targetInst,nativeEvent,nativeEventTarget){var eventType,fallbackData;if(canUseCompositionEvent?eventType=getCompositionEventType(topLevelType):currentComposition?isFallbackCompositionEnd(topLevelType,nativeEvent)&&(eventType=eventTypes.compositionEnd):isFallbackCompositionStart(topLevelType,nativeEvent)&&(eventType=eventTypes.compositionStart),!eventType)return null;useFallbackCompositionData&&(currentComposition||eventType!==eventTypes.compositionStart?eventType===eventTypes.compositionEnd&&currentComposition&&(fallbackData=currentComposition.getData()):currentComposition=FallbackCompositionState.getPooled(nativeEventTarget));var event=SyntheticCompositionEvent.getPooled(eventType,targetInst,nativeEvent,nativeEventTarget);if(fallbackData)event.data=fallbackData;else{var customData=getDataFromCustomEvent(nativeEvent);null!==customData&&(event.data=customData)}return EventPropagators.accumulateTwoPhaseDispatches(event),event}function getNativeBeforeInputChars(topLevelType,nativeEvent){switch(topLevelType){case"topCompositionEnd":return getDataFromCustomEvent(nativeEvent);case"topKeyPress":return nativeEvent.which!==SPACEBAR_CODE?null:(hasSpaceKeypress=!0,SPACEBAR_CHAR);case"topTextInput":var chars=nativeEvent.data;return chars===SPACEBAR_CHAR&&hasSpaceKeypress?null:chars;default:return null}}function getFallbackBeforeInputChars(topLevelType,nativeEvent){if(currentComposition){if("topCompositionEnd"===topLevelType||!canUseCompositionEvent&&isFallbackCompositionEnd(topLevelType,nativeEvent)){var chars=currentComposition.getData();return FallbackCompositionState.release(currentComposition),currentComposition=null,chars}return null}switch(topLevelType){case"topPaste":return null;case"topKeyPress":return nativeEvent.which&&!isKeypressCommand(nativeEvent)?String.fromCharCode(nativeEvent.which):null;case"topCompositionEnd":return useFallbackCompositionData?null:nativeEvent.data;default:return null}}function extractBeforeInputEvent(topLevelType,targetInst,nativeEvent,nativeEventTarget){var chars;if(!(chars=canUseTextInputEvent?getNativeBeforeInputChars(topLevelType,nativeEvent):getFallbackBeforeInputChars(topLevelType,nativeEvent)))return null;var event=SyntheticInputEvent.getPooled(eventTypes.beforeInput,targetInst,nativeEvent,nativeEventTarget);return event.data=chars,EventPropagators.accumulateTwoPhaseDispatches(event),event}var EventPropagators=__webpack_require__(31),ExecutionEnvironment=__webpack_require__(9),FallbackCompositionState=__webpack_require__(236),SyntheticCompositionEvent=__webpack_require__(279),SyntheticInputEvent=__webpack_require__(282),END_KEYCODES=[9,13,27,32],START_KEYCODE=229,canUseCompositionEvent=ExecutionEnvironment.canUseDOM&&"CompositionEvent"in window,documentMode=null;ExecutionEnvironment.canUseDOM&&"documentMode"in document&&(documentMode=document.documentMode);var canUseTextInputEvent=ExecutionEnvironment.canUseDOM&&"TextEvent"in window&&!documentMode&&!function(){var opera=window.opera;return"object"==typeof opera&&"function"==typeof opera.version&&parseInt(opera.version(),10)<=12}(),useFallbackCompositionData=ExecutionEnvironment.canUseDOM&&(!canUseCompositionEvent||documentMode&&documentMode>8&&documentMode<=11),SPACEBAR_CODE=32,SPACEBAR_CHAR=String.fromCharCode(SPACEBAR_CODE),eventTypes={beforeInput:{phasedRegistrationNames:{bubbled:"onBeforeInput",captured:"onBeforeInputCapture"},dependencies:["topCompositionEnd","topKeyPress","topTextInput","topPaste"]},compositionEnd:{phasedRegistrationNames:{bubbled:"onCompositionEnd",captured:"onCompositionEndCapture"},dependencies:["topBlur","topCompositionEnd","topKeyDown","topKeyPress","topKeyUp","topMouseDown"]},compositionStart:{phasedRegistrationNames:{bubbled:"onCompositionStart",captured:"onCompositionStartCapture"},dependencies:["topBlur","topCompositionStart","topKeyDown","topKeyPress","topKeyUp","topMouseDown"]},compositionUpdate:{phasedRegistrationNames:{bubbled:"onCompositionUpdate",captured:"onCompositionUpdateCapture"},dependencies:["topBlur","topCompositionUpdate","topKeyDown","topKeyPress","topKeyUp","topMouseDown"]}},hasSpaceKeypress=!1,currentComposition=null,BeforeInputEventPlugin={eventTypes:eventTypes,extractEvents:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){return[extractCompositionEvent(topLevelType,targetInst,nativeEvent,nativeEventTarget),extractBeforeInputEvent(topLevelType,targetInst,nativeEvent,nativeEventTarget)]}};module.exports=BeforeInputEventPlugin},function(module,exports,__webpack_require__){"use strict";(function(process){var CSSProperty=__webpack_require__(102),ExecutionEnvironment=__webpack_require__(9),ReactInstrumentation=__webpack_require__(14),camelizeStyleName=__webpack_require__(189),dangerousStyleValue=__webpack_require__(289),hyphenateStyleName=__webpack_require__(196),memoizeStringOnly=__webpack_require__(199),warning=__webpack_require__(2),processStyleName=memoizeStringOnly(function(styleName){return hyphenateStyleName(styleName)}),hasShorthandPropertyBug=!1,styleFloatAccessor="cssFloat";if(ExecutionEnvironment.canUseDOM){var tempStyle=document.createElement("div").style;try{tempStyle.font=""}catch(e){hasShorthandPropertyBug=!0}void 0===document.documentElement.style.cssFloat&&(styleFloatAccessor="styleFloat")}if("production"!==process.env.NODE_ENV)var badVendoredStyleNamePattern=/^(?:webkit|moz|o)[A-Z]/,badStyleValueWithSemicolonPattern=/;\s*$/,warnedStyleNames={},warnedStyleValues={},warnedForNaNValue=!1,warnHyphenatedStyleName=function(name,owner){warnedStyleNames.hasOwnProperty(name)&&warnedStyleNames[name]||(warnedStyleNames[name]=!0,"production"!==process.env.NODE_ENV&&warning(!1,"Unsupported style property %s. Did you mean %s?%s",name,camelizeStyleName(name),checkRenderMessage(owner)))},warnBadVendoredStyleName=function(name,owner){warnedStyleNames.hasOwnProperty(name)&&warnedStyleNames[name]||(warnedStyleNames[name]=!0,"production"!==process.env.NODE_ENV&&warning(!1,"Unsupported vendor-prefixed style property %s. Did you mean %s?%s",name,name.charAt(0).toUpperCase()+name.slice(1),checkRenderMessage(owner)))},warnStyleValueWithSemicolon=function(name,value,owner){warnedStyleValues.hasOwnProperty(value)&&warnedStyleValues[value]||(warnedStyleValues[value]=!0,"production"!==process.env.NODE_ENV&&warning(!1,'Style property values shouldn\'t contain a semicolon.%s Try "%s: %s" instead.',checkRenderMessage(owner),name,value.replace(badStyleValueWithSemicolonPattern,"")))},warnStyleValueIsNaN=function(name,value,owner){warnedForNaNValue||(warnedForNaNValue=!0,"production"!==process.env.NODE_ENV&&warning(!1,"`NaN` is an invalid value for the `%s` css style property.%s",name,checkRenderMessage(owner)))},checkRenderMessage=function(owner){if(owner){var name=owner.getName();if(name)return" Check the render method of `"+name+"`."}return""},warnValidStyle=function(name,value,component){var owner;component&&(owner=component._currentElement._owner),name.indexOf("-")>-1?warnHyphenatedStyleName(name,owner):badVendoredStyleNamePattern.test(name)?warnBadVendoredStyleName(name,owner):badStyleValueWithSemicolonPattern.test(value)&&warnStyleValueWithSemicolon(name,value,owner),"number"==typeof value&&isNaN(value)&&warnStyleValueIsNaN(name,0,owner)};var CSSPropertyOperations={createMarkupForStyles:function(styles,component){var serialized="";for(var styleName in styles)if(styles.hasOwnProperty(styleName)){var isCustomProperty=0===styleName.indexOf("--"),styleValue=styles[styleName];"production"!==process.env.NODE_ENV&&(isCustomProperty||warnValidStyle(styleName,styleValue,component)),null!=styleValue&&(serialized+=processStyleName(styleName)+":",serialized+=dangerousStyleValue(styleName,styleValue,component,isCustomProperty)+";")}return serialized||null},setValueForStyles:function(node,styles,component){"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onHostOperation({instanceID:component._debugID,type:"update styles",payload:styles});var style=node.style;for(var styleName in styles)if(styles.hasOwnProperty(styleName)){var isCustomProperty=0===styleName.indexOf("--");"production"!==process.env.NODE_ENV&&(isCustomProperty||warnValidStyle(styleName,styles[styleName],component));var styleValue=dangerousStyleValue(styleName,styles[styleName],component,isCustomProperty);if("float"!==styleName&&"cssFloat"!==styleName||(styleName=styleFloatAccessor),isCustomProperty)style.setProperty(styleName,styleValue);else if(styleValue)style[styleName]=styleValue;else{var expansion=hasShorthandPropertyBug&&CSSProperty.shorthandPropertyExpansions[styleName];if(expansion)for(var individualStyleName in expansion)style[individualStyleName]="";else style[styleName]=""}}}};module.exports=CSSPropertyOperations}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function createAndAccumulateChangeEvent(inst,nativeEvent,target){var event=SyntheticEvent.getPooled(eventTypes.change,inst,nativeEvent,target);return event.type="change",EventPropagators.accumulateTwoPhaseDispatches(event),event}function shouldUseChangeEvent(elem){var nodeName=elem.nodeName&&elem.nodeName.toLowerCase();return"select"===nodeName||"input"===nodeName&&"file"===elem.type}function manualDispatchChangeEvent(nativeEvent){var event=createAndAccumulateChangeEvent(activeElementInst,nativeEvent,getEventTarget(nativeEvent));ReactUpdates.batchedUpdates(runEventInBatch,event)}function runEventInBatch(event){EventPluginHub.enqueueEvents(event),EventPluginHub.processEventQueue(!1)}function startWatchingForChangeEventIE8(target,targetInst){activeElement=target,activeElementInst=targetInst,activeElement.attachEvent("onchange",manualDispatchChangeEvent)}function stopWatchingForChangeEventIE8(){activeElement&&(activeElement.detachEvent("onchange",manualDispatchChangeEvent),activeElement=null,activeElementInst=null)}function getInstIfValueChanged(targetInst,nativeEvent){var updated=inputValueTracking.updateValueIfChanged(targetInst),simulated=!0===nativeEvent.simulated&&ChangeEventPlugin._allowSimulatedPassThrough;if(updated||simulated)return targetInst}function getTargetInstForChangeEvent(topLevelType,targetInst){if("topChange"===topLevelType)return targetInst}function handleEventsForChangeEventIE8(topLevelType,target,targetInst){"topFocus"===topLevelType?(stopWatchingForChangeEventIE8(),startWatchingForChangeEventIE8(target,targetInst)):"topBlur"===topLevelType&&stopWatchingForChangeEventIE8()}function startWatchingForValueChange(target,targetInst){activeElement=target,activeElementInst=targetInst,activeElement.attachEvent("onpropertychange",handlePropertyChange)}function stopWatchingForValueChange(){activeElement&&(activeElement.detachEvent("onpropertychange",handlePropertyChange),activeElement=null,activeElementInst=null)}function handlePropertyChange(nativeEvent){"value"===nativeEvent.propertyName&&getInstIfValueChanged(activeElementInst,nativeEvent)&&manualDispatchChangeEvent(nativeEvent)}function handleEventsForInputEventPolyfill(topLevelType,target,targetInst){"topFocus"===topLevelType?(stopWatchingForValueChange(),startWatchingForValueChange(target,targetInst)):"topBlur"===topLevelType&&stopWatchingForValueChange()}function getTargetInstForInputEventPolyfill(topLevelType,targetInst,nativeEvent){if("topSelectionChange"===topLevelType||"topKeyUp"===topLevelType||"topKeyDown"===topLevelType)return getInstIfValueChanged(activeElementInst,nativeEvent)}function shouldUseClickEvent(elem){var nodeName=elem.nodeName;return nodeName&&"input"===nodeName.toLowerCase()&&("checkbox"===elem.type||"radio"===elem.type)}function getTargetInstForClickEvent(topLevelType,targetInst,nativeEvent){if("topClick"===topLevelType)return getInstIfValueChanged(targetInst,nativeEvent)}function getTargetInstForInputOrChangeEvent(topLevelType,targetInst,nativeEvent){if("topInput"===topLevelType||"topChange"===topLevelType)return getInstIfValueChanged(targetInst,nativeEvent)}function handleControlledInputBlur(inst,node){if(null!=inst){var state=inst._wrapperState||node._wrapperState;if(state&&state.controlled&&"number"===node.type){var value=""+node.value;node.getAttribute("value")!==value&&node.setAttribute("value",value)}}}var EventPluginHub=__webpack_require__(30),EventPropagators=__webpack_require__(31),ExecutionEnvironment=__webpack_require__(9),ReactDOMComponentTree=__webpack_require__(8),ReactUpdates=__webpack_require__(17),SyntheticEvent=__webpack_require__(20),inputValueTracking=__webpack_require__(119),getEventTarget=__webpack_require__(65),isEventSupported=__webpack_require__(66),isTextInputElement=__webpack_require__(121),eventTypes={change:{phasedRegistrationNames:{bubbled:"onChange",captured:"onChangeCapture"},dependencies:["topBlur","topChange","topClick","topFocus","topInput","topKeyDown","topKeyUp","topSelectionChange"]}},activeElement=null,activeElementInst=null,doesChangeEventBubble=!1;ExecutionEnvironment.canUseDOM&&(doesChangeEventBubble=isEventSupported("change")&&(!document.documentMode||document.documentMode>8));var isInputEventSupported=!1;ExecutionEnvironment.canUseDOM&&(isInputEventSupported=isEventSupported("input")&&(!("documentMode"in document)||document.documentMode>9));var ChangeEventPlugin={eventTypes:eventTypes,_allowSimulatedPassThrough:!0,_isInputEventSupported:isInputEventSupported,extractEvents:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){var getTargetInstFunc,handleEventFunc,targetNode=targetInst?ReactDOMComponentTree.getNodeFromInstance(targetInst):window;if(shouldUseChangeEvent(targetNode)?doesChangeEventBubble?getTargetInstFunc=getTargetInstForChangeEvent:handleEventFunc=handleEventsForChangeEventIE8:isTextInputElement(targetNode)?isInputEventSupported?getTargetInstFunc=getTargetInstForInputOrChangeEvent:(getTargetInstFunc=getTargetInstForInputEventPolyfill,handleEventFunc=handleEventsForInputEventPolyfill):shouldUseClickEvent(targetNode)&&(getTargetInstFunc=getTargetInstForClickEvent),getTargetInstFunc){var inst=getTargetInstFunc(topLevelType,targetInst,nativeEvent);if(inst){return createAndAccumulateChangeEvent(inst,nativeEvent,nativeEventTarget)}}handleEventFunc&&handleEventFunc(topLevelType,targetNode,targetInst),"topBlur"===topLevelType&&handleControlledInputBlur(targetInst,targetNode)}};module.exports=ChangeEventPlugin},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(4),DOMLazyTree=__webpack_require__(26),ExecutionEnvironment=__webpack_require__(9),createNodesFromMarkup=__webpack_require__(192),emptyFunction=__webpack_require__(12),invariant=__webpack_require__(1),Danger={dangerouslyReplaceNodeWithMarkup:function(oldChild,markup){if(ExecutionEnvironment.canUseDOM||("production"!==process.env.NODE_ENV?invariant(!1,"dangerouslyReplaceNodeWithMarkup(...): Cannot render markup in a worker thread. Make sure `window` and `document` are available globally before requiring React when unit testing or use ReactDOMServer.renderToString() for server rendering."):_prodInvariant("56")),markup||("production"!==process.env.NODE_ENV?invariant(!1,"dangerouslyReplaceNodeWithMarkup(...): Missing markup."):_prodInvariant("57")),"HTML"===oldChild.nodeName&&("production"!==process.env.NODE_ENV?invariant(!1,"dangerouslyReplaceNodeWithMarkup(...): Cannot replace markup of the <html> node. This is because browser quirks make this unreliable and/or slow. If you want to render to the root you must use server rendering. See ReactDOMServer.renderToString()."):_prodInvariant("58")),"string"==typeof markup){var newChild=createNodesFromMarkup(markup,emptyFunction)[0];oldChild.parentNode.replaceChild(newChild,oldChild)}else DOMLazyTree.replaceChildWithTree(oldChild,markup)}};module.exports=Danger}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var DefaultEventPluginOrder=["ResponderEventPlugin","SimpleEventPlugin","TapEventPlugin","EnterLeaveEventPlugin","ChangeEventPlugin","SelectEventPlugin","BeforeInputEventPlugin"];module.exports=DefaultEventPluginOrder},function(module,exports,__webpack_require__){"use strict";var EventPropagators=__webpack_require__(31),ReactDOMComponentTree=__webpack_require__(8),SyntheticMouseEvent=__webpack_require__(41),eventTypes={mouseEnter:{registrationName:"onMouseEnter",dependencies:["topMouseOut","topMouseOver"]},mouseLeave:{registrationName:"onMouseLeave",dependencies:["topMouseOut","topMouseOver"]}},EnterLeaveEventPlugin={eventTypes:eventTypes,extractEvents:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){if("topMouseOver"===topLevelType&&(nativeEvent.relatedTarget||nativeEvent.fromElement))return null;if("topMouseOut"!==topLevelType&&"topMouseOver"!==topLevelType)return null;var win;if(nativeEventTarget.window===nativeEventTarget)win=nativeEventTarget;else{var doc=nativeEventTarget.ownerDocument;win=doc?doc.defaultView||doc.parentWindow:window}var from,to;if("topMouseOut"===topLevelType){from=targetInst;var related=nativeEvent.relatedTarget||nativeEvent.toElement;to=related?ReactDOMComponentTree.getClosestInstanceFromNode(related):null}else from=null,to=targetInst;if(from===to)return null;var fromNode=null==from?win:ReactDOMComponentTree.getNodeFromInstance(from),toNode=null==to?win:ReactDOMComponentTree.getNodeFromInstance(to),leave=SyntheticMouseEvent.getPooled(eventTypes.mouseLeave,from,nativeEvent,nativeEventTarget);leave.type="mouseleave",leave.target=fromNode,leave.relatedTarget=toNode;var enter=SyntheticMouseEvent.getPooled(eventTypes.mouseEnter,to,nativeEvent,nativeEventTarget);return enter.type="mouseenter",enter.target=toNode,enter.relatedTarget=fromNode,EventPropagators.accumulateEnterLeaveDispatches(leave,enter,from,to),[leave,enter]}};module.exports=EnterLeaveEventPlugin},function(module,exports,__webpack_require__){"use strict";function FallbackCompositionState(root){this._root=root,this._startText=this.getText(),this._fallbackText=null}var _assign=__webpack_require__(7),PooledClass=__webpack_require__(23),getTextContentAccessor=__webpack_require__(118);_assign(FallbackCompositionState.prototype,{destructor:function(){this._root=null,this._startText=null,this._fallbackText=null},getText:function(){return"value"in this._root?this._root.value:this._root[getTextContentAccessor()]},getData:function(){if(this._fallbackText)return this._fallbackText;var start,end,startValue=this._startText,startLength=startValue.length,endValue=this.getText(),endLength=endValue.length;for(start=0;start<startLength&&startValue[start]===endValue[start];start++);var minEnd=startLength-start;for(end=1;end<=minEnd&&startValue[startLength-end]===endValue[endLength-end];end++);var sliceTail=end>1?1-end:void 0;return this._fallbackText=endValue.slice(start,sliceTail),this._fallbackText}}),PooledClass.addPoolingTo(FallbackCompositionState),module.exports=FallbackCompositionState},function(module,exports,__webpack_require__){"use strict";var DOMProperty=__webpack_require__(21),MUST_USE_PROPERTY=DOMProperty.injection.MUST_USE_PROPERTY,HAS_BOOLEAN_VALUE=DOMProperty.injection.HAS_BOOLEAN_VALUE,HAS_NUMERIC_VALUE=DOMProperty.injection.HAS_NUMERIC_VALUE,HAS_POSITIVE_NUMERIC_VALUE=DOMProperty.injection.HAS_POSITIVE_NUMERIC_VALUE,HAS_OVERLOADED_BOOLEAN_VALUE=DOMProperty.injection.HAS_OVERLOADED_BOOLEAN_VALUE,HTMLDOMPropertyConfig={isCustomAttribute:RegExp.prototype.test.bind(new RegExp("^(data|aria)-["+DOMProperty.ATTRIBUTE_NAME_CHAR+"]*$")),Properties:{accept:0,acceptCharset:0,accessKey:0,action:0,allowFullScreen:HAS_BOOLEAN_VALUE,allowTransparency:0,alt:0,as:0,async:HAS_BOOLEAN_VALUE,autoComplete:0,autoPlay:HAS_BOOLEAN_VALUE,capture:HAS_BOOLEAN_VALUE,cellPadding:0,cellSpacing:0,charSet:0,challenge:0,checked:MUST_USE_PROPERTY|HAS_BOOLEAN_VALUE,cite:0,classID:0,className:0,cols:HAS_POSITIVE_NUMERIC_VALUE,colSpan:0,content:0,contentEditable:0,contextMenu:0,controls:HAS_BOOLEAN_VALUE,coords:0,crossOrigin:0,data:0,dateTime:0,default:HAS_BOOLEAN_VALUE,defer:HAS_BOOLEAN_VALUE,dir:0,disabled:HAS_BOOLEAN_VALUE,download:HAS_OVERLOADED_BOOLEAN_VALUE,draggable:0,encType:0,form:0,formAction:0,formEncType:0,formMethod:0,formNoValidate:HAS_BOOLEAN_VALUE,formTarget:0,frameBorder:0,headers:0,height:0,hidden:HAS_BOOLEAN_VALUE,high:0,href:0,hrefLang:0,htmlFor:0,httpEquiv:0,icon:0,id:0,inputMode:0,integrity:0,is:0,keyParams:0,keyType:0,kind:0,label:0,lang:0,list:0,loop:HAS_BOOLEAN_VALUE,low:0,manifest:0,marginHeight:0,marginWidth:0,max:0,maxLength:0,media:0,mediaGroup:0,method:0,min:0,minLength:0,multiple:MUST_USE_PROPERTY|HAS_BOOLEAN_VALUE,muted:MUST_USE_PROPERTY|HAS_BOOLEAN_VALUE,name:0,nonce:0,noValidate:HAS_BOOLEAN_VALUE,open:HAS_BOOLEAN_VALUE,optimum:0,pattern:0,placeholder:0,playsInline:HAS_BOOLEAN_VALUE,poster:0,preload:0,profile:0,radioGroup:0,readOnly:HAS_BOOLEAN_VALUE,referrerPolicy:0,rel:0,required:HAS_BOOLEAN_VALUE,reversed:HAS_BOOLEAN_VALUE,role:0,rows:HAS_POSITIVE_NUMERIC_VALUE,rowSpan:HAS_NUMERIC_VALUE,sandbox:0,scope:0,scoped:HAS_BOOLEAN_VALUE,scrolling:0,seamless:HAS_BOOLEAN_VALUE,selected:MUST_USE_PROPERTY|HAS_BOOLEAN_VALUE,shape:0,size:HAS_POSITIVE_NUMERIC_VALUE,sizes:0,span:HAS_POSITIVE_NUMERIC_VALUE,spellCheck:0,src:0,srcDoc:0,srcLang:0,srcSet:0,start:HAS_NUMERIC_VALUE,step:0,style:0,summary:0,tabIndex:0,target:0,title:0,type:0,useMap:0,value:0,width:0,wmode:0,wrap:0,about:0,datatype:0,inlist:0,prefix:0,property:0,resource:0,typeof:0,vocab:0,autoCapitalize:0,autoCorrect:0,autoSave:0,color:0,itemProp:0,itemScope:HAS_BOOLEAN_VALUE,itemType:0,itemID:0,itemRef:0,results:0,security:0,unselectable:0},DOMAttributeNames:{acceptCharset:"accept-charset",className:"class",htmlFor:"for",httpEquiv:"http-equiv"},DOMPropertyNames:{},DOMMutationMethods:{value:function(node,value){if(null==value)return node.removeAttribute("value");"number"!==node.type||!1===node.hasAttribute("value")?node.setAttribute("value",""+value):node.validity&&!node.validity.badInput&&node.ownerDocument.activeElement!==node&&node.setAttribute("value",""+value)}}};module.exports=HTMLDOMPropertyConfig},function(module,exports,__webpack_require__){"use strict";(function(process){function instantiateChild(childInstances,child,name,selfDebugID){var keyUnique=void 0===childInstances[name];"production"!==process.env.NODE_ENV&&(ReactComponentTreeHook||(ReactComponentTreeHook=__webpack_require__(11)),keyUnique||"production"!==process.env.NODE_ENV&&warning(!1,"flattenChildren(...): Encountered two children with the same key, `%s`. Child keys must be unique; when two children share a key, only the first child will be used.%s",KeyEscapeUtils.unescape(name),ReactComponentTreeHook.getStackAddendumByID(selfDebugID))),null!=child&&keyUnique&&(childInstances[name]=instantiateReactComponent(child,!0))}var ReactComponentTreeHook,ReactReconciler=__webpack_require__(27),instantiateReactComponent=__webpack_require__(120),KeyEscapeUtils=__webpack_require__(57),shouldUpdateReactComponent=__webpack_require__(67),traverseAllChildren=__webpack_require__(123),warning=__webpack_require__(2);void 0!==process&&process.env&&"test"===process.env.NODE_ENV&&(ReactComponentTreeHook=__webpack_require__(11));var ReactChildReconciler={instantiateChildren:function(nestedChildNodes,transaction,context,selfDebugID){if(null==nestedChildNodes)return null;var childInstances={};return"production"!==process.env.NODE_ENV?traverseAllChildren(nestedChildNodes,function(childInsts,child,name){return instantiateChild(childInsts,child,name,selfDebugID)},childInstances):traverseAllChildren(nestedChildNodes,instantiateChild,childInstances),childInstances},updateChildren:function(prevChildren,nextChildren,mountImages,removedNodes,transaction,hostParent,hostContainerInfo,context,selfDebugID){if(nextChildren||prevChildren){var name,prevChild;for(name in nextChildren)if(nextChildren.hasOwnProperty(name)){prevChild=prevChildren&&prevChildren[name];var prevElement=prevChild&&prevChild._currentElement,nextElement=nextChildren[name];if(null!=prevChild&&shouldUpdateReactComponent(prevElement,nextElement))ReactReconciler.receiveComponent(prevChild,nextElement,transaction,context),nextChildren[name]=prevChild;else{prevChild&&(removedNodes[name]=ReactReconciler.getHostNode(prevChild),ReactReconciler.unmountComponent(prevChild,!1));var nextChildInstance=instantiateReactComponent(nextElement,!0);nextChildren[name]=nextChildInstance;var nextChildMountImage=ReactReconciler.mountComponent(nextChildInstance,transaction,hostParent,hostContainerInfo,context,selfDebugID);mountImages.push(nextChildMountImage)}}for(name in prevChildren)!prevChildren.hasOwnProperty(name)||nextChildren&&nextChildren.hasOwnProperty(name)||(prevChild=prevChildren[name],removedNodes[name]=ReactReconciler.getHostNode(prevChild),ReactReconciler.unmountComponent(prevChild,!1))}},unmountChildren:function(renderedChildren,safely){for(var name in renderedChildren)if(renderedChildren.hasOwnProperty(name)){var renderedChild=renderedChildren[name];ReactReconciler.unmountComponent(renderedChild,safely)}}};module.exports=ReactChildReconciler}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var DOMChildrenOperations=__webpack_require__(54),ReactDOMIDOperations=__webpack_require__(246),ReactComponentBrowserEnvironment={processChildrenUpdates:ReactDOMIDOperations.dangerouslyProcessChildrenUpdates,replaceNodeWithMarkup:DOMChildrenOperations.dangerouslyReplaceNodeWithMarkup};module.exports=ReactComponentBrowserEnvironment},function(module,exports,__webpack_require__){"use strict";(function(process){function StatelessComponent(Component){}function warnIfInvalidElement(Component,element){"production"!==process.env.NODE_ENV&&("production"!==process.env.NODE_ENV&&warning(null===element||!1===element||React.isValidElement(element),"%s(...): A valid React element (or null) must be returned. You may have returned undefined, an array or some other invalid object.",Component.displayName||Component.name||"Component"),"production"!==process.env.NODE_ENV&&warning(!Component.childContextTypes,"%s(...): childContextTypes cannot be defined on a functional component.",Component.displayName||Component.name||"Component"))}function shouldConstruct(Component){return!(!Component.prototype||!Component.prototype.isReactComponent)}function isPureComponent(Component){return!(!Component.prototype||!Component.prototype.isPureReactComponent)}function measureLifeCyclePerf(fn,debugID,timerType){if(0===debugID)return fn();ReactInstrumentation.debugTool.onBeginLifeCycleTimer(debugID,timerType);try{return fn()}finally{ReactInstrumentation.debugTool.onEndLifeCycleTimer(debugID,timerType)}}var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),React=__webpack_require__(28),ReactComponentEnvironment=__webpack_require__(59),ReactCurrentOwner=__webpack_require__(18),ReactErrorUtils=__webpack_require__(60),ReactInstanceMap=__webpack_require__(32),ReactInstrumentation=__webpack_require__(14),ReactNodeTypes=__webpack_require__(112),ReactReconciler=__webpack_require__(27);if("production"!==process.env.NODE_ENV)var checkReactTypeSpec=__webpack_require__(288);var emptyObject=__webpack_require__(38),invariant=__webpack_require__(1),shallowEqual=__webpack_require__(51),shouldUpdateReactComponent=__webpack_require__(67),warning=__webpack_require__(2),CompositeTypes={ImpureClass:0,PureClass:1,StatelessFunctional:2};StatelessComponent.prototype.render=function(){var Component=ReactInstanceMap.get(this)._currentElement.type,element=Component(this.props,this.context,this.updater);return warnIfInvalidElement(Component,element),element};var nextMountID=1,ReactCompositeComponent={construct:function(element){this._currentElement=element,this._rootNodeID=0,this._compositeType=null,this._instance=null,this._hostParent=null,this._hostContainerInfo=null,this._updateBatchNumber=null,this._pendingElement=null,this._pendingStateQueue=null,this._pendingReplaceState=!1,this._pendingForceUpdate=!1,this._renderedNodeType=null,this._renderedComponent=null,this._context=null,this._mountOrder=0,this._topLevelWrapper=null,this._pendingCallbacks=null,this._calledComponentWillUnmount=!1,"production"!==process.env.NODE_ENV&&(this._warnedAboutRefsInRender=!1)},mountComponent:function(transaction,hostParent,hostContainerInfo,context){var _this=this;this._context=context,this._mountOrder=nextMountID++,this._hostParent=hostParent,this._hostContainerInfo=hostContainerInfo;var renderedElement,publicProps=this._currentElement.props,publicContext=this._processContext(context),Component=this._currentElement.type,updateQueue=transaction.getUpdateQueue(),doConstruct=shouldConstruct(Component),inst=this._constructComponent(doConstruct,publicProps,publicContext,updateQueue);if(doConstruct||null!=inst&&null!=inst.render?isPureComponent(Component)?this._compositeType=CompositeTypes.PureClass:this._compositeType=CompositeTypes.ImpureClass:(renderedElement=inst,warnIfInvalidElement(Component,renderedElement),null===inst||!1===inst||React.isValidElement(inst)||("production"!==process.env.NODE_ENV?invariant(!1,"%s(...): A valid React element (or null) must be returned. You may have returned undefined, an array or some other invalid object.",Component.displayName||Component.name||"Component"):_prodInvariant("105",Component.displayName||Component.name||"Component")),inst=new StatelessComponent(Component),this._compositeType=CompositeTypes.StatelessFunctional),"production"!==process.env.NODE_ENV){null==inst.render&&"production"!==process.env.NODE_ENV&&warning(!1,"%s(...): No `render` method found on the returned component instance: you may have forgotten to define `render`.",Component.displayName||Component.name||"Component");var propsMutated=inst.props!==publicProps,componentName=Component.displayName||Component.name||"Component";"production"!==process.env.NODE_ENV&&warning(void 0===inst.props||!propsMutated,"%s(...): When calling super() in `%s`, make sure to pass up the same props that your component's constructor was passed.",componentName,componentName)}inst.props=publicProps,inst.context=publicContext,inst.refs=emptyObject,inst.updater=updateQueue,this._instance=inst,ReactInstanceMap.set(inst,this),"production"!==process.env.NODE_ENV&&("production"!==process.env.NODE_ENV&&warning(!inst.getInitialState||inst.getInitialState.isReactClassApproved||inst.state,"getInitialState was defined on %s, a plain JavaScript class. This is only supported for classes created using React.createClass. Did you mean to define a state property instead?",this.getName()||"a component"),"production"!==process.env.NODE_ENV&&warning(!inst.getDefaultProps||inst.getDefaultProps.isReactClassApproved,"getDefaultProps was defined on %s, a plain JavaScript class. This is only supported for classes created using React.createClass. Use a static property to define defaultProps instead.",this.getName()||"a component"),"production"!==process.env.NODE_ENV&&warning(!inst.propTypes,"propTypes was defined as an instance property on %s. Use a static property to define propTypes instead.",this.getName()||"a component"),"production"!==process.env.NODE_ENV&&warning(!inst.contextTypes,"contextTypes was defined as an instance property on %s. Use a static property to define contextTypes instead.",this.getName()||"a component"),"production"!==process.env.NODE_ENV&&warning("function"!=typeof inst.componentShouldUpdate,"%s has a method called componentShouldUpdate(). Did you mean shouldComponentUpdate()? The name is phrased as a question because the function is expected to return a value.",this.getName()||"A component"),"production"!==process.env.NODE_ENV&&warning("function"!=typeof inst.componentDidUnmount,"%s has a method called componentDidUnmount(). But there is no such lifecycle method. Did you mean componentWillUnmount()?",this.getName()||"A component"),"production"!==process.env.NODE_ENV&&warning("function"!=typeof inst.componentWillRecieveProps,"%s has a method called componentWillRecieveProps(). Did you mean componentWillReceiveProps()?",this.getName()||"A component"));var initialState=inst.state;void 0===initialState&&(inst.state=initialState=null),("object"!=typeof initialState||Array.isArray(initialState))&&("production"!==process.env.NODE_ENV?invariant(!1,"%s.state: must be set to an object or null",this.getName()||"ReactCompositeComponent"):_prodInvariant("106",this.getName()||"ReactCompositeComponent")),this._pendingStateQueue=null,this._pendingReplaceState=!1,this._pendingForceUpdate=!1;var markup;return markup=inst.unstable_handleError?this.performInitialMountWithErrorHandling(renderedElement,hostParent,hostContainerInfo,transaction,context):this.performInitialMount(renderedElement,hostParent,hostContainerInfo,transaction,context),inst.componentDidMount&&("production"!==process.env.NODE_ENV?transaction.getReactMountReady().enqueue(function(){measureLifeCyclePerf(function(){return inst.componentDidMount()},_this._debugID,"componentDidMount")}):transaction.getReactMountReady().enqueue(inst.componentDidMount,inst)),markup},_constructComponent:function(doConstruct,publicProps,publicContext,updateQueue){if("production"===process.env.NODE_ENV)return this._constructComponentWithoutOwner(doConstruct,publicProps,publicContext,updateQueue);ReactCurrentOwner.current=this;try{return this._constructComponentWithoutOwner(doConstruct,publicProps,publicContext,updateQueue)}finally{ReactCurrentOwner.current=null}},_constructComponentWithoutOwner:function(doConstruct,publicProps,publicContext,updateQueue){var Component=this._currentElement.type;return doConstruct?"production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return new Component(publicProps,publicContext,updateQueue)},this._debugID,"ctor"):new Component(publicProps,publicContext,updateQueue):"production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return Component(publicProps,publicContext,updateQueue)},this._debugID,"render"):Component(publicProps,publicContext,updateQueue)},performInitialMountWithErrorHandling:function(renderedElement,hostParent,hostContainerInfo,transaction,context){var markup,checkpoint=transaction.checkpoint();try{markup=this.performInitialMount(renderedElement,hostParent,hostContainerInfo,transaction,context)}catch(e){transaction.rollback(checkpoint),this._instance.unstable_handleError(e),this._pendingStateQueue&&(this._instance.state=this._processPendingState(this._instance.props,this._instance.context)),checkpoint=transaction.checkpoint(),this._renderedComponent.unmountComponent(!0),transaction.rollback(checkpoint),markup=this.performInitialMount(renderedElement,hostParent,hostContainerInfo,transaction,context)}return markup},performInitialMount:function(renderedElement,hostParent,hostContainerInfo,transaction,context){var inst=this._instance,debugID=0;"production"!==process.env.NODE_ENV&&(debugID=this._debugID),inst.componentWillMount&&("production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return inst.componentWillMount()},debugID,"componentWillMount"):inst.componentWillMount(),this._pendingStateQueue&&(inst.state=this._processPendingState(inst.props,inst.context))),void 0===renderedElement&&(renderedElement=this._renderValidatedComponent());var nodeType=ReactNodeTypes.getType(renderedElement);this._renderedNodeType=nodeType;var child=this._instantiateReactComponent(renderedElement,nodeType!==ReactNodeTypes.EMPTY);this._renderedComponent=child;var markup=ReactReconciler.mountComponent(child,transaction,hostParent,hostContainerInfo,this._processChildContext(context),debugID);if("production"!==process.env.NODE_ENV&&0!==debugID){var childDebugIDs=0!==child._debugID?[child._debugID]:[];ReactInstrumentation.debugTool.onSetChildren(debugID,childDebugIDs)}return markup},getHostNode:function(){return ReactReconciler.getHostNode(this._renderedComponent)},unmountComponent:function(safely){if(this._renderedComponent){var inst=this._instance;if(inst.componentWillUnmount&&!inst._calledComponentWillUnmount)if(inst._calledComponentWillUnmount=!0,safely){var name=this.getName()+".componentWillUnmount()";ReactErrorUtils.invokeGuardedCallback(name,inst.componentWillUnmount.bind(inst))}else"production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return inst.componentWillUnmount()},this._debugID,"componentWillUnmount"):inst.componentWillUnmount();this._renderedComponent&&(ReactReconciler.unmountComponent(this._renderedComponent,safely),this._renderedNodeType=null,this._renderedComponent=null,this._instance=null),this._pendingStateQueue=null,this._pendingReplaceState=!1,this._pendingForceUpdate=!1,this._pendingCallbacks=null,this._pendingElement=null,this._context=null,this._rootNodeID=0,this._topLevelWrapper=null,ReactInstanceMap.remove(inst)}},_maskContext:function(context){var Component=this._currentElement.type,contextTypes=Component.contextTypes;if(!contextTypes)return emptyObject;var maskedContext={};for(var contextName in contextTypes)maskedContext[contextName]=context[contextName];return maskedContext},_processContext:function(context){var maskedContext=this._maskContext(context);if("production"!==process.env.NODE_ENV){var Component=this._currentElement.type;Component.contextTypes&&this._checkContextTypes(Component.contextTypes,maskedContext,"context")}return maskedContext},_processChildContext:function(currentContext){var childContext,Component=this._currentElement.type,inst=this._instance;if(inst.getChildContext)if("production"!==process.env.NODE_ENV){ReactInstrumentation.debugTool.onBeginProcessingChildContext();try{childContext=inst.getChildContext()}finally{ReactInstrumentation.debugTool.onEndProcessingChildContext()}}else childContext=inst.getChildContext();if(childContext){"object"!=typeof Component.childContextTypes&&("production"!==process.env.NODE_ENV?invariant(!1,"%s.getChildContext(): childContextTypes must be defined in order to use getChildContext().",this.getName()||"ReactCompositeComponent"):_prodInvariant("107",this.getName()||"ReactCompositeComponent")),"production"!==process.env.NODE_ENV&&this._checkContextTypes(Component.childContextTypes,childContext,"child context");for(var name in childContext)name in Component.childContextTypes||("production"!==process.env.NODE_ENV?invariant(!1,'%s.getChildContext(): key "%s" is not defined in childContextTypes.',this.getName()||"ReactCompositeComponent",name):_prodInvariant("108",this.getName()||"ReactCompositeComponent",name));return _assign({},currentContext,childContext)}return currentContext},_checkContextTypes:function(typeSpecs,values,location){"production"!==process.env.NODE_ENV&&checkReactTypeSpec(typeSpecs,values,location,this.getName(),null,this._debugID)},receiveComponent:function(nextElement,transaction,nextContext){var prevElement=this._currentElement,prevContext=this._context;this._pendingElement=null,this.updateComponent(transaction,prevElement,nextElement,prevContext,nextContext)},performUpdateIfNecessary:function(transaction){null!=this._pendingElement?ReactReconciler.receiveComponent(this,this._pendingElement,transaction,this._context):null!==this._pendingStateQueue||this._pendingForceUpdate?this.updateComponent(transaction,this._currentElement,this._currentElement,this._context,this._context):this._updateBatchNumber=null},updateComponent:function(transaction,prevParentElement,nextParentElement,prevUnmaskedContext,nextUnmaskedContext){var inst=this._instance;null==inst&&("production"!==process.env.NODE_ENV?invariant(!1,"Attempted to update component `%s` that has already been unmounted (or failed to mount).",this.getName()||"ReactCompositeComponent"):_prodInvariant("136",this.getName()||"ReactCompositeComponent"));var nextContext,willReceive=!1;this._context===nextUnmaskedContext?nextContext=inst.context:(nextContext=this._processContext(nextUnmaskedContext),willReceive=!0);var prevProps=prevParentElement.props,nextProps=nextParentElement.props;prevParentElement!==nextParentElement&&(willReceive=!0),willReceive&&inst.componentWillReceiveProps&&("production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return inst.componentWillReceiveProps(nextProps,nextContext)},this._debugID,"componentWillReceiveProps"):inst.componentWillReceiveProps(nextProps,nextContext));var nextState=this._processPendingState(nextProps,nextContext),shouldUpdate=!0;this._pendingForceUpdate||(inst.shouldComponentUpdate?shouldUpdate="production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return inst.shouldComponentUpdate(nextProps,nextState,nextContext)},this._debugID,"shouldComponentUpdate"):inst.shouldComponentUpdate(nextProps,nextState,nextContext):this._compositeType===CompositeTypes.PureClass&&(shouldUpdate=!shallowEqual(prevProps,nextProps)||!shallowEqual(inst.state,nextState))),"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(void 0!==shouldUpdate,"%s.shouldComponentUpdate(): Returned undefined instead of a boolean value. Make sure to return true or false.",this.getName()||"ReactCompositeComponent"),this._updateBatchNumber=null,shouldUpdate?(this._pendingForceUpdate=!1,this._performComponentUpdate(nextParentElement,nextProps,nextState,nextContext,transaction,nextUnmaskedContext)):(this._currentElement=nextParentElement,this._context=nextUnmaskedContext,inst.props=nextProps,inst.state=nextState,inst.context=nextContext)},_processPendingState:function(props,context){var inst=this._instance,queue=this._pendingStateQueue,replace=this._pendingReplaceState;if(this._pendingReplaceState=!1,this._pendingStateQueue=null,!queue)return inst.state;if(replace&&1===queue.length)return queue[0];for(var nextState=_assign({},replace?queue[0]:inst.state),i=replace?1:0;i<queue.length;i++){var partial=queue[i];_assign(nextState,"function"==typeof partial?partial.call(inst,nextState,props,context):partial)}return nextState},_performComponentUpdate:function(nextElement,nextProps,nextState,nextContext,transaction,unmaskedContext){var prevProps,prevState,prevContext,_this2=this,inst=this._instance,hasComponentDidUpdate=Boolean(inst.componentDidUpdate);hasComponentDidUpdate&&(prevProps=inst.props,prevState=inst.state,prevContext=inst.context),inst.componentWillUpdate&&("production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return inst.componentWillUpdate(nextProps,nextState,nextContext)},this._debugID,"componentWillUpdate"):inst.componentWillUpdate(nextProps,nextState,nextContext)),this._currentElement=nextElement,this._context=unmaskedContext,inst.props=nextProps,inst.state=nextState,inst.context=nextContext,this._updateRenderedComponent(transaction,unmaskedContext),hasComponentDidUpdate&&("production"!==process.env.NODE_ENV?transaction.getReactMountReady().enqueue(function(){measureLifeCyclePerf(inst.componentDidUpdate.bind(inst,prevProps,prevState,prevContext),_this2._debugID,"componentDidUpdate")}):transaction.getReactMountReady().enqueue(inst.componentDidUpdate.bind(inst,prevProps,prevState,prevContext),inst))},_updateRenderedComponent:function(transaction,context){var prevComponentInstance=this._renderedComponent,prevRenderedElement=prevComponentInstance._currentElement,nextRenderedElement=this._renderValidatedComponent(),debugID=0;if("production"!==process.env.NODE_ENV&&(debugID=this._debugID),shouldUpdateReactComponent(prevRenderedElement,nextRenderedElement))ReactReconciler.receiveComponent(prevComponentInstance,nextRenderedElement,transaction,this._processChildContext(context));else{var oldHostNode=ReactReconciler.getHostNode(prevComponentInstance);ReactReconciler.unmountComponent(prevComponentInstance,!1);var nodeType=ReactNodeTypes.getType(nextRenderedElement);this._renderedNodeType=nodeType;var child=this._instantiateReactComponent(nextRenderedElement,nodeType!==ReactNodeTypes.EMPTY);this._renderedComponent=child;var nextMarkup=ReactReconciler.mountComponent(child,transaction,this._hostParent,this._hostContainerInfo,this._processChildContext(context),debugID);if("production"!==process.env.NODE_ENV&&0!==debugID){var childDebugIDs=0!==child._debugID?[child._debugID]:[];ReactInstrumentation.debugTool.onSetChildren(debugID,childDebugIDs)}this._replaceNodeWithMarkup(oldHostNode,nextMarkup,prevComponentInstance)}},_replaceNodeWithMarkup:function(oldHostNode,nextMarkup,prevInstance){ReactComponentEnvironment.replaceNodeWithMarkup(oldHostNode,nextMarkup,prevInstance)},_renderValidatedComponentWithoutOwnerOrContext:function(){var renderedElement,inst=this._instance;return renderedElement="production"!==process.env.NODE_ENV?measureLifeCyclePerf(function(){return inst.render()},this._debugID,"render"):inst.render(),"production"!==process.env.NODE_ENV&&void 0===renderedElement&&inst.render._isMockFunction&&(renderedElement=null),renderedElement},_renderValidatedComponent:function(){var renderedElement;if("production"!==process.env.NODE_ENV||this._compositeType!==CompositeTypes.StatelessFunctional){ReactCurrentOwner.current=this;try{renderedElement=this._renderValidatedComponentWithoutOwnerOrContext()}finally{ReactCurrentOwner.current=null}}else renderedElement=this._renderValidatedComponentWithoutOwnerOrContext();return null===renderedElement||!1===renderedElement||React.isValidElement(renderedElement)||("production"!==process.env.NODE_ENV?invariant(!1,"%s.render(): A valid React element (or null) must be returned. You may have returned undefined, an array or some other invalid object.",this.getName()||"ReactCompositeComponent"):_prodInvariant("109",this.getName()||"ReactCompositeComponent")),renderedElement},attachRef:function(ref,component){var inst=this.getPublicInstance();null==inst&&("production"!==process.env.NODE_ENV?invariant(!1,"Stateless function components cannot have refs."):_prodInvariant("110"));var publicComponentInstance=component.getPublicInstance();if("production"!==process.env.NODE_ENV){var componentName=component&&component.getName?component.getName():"a component";"production"!==process.env.NODE_ENV&&warning(null!=publicComponentInstance||component._compositeType!==CompositeTypes.StatelessFunctional,'Stateless function components cannot be given refs (See ref "%s" in %s created by %s). Attempts to access this ref will fail.',ref,componentName,this.getName())}(inst.refs===emptyObject?inst.refs={}:inst.refs)[ref]=publicComponentInstance},detachRef:function(ref){delete this.getPublicInstance().refs[ref]},getName:function(){var type=this._currentElement.type,constructor=this._instance&&this._instance.constructor;return type.displayName||constructor&&constructor.displayName||type.name||constructor&&constructor.name||null},getPublicInstance:function(){var inst=this._instance;return this._compositeType===CompositeTypes.StatelessFunctional?null:inst},_instantiateReactComponent:null};module.exports=ReactCompositeComponent}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var ReactDOMComponentTree=__webpack_require__(8),ReactDefaultInjection=__webpack_require__(258),ReactMount=__webpack_require__(111),ReactReconciler=__webpack_require__(27),ReactUpdates=__webpack_require__(17),ReactVersion=__webpack_require__(273),findDOMNode=__webpack_require__(290),getHostComponentFromComposite=__webpack_require__(117),renderSubtreeIntoContainer=__webpack_require__(297),warning=__webpack_require__(2);ReactDefaultInjection.inject();var ReactDOM={findDOMNode:findDOMNode,render:ReactMount.render,unmountComponentAtNode:ReactMount.unmountComponentAtNode,version:ReactVersion,unstable_batchedUpdates:ReactUpdates.batchedUpdates,unstable_renderSubtreeIntoContainer:renderSubtreeIntoContainer};if("undefined"!=typeof __REACT_DEVTOOLS_GLOBAL_HOOK__&&"function"==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.inject&&__REACT_DEVTOOLS_GLOBAL_HOOK__.inject({ComponentTree:{getClosestInstanceFromNode:ReactDOMComponentTree.getClosestInstanceFromNode,getNodeFromInstance:function(inst){return inst._renderedComponent&&(inst=getHostComponentFromComposite(inst)),inst?ReactDOMComponentTree.getNodeFromInstance(inst):null}},Mount:ReactMount,Reconciler:ReactReconciler}),"production"!==process.env.NODE_ENV){if(__webpack_require__(9).canUseDOM&&window.top===window.self){if("undefined"==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__&&(navigator.userAgent.indexOf("Chrome")>-1&&-1===navigator.userAgent.indexOf("Edge")||navigator.userAgent.indexOf("Firefox")>-1)){-1===window.location.protocol.indexOf("http")&&navigator.userAgent.indexOf("Firefox")}var testFunc=function(){};"production"!==process.env.NODE_ENV&&warning(-1!==(testFunc.name||testFunc.toString()).indexOf("testFn"),"It looks like you're using a minified copy of the development build of React. When deploying React apps to production, make sure to use the production build which skips development warnings and is faster. See https://fb.me/react-minification for more details.");var ieCompatibilityMode=document.documentMode&&document.documentMode<8;"production"!==process.env.NODE_ENV&&warning(!ieCompatibilityMode,'Internet Explorer is running in compatibility mode; please add the following tag to your HTML to prevent this from happening: <meta http-equiv="X-UA-Compatible" content="IE=edge" />');for(var expectedFeatures=[Array.isArray,Array.prototype.every,Array.prototype.forEach,Array.prototype.indexOf,Array.prototype.map,Date.now,Function.prototype.bind,Object.keys,String.prototype.trim],i=0;i<expectedFeatures.length;i++)if(!expectedFeatures[i]){"production"!==process.env.NODE_ENV&&warning(!1,"One or more ES5 shims expected by React are not available: https://fb.me/react-warning-polyfills");break}}}if("production"!==process.env.NODE_ENV){var ReactInstrumentation=__webpack_require__(14),ReactDOMUnknownPropertyHook=__webpack_require__(255),ReactDOMNullInputValuePropHook=__webpack_require__(249),ReactDOMInvalidARIAHook=__webpack_require__(248);ReactInstrumentation.debugTool.addHook(ReactDOMUnknownPropertyHook),ReactInstrumentation.debugTool.addHook(ReactDOMNullInputValuePropHook),ReactInstrumentation.debugTool.addHook(ReactDOMInvalidARIAHook)}module.exports=ReactDOM}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function getDeclarationErrorAddendum(internalInstance){if(internalInstance){var owner=internalInstance._currentElement._owner||null;if(owner){var name=owner.getName();if(name)return" This DOM node was rendered by `"+name+"`."}}return""}function friendlyStringify(obj){if("object"==typeof obj){if(Array.isArray(obj))return"["+obj.map(friendlyStringify).join(", ")+"]";var pairs=[];for(var key in obj)if(Object.prototype.hasOwnProperty.call(obj,key)){var keyEscaped=/^[a-z$_][\w$_]*$/i.test(key)?key:JSON.stringify(key);pairs.push(keyEscaped+": "+friendlyStringify(obj[key]))}return"{"+pairs.join(", ")+"}"}return"string"==typeof obj?JSON.stringify(obj):"function"==typeof obj?"[function object]":String(obj)}function checkAndWarnForMutatedStyle(style1,style2,component){if(null!=style1&&null!=style2&&!shallowEqual(style1,style2)){var ownerName,componentName=component._tag,owner=component._currentElement._owner;owner&&(ownerName=owner.getName());var hash=ownerName+"|"+componentName;styleMutationWarning.hasOwnProperty(hash)||(styleMutationWarning[hash]=!0,"production"!==process.env.NODE_ENV&&warning(!1,"`%s` was passed a style object that has previously been mutated. Mutating `style` is deprecated. Consider cloning it beforehand. Check the `render` %s. Previous style: %s. Mutated style: %s.",componentName,owner?"of `"+ownerName+"`":"using <"+componentName+">",friendlyStringify(style1),friendlyStringify(style2)))}}function assertValidProps(component,props){props&&(voidElementTags[component._tag]&&(null!=props.children||null!=props.dangerouslySetInnerHTML)&&("production"!==process.env.NODE_ENV?invariant(!1,"%s is a void element tag and must neither have `children` nor use `dangerouslySetInnerHTML`.%s",component._tag,component._currentElement._owner?" Check the render method of "+component._currentElement._owner.getName()+".":""):_prodInvariant("137",component._tag,component._currentElement._owner?" Check the render method of "+component._currentElement._owner.getName()+".":"")),null!=props.dangerouslySetInnerHTML&&(null!=props.children&&("production"!==process.env.NODE_ENV?invariant(!1,"Can only set one of `children` or `props.dangerouslySetInnerHTML`."):_prodInvariant("60")),"object"==typeof props.dangerouslySetInnerHTML&&HTML in props.dangerouslySetInnerHTML||("production"!==process.env.NODE_ENV?invariant(!1,"`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. Please visit https://fb.me/react-invariant-dangerously-set-inner-html for more information."):_prodInvariant("61"))),"production"!==process.env.NODE_ENV&&("production"!==process.env.NODE_ENV&&warning(null==props.innerHTML,"Directly setting property `innerHTML` is not permitted. For more information, lookup documentation on `dangerouslySetInnerHTML`."),"production"!==process.env.NODE_ENV&&warning(props.suppressContentEditableWarning||!props.contentEditable||null==props.children,"A component is `contentEditable` and contains `children` managed by React. It is now your responsibility to guarantee that none of those nodes are unexpectedly modified or duplicated. This is probably not intentional."),"production"!==process.env.NODE_ENV&&warning(null==props.onFocusIn&&null==props.onFocusOut,"React uses onFocus and onBlur instead of onFocusIn and onFocusOut. All React events are normalized to bubble, so onFocusIn and onFocusOut are not needed/supported by React.")),null!=props.style&&"object"!=typeof props.style&&("production"!==process.env.NODE_ENV?invariant(!1,"The `style` prop expects a mapping from style properties to values, not a string. For example, style={{marginRight: spacing + 'em'}} when using JSX.%s",getDeclarationErrorAddendum(component)):_prodInvariant("62",getDeclarationErrorAddendum(component))))}function enqueuePutListener(inst,registrationName,listener,transaction){if(!(transaction instanceof ReactServerRenderingTransaction)){"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning("onScroll"!==registrationName||isEventSupported("scroll",!0),"This browser doesn't support the `onScroll` event");var containerInfo=inst._hostContainerInfo,isDocumentFragment=containerInfo._node&&containerInfo._node.nodeType===DOC_FRAGMENT_TYPE,doc=isDocumentFragment?containerInfo._node:containerInfo._ownerDocument;listenTo(registrationName,doc),transaction.getReactMountReady().enqueue(putListener,{inst:inst,registrationName:registrationName,listener:listener})}}function putListener(){var listenerToPut=this;EventPluginHub.putListener(listenerToPut.inst,listenerToPut.registrationName,listenerToPut.listener)}function inputPostMount(){var inst=this;ReactDOMInput.postMountWrapper(inst)}function textareaPostMount(){var inst=this;ReactDOMTextarea.postMountWrapper(inst)}function optionPostMount(){var inst=this;ReactDOMOption.postMountWrapper(inst)}function trackInputValue(){inputValueTracking.track(this)}function trapBubbledEventsLocal(){var inst=this;inst._rootNodeID||("production"!==process.env.NODE_ENV?invariant(!1,"Must be mounted to trap events"):_prodInvariant("63"));var node=getNode(inst);switch(node||("production"!==process.env.NODE_ENV?invariant(!1,"trapBubbledEvent(...): Requires node to be rendered."):_prodInvariant("64")),inst._tag){case"iframe":case"object":inst._wrapperState.listeners=[ReactBrowserEventEmitter.trapBubbledEvent("topLoad","load",node)];break;case"video":case"audio":inst._wrapperState.listeners=[];for(var event in mediaEvents)mediaEvents.hasOwnProperty(event)&&inst._wrapperState.listeners.push(ReactBrowserEventEmitter.trapBubbledEvent(event,mediaEvents[event],node));break;case"source":inst._wrapperState.listeners=[ReactBrowserEventEmitter.trapBubbledEvent("topError","error",node)];break;case"img":inst._wrapperState.listeners=[ReactBrowserEventEmitter.trapBubbledEvent("topError","error",node),ReactBrowserEventEmitter.trapBubbledEvent("topLoad","load",node)];break;case"form":inst._wrapperState.listeners=[ReactBrowserEventEmitter.trapBubbledEvent("topReset","reset",node),ReactBrowserEventEmitter.trapBubbledEvent("topSubmit","submit",node)];break;case"input":case"select":case"textarea":inst._wrapperState.listeners=[ReactBrowserEventEmitter.trapBubbledEvent("topInvalid","invalid",node)]}}function postUpdateSelectWrapper(){ReactDOMSelect.postUpdateWrapper(this)}function validateDangerousTag(tag){hasOwnProperty.call(validatedTagCache,tag)||(VALID_TAG_REGEX.test(tag)||("production"!==process.env.NODE_ENV?invariant(!1,"Invalid tag: %s",tag):_prodInvariant("65",tag)),validatedTagCache[tag]=!0)}function isCustomComponent(tagName,props){return tagName.indexOf("-")>=0||null!=props.is}function ReactDOMComponent(element){var tag=element.type;validateDangerousTag(tag),this._currentElement=element,this._tag=tag.toLowerCase(),this._namespaceURI=null,this._renderedChildren=null,this._previousStyle=null,this._previousStyleCopy=null,this._hostNode=null,this._hostParent=null,this._rootNodeID=0,this._domID=0,this._hostContainerInfo=null,this._wrapperState=null,this._topLevelWrapper=null,this._flags=0,"production"!==process.env.NODE_ENV&&(this._ancestorInfo=null,setAndValidateContentChildDev.call(this,null))}var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),AutoFocusUtils=__webpack_require__(229),CSSPropertyOperations=__webpack_require__(231),DOMLazyTree=__webpack_require__(26),DOMNamespaces=__webpack_require__(55),DOMProperty=__webpack_require__(21),DOMPropertyOperations=__webpack_require__(104),EventPluginHub=__webpack_require__(30),EventPluginRegistry=__webpack_require__(39),ReactBrowserEventEmitter=__webpack_require__(40),ReactDOMComponentFlags=__webpack_require__(105),ReactDOMComponentTree=__webpack_require__(8),ReactDOMInput=__webpack_require__(247),ReactDOMOption=__webpack_require__(250),ReactDOMSelect=__webpack_require__(106),ReactDOMTextarea=__webpack_require__(253),ReactInstrumentation=__webpack_require__(14),ReactMultiChild=__webpack_require__(266),ReactServerRenderingTransaction=__webpack_require__(271),emptyFunction=__webpack_require__(12),escapeTextContentForBrowser=__webpack_require__(43),invariant=__webpack_require__(1),isEventSupported=__webpack_require__(66),shallowEqual=__webpack_require__(51),inputValueTracking=__webpack_require__(119),validateDOMNesting=__webpack_require__(68),warning=__webpack_require__(2),Flags=ReactDOMComponentFlags,deleteListener=EventPluginHub.deleteListener,getNode=ReactDOMComponentTree.getNodeFromInstance,listenTo=ReactBrowserEventEmitter.listenTo,registrationNameModules=EventPluginRegistry.registrationNameModules,CONTENT_TYPES={string:!0,number:!0},HTML="__html",RESERVED_PROPS={children:null,dangerouslySetInnerHTML:null,suppressContentEditableWarning:null},DOC_FRAGMENT_TYPE=11,styleMutationWarning={},setAndValidateContentChildDev=emptyFunction;"production"!==process.env.NODE_ENV&&(setAndValidateContentChildDev=function(content){var hasExistingContent=null!=this._contentDebugID,debugID=this._debugID,contentDebugID=-debugID;if(null==content)return hasExistingContent&&ReactInstrumentation.debugTool.onUnmountComponent(this._contentDebugID),void(this._contentDebugID=null);validateDOMNesting(null,String(content),this,this._ancestorInfo),this._contentDebugID=contentDebugID,hasExistingContent?(ReactInstrumentation.debugTool.onBeforeUpdateComponent(contentDebugID,content),ReactInstrumentation.debugTool.onUpdateComponent(contentDebugID)):(ReactInstrumentation.debugTool.onBeforeMountComponent(contentDebugID,content,debugID),ReactInstrumentation.debugTool.onMountComponent(contentDebugID),ReactInstrumentation.debugTool.onSetChildren(debugID,[contentDebugID]))});var mediaEvents={topAbort:"abort",topCanPlay:"canplay",topCanPlayThrough:"canplaythrough",topDurationChange:"durationchange",topEmptied:"emptied",topEncrypted:"encrypted",topEnded:"ended",topError:"error",topLoadedData:"loadeddata",topLoadedMetadata:"loadedmetadata",topLoadStart:"loadstart",topPause:"pause",topPlay:"play",topPlaying:"playing",topProgress:"progress",topRateChange:"ratechange",topSeeked:"seeked",topSeeking:"seeking",topStalled:"stalled",topSuspend:"suspend",topTimeUpdate:"timeupdate",topVolumeChange:"volumechange",topWaiting:"waiting"},omittedCloseTags={area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0},newlineEatingTags={listing:!0,pre:!0,textarea:!0},voidElementTags=_assign({menuitem:!0},omittedCloseTags),VALID_TAG_REGEX=/^[a-zA-Z][a-zA-Z:_\.\-\d]*$/,validatedTagCache={},hasOwnProperty={}.hasOwnProperty,globalIdCounter=1;ReactDOMComponent.displayName="ReactDOMComponent",ReactDOMComponent.Mixin={mountComponent:function(transaction,hostParent,hostContainerInfo,context){this._rootNodeID=globalIdCounter++,this._domID=hostContainerInfo._idCounter++,this._hostParent=hostParent,this._hostContainerInfo=hostContainerInfo;var props=this._currentElement.props;switch(this._tag){case"audio":case"form":case"iframe":case"img":case"link":case"object":case"source":case"video":this._wrapperState={listeners:null},transaction.getReactMountReady().enqueue(trapBubbledEventsLocal,this);break;case"input":ReactDOMInput.mountWrapper(this,props,hostParent),props=ReactDOMInput.getHostProps(this,props),transaction.getReactMountReady().enqueue(trackInputValue,this),transaction.getReactMountReady().enqueue(trapBubbledEventsLocal,this);break;case"option":ReactDOMOption.mountWrapper(this,props,hostParent),props=ReactDOMOption.getHostProps(this,props);break;case"select":ReactDOMSelect.mountWrapper(this,props,hostParent),props=ReactDOMSelect.getHostProps(this,props),transaction.getReactMountReady().enqueue(trapBubbledEventsLocal,this);break;case"textarea":ReactDOMTextarea.mountWrapper(this,props,hostParent),props=ReactDOMTextarea.getHostProps(this,props),transaction.getReactMountReady().enqueue(trackInputValue,this),transaction.getReactMountReady().enqueue(trapBubbledEventsLocal,this)}assertValidProps(this,props);var namespaceURI,parentTag;if(null!=hostParent?(namespaceURI=hostParent._namespaceURI,parentTag=hostParent._tag):hostContainerInfo._tag&&(namespaceURI=hostContainerInfo._namespaceURI,parentTag=hostContainerInfo._tag),(null==namespaceURI||namespaceURI===DOMNamespaces.svg&&"foreignobject"===parentTag)&&(namespaceURI=DOMNamespaces.html),namespaceURI===DOMNamespaces.html&&("svg"===this._tag?namespaceURI=DOMNamespaces.svg:"math"===this._tag&&(namespaceURI=DOMNamespaces.mathml)),this._namespaceURI=namespaceURI,"production"!==process.env.NODE_ENV){var parentInfo;null!=hostParent?parentInfo=hostParent._ancestorInfo:hostContainerInfo._tag&&(parentInfo=hostContainerInfo._ancestorInfo),parentInfo&&validateDOMNesting(this._tag,null,this,parentInfo),this._ancestorInfo=validateDOMNesting.updatedAncestorInfo(parentInfo,this._tag,this)}var mountImage;if(transaction.useCreateElement){var el,ownerDocument=hostContainerInfo._ownerDocument;if(namespaceURI===DOMNamespaces.html)if("script"===this._tag){var div=ownerDocument.createElement("div"),type=this._currentElement.type;div.innerHTML="<"+type+"></"+type+">",el=div.removeChild(div.firstChild)}else el=props.is?ownerDocument.createElement(this._currentElement.type,props.is):ownerDocument.createElement(this._currentElement.type);else el=ownerDocument.createElementNS(namespaceURI,this._currentElement.type);ReactDOMComponentTree.precacheNode(this,el),this._flags|=Flags.hasCachedChildNodes,this._hostParent||DOMPropertyOperations.setAttributeForRoot(el),this._updateDOMProperties(null,props,transaction);var lazyTree=DOMLazyTree(el);this._createInitialChildren(transaction,props,context,lazyTree),mountImage=lazyTree}else{var tagOpen=this._createOpenTagMarkupAndPutListeners(transaction,props),tagContent=this._createContentMarkup(transaction,props,context);mountImage=!tagContent&&omittedCloseTags[this._tag]?tagOpen+"/>":tagOpen+">"+tagContent+"</"+this._currentElement.type+">"}switch(this._tag){case"input":transaction.getReactMountReady().enqueue(inputPostMount,this),props.autoFocus&&transaction.getReactMountReady().enqueue(AutoFocusUtils.focusDOMComponent,this);break;case"textarea":transaction.getReactMountReady().enqueue(textareaPostMount,this),props.autoFocus&&transaction.getReactMountReady().enqueue(AutoFocusUtils.focusDOMComponent,this);break;case"select":case"button":props.autoFocus&&transaction.getReactMountReady().enqueue(AutoFocusUtils.focusDOMComponent,this);break;case"option":transaction.getReactMountReady().enqueue(optionPostMount,this)}return mountImage},_createOpenTagMarkupAndPutListeners:function(transaction,props){var ret="<"+this._currentElement.type;for(var propKey in props)if(props.hasOwnProperty(propKey)){var propValue=props[propKey];if(null!=propValue)if(registrationNameModules.hasOwnProperty(propKey))propValue&&enqueuePutListener(this,propKey,propValue,transaction);else{"style"===propKey&&(propValue&&("production"!==process.env.NODE_ENV&&(this._previousStyle=propValue),propValue=this._previousStyleCopy=_assign({},props.style)),propValue=CSSPropertyOperations.createMarkupForStyles(propValue,this));var markup=null;null!=this._tag&&isCustomComponent(this._tag,props)?RESERVED_PROPS.hasOwnProperty(propKey)||(markup=DOMPropertyOperations.createMarkupForCustomAttribute(propKey,propValue)):markup=DOMPropertyOperations.createMarkupForProperty(propKey,propValue),markup&&(ret+=" "+markup)}}return transaction.renderToStaticMarkup?ret:(this._hostParent||(ret+=" "+DOMPropertyOperations.createMarkupForRoot()),ret+=" "+DOMPropertyOperations.createMarkupForID(this._domID))},_createContentMarkup:function(transaction,props,context){var ret="",innerHTML=props.dangerouslySetInnerHTML;if(null!=innerHTML)null!=innerHTML.__html&&(ret=innerHTML.__html);else{var contentToUse=CONTENT_TYPES[typeof props.children]?props.children:null,childrenToUse=null!=contentToUse?null:props.children;if(null!=contentToUse)ret=escapeTextContentForBrowser(contentToUse),"production"!==process.env.NODE_ENV&&setAndValidateContentChildDev.call(this,contentToUse);else if(null!=childrenToUse){var mountImages=this.mountChildren(childrenToUse,transaction,context);ret=mountImages.join("")}}return newlineEatingTags[this._tag]&&"\n"===ret.charAt(0)?"\n"+ret:ret},_createInitialChildren:function(transaction,props,context,lazyTree){var innerHTML=props.dangerouslySetInnerHTML;if(null!=innerHTML)null!=innerHTML.__html&&DOMLazyTree.queueHTML(lazyTree,innerHTML.__html);else{var contentToUse=CONTENT_TYPES[typeof props.children]?props.children:null,childrenToUse=null!=contentToUse?null:props.children;if(null!=contentToUse)""!==contentToUse&&("production"!==process.env.NODE_ENV&&setAndValidateContentChildDev.call(this,contentToUse),DOMLazyTree.queueText(lazyTree,contentToUse));else if(null!=childrenToUse)for(var mountImages=this.mountChildren(childrenToUse,transaction,context),i=0;i<mountImages.length;i++)DOMLazyTree.queueChild(lazyTree,mountImages[i])}},receiveComponent:function(nextElement,transaction,context){var prevElement=this._currentElement;this._currentElement=nextElement,this.updateComponent(transaction,prevElement,nextElement,context)},updateComponent:function(transaction,prevElement,nextElement,context){var lastProps=prevElement.props,nextProps=this._currentElement.props;switch(this._tag){case"input":lastProps=ReactDOMInput.getHostProps(this,lastProps),nextProps=ReactDOMInput.getHostProps(this,nextProps);break;case"option":lastProps=ReactDOMOption.getHostProps(this,lastProps),nextProps=ReactDOMOption.getHostProps(this,nextProps);break;case"select":lastProps=ReactDOMSelect.getHostProps(this,lastProps),nextProps=ReactDOMSelect.getHostProps(this,nextProps);break;case"textarea":lastProps=ReactDOMTextarea.getHostProps(this,lastProps),nextProps=ReactDOMTextarea.getHostProps(this,nextProps)}switch(assertValidProps(this,nextProps),this._updateDOMProperties(lastProps,nextProps,transaction),this._updateDOMChildren(lastProps,nextProps,transaction,context),this._tag){case"input":ReactDOMInput.updateWrapper(this);break;case"textarea":ReactDOMTextarea.updateWrapper(this);break;case"select":transaction.getReactMountReady().enqueue(postUpdateSelectWrapper,this)}},_updateDOMProperties:function(lastProps,nextProps,transaction){var propKey,styleName,styleUpdates;for(propKey in lastProps)if(!nextProps.hasOwnProperty(propKey)&&lastProps.hasOwnProperty(propKey)&&null!=lastProps[propKey])if("style"===propKey){var lastStyle=this._previousStyleCopy;for(styleName in lastStyle)lastStyle.hasOwnProperty(styleName)&&(styleUpdates=styleUpdates||{},styleUpdates[styleName]="");this._previousStyleCopy=null}else registrationNameModules.hasOwnProperty(propKey)?lastProps[propKey]&&deleteListener(this,propKey):isCustomComponent(this._tag,lastProps)?RESERVED_PROPS.hasOwnProperty(propKey)||DOMPropertyOperations.deleteValueForAttribute(getNode(this),propKey):(DOMProperty.properties[propKey]||DOMProperty.isCustomAttribute(propKey))&&DOMPropertyOperations.deleteValueForProperty(getNode(this),propKey);for(propKey in nextProps){var nextProp=nextProps[propKey],lastProp="style"===propKey?this._previousStyleCopy:null!=lastProps?lastProps[propKey]:void 0;if(nextProps.hasOwnProperty(propKey)&&nextProp!==lastProp&&(null!=nextProp||null!=lastProp))if("style"===propKey)if(nextProp?("production"!==process.env.NODE_ENV&&(checkAndWarnForMutatedStyle(this._previousStyleCopy,this._previousStyle,this),this._previousStyle=nextProp),nextProp=this._previousStyleCopy=_assign({},nextProp)):this._previousStyleCopy=null,lastProp){for(styleName in lastProp)!lastProp.hasOwnProperty(styleName)||nextProp&&nextProp.hasOwnProperty(styleName)||(styleUpdates=styleUpdates||{},styleUpdates[styleName]="");for(styleName in nextProp)nextProp.hasOwnProperty(styleName)&&lastProp[styleName]!==nextProp[styleName]&&(styleUpdates=styleUpdates||{},styleUpdates[styleName]=nextProp[styleName])}else styleUpdates=nextProp;else if(registrationNameModules.hasOwnProperty(propKey))nextProp?enqueuePutListener(this,propKey,nextProp,transaction):lastProp&&deleteListener(this,propKey);else if(isCustomComponent(this._tag,nextProps))RESERVED_PROPS.hasOwnProperty(propKey)||DOMPropertyOperations.setValueForAttribute(getNode(this),propKey,nextProp);else if(DOMProperty.properties[propKey]||DOMProperty.isCustomAttribute(propKey)){var node=getNode(this);null!=nextProp?DOMPropertyOperations.setValueForProperty(node,propKey,nextProp):DOMPropertyOperations.deleteValueForProperty(node,propKey)}}styleUpdates&&CSSPropertyOperations.setValueForStyles(getNode(this),styleUpdates,this)},_updateDOMChildren:function(lastProps,nextProps,transaction,context){var lastContent=CONTENT_TYPES[typeof lastProps.children]?lastProps.children:null,nextContent=CONTENT_TYPES[typeof nextProps.children]?nextProps.children:null,lastHtml=lastProps.dangerouslySetInnerHTML&&lastProps.dangerouslySetInnerHTML.__html,nextHtml=nextProps.dangerouslySetInnerHTML&&nextProps.dangerouslySetInnerHTML.__html,lastChildren=null!=lastContent?null:lastProps.children,nextChildren=null!=nextContent?null:nextProps.children,lastHasContentOrHtml=null!=lastContent||null!=lastHtml,nextHasContentOrHtml=null!=nextContent||null!=nextHtml;null!=lastChildren&&null==nextChildren?this.updateChildren(null,transaction,context):lastHasContentOrHtml&&!nextHasContentOrHtml&&(this.updateTextContent(""),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onSetChildren(this._debugID,[])),null!=nextContent?lastContent!==nextContent&&(this.updateTextContent(""+nextContent),"production"!==process.env.NODE_ENV&&setAndValidateContentChildDev.call(this,nextContent)):null!=nextHtml?(lastHtml!==nextHtml&&this.updateMarkup(""+nextHtml),"production"!==process.env.NODE_ENV&&ReactInstrumentation.debugTool.onSetChildren(this._debugID,[])):null!=nextChildren&&("production"!==process.env.NODE_ENV&&setAndValidateContentChildDev.call(this,null),this.updateChildren(nextChildren,transaction,context))},getHostNode:function(){return getNode(this)},unmountComponent:function(safely){switch(this._tag){case"audio":case"form":case"iframe":case"img":case"link":case"object":case"source":case"video":var listeners=this._wrapperState.listeners;if(listeners)for(var i=0;i<listeners.length;i++)listeners[i].remove();break;case"input":case"textarea":inputValueTracking.stopTracking(this);break;case"html":case"head":case"body":"production"!==process.env.NODE_ENV?invariant(!1,"<%s> tried to unmount. Because of cross-browser quirks it is impossible to unmount some top-level components (eg <html>, <head>, and <body>) reliably and efficiently. To fix this, have a single top-level component that never unmounts render these elements.",this._tag):_prodInvariant("66",this._tag)}this.unmountChildren(safely),ReactDOMComponentTree.uncacheNode(this),EventPluginHub.deleteAllListeners(this),this._rootNodeID=0,this._domID=0,this._wrapperState=null,"production"!==process.env.NODE_ENV&&setAndValidateContentChildDev.call(this,null)},getPublicInstance:function(){return getNode(this)}},_assign(ReactDOMComponent.prototype,ReactDOMComponent.Mixin,ReactMultiChild.Mixin),module.exports=ReactDOMComponent}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function ReactDOMContainerInfo(topLevelWrapper,node){var info={_topLevelWrapper:topLevelWrapper,_idCounter:1,_ownerDocument:node?node.nodeType===DOC_NODE_TYPE?node:node.ownerDocument:null,_node:node,_tag:node?node.nodeName.toLowerCase():null,_namespaceURI:node?node.namespaceURI:null};return"production"!==process.env.NODE_ENV&&(info._ancestorInfo=node?validateDOMNesting.updatedAncestorInfo(null,info._tag,null):null),info}var validateDOMNesting=__webpack_require__(68),DOC_NODE_TYPE=9;module.exports=ReactDOMContainerInfo}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var _assign=__webpack_require__(7),DOMLazyTree=__webpack_require__(26),ReactDOMComponentTree=__webpack_require__(8),ReactDOMEmptyComponent=function(instantiate){this._currentElement=null,this._hostNode=null,this._hostParent=null,this._hostContainerInfo=null,this._domID=0};_assign(ReactDOMEmptyComponent.prototype,{mountComponent:function(transaction,hostParent,hostContainerInfo,context){var domID=hostContainerInfo._idCounter++;this._domID=domID,this._hostParent=hostParent,this._hostContainerInfo=hostContainerInfo;var nodeValue=" react-empty: "+this._domID+" ";if(transaction.useCreateElement){var ownerDocument=hostContainerInfo._ownerDocument,node=ownerDocument.createComment(nodeValue);return ReactDOMComponentTree.precacheNode(this,node),DOMLazyTree(node)}return transaction.renderToStaticMarkup?"":"\x3c!--"+nodeValue+"--\x3e"},receiveComponent:function(){},getHostNode:function(){return ReactDOMComponentTree.getNodeFromInstance(this)},unmountComponent:function(){ReactDOMComponentTree.uncacheNode(this)}}),module.exports=ReactDOMEmptyComponent},function(module,exports,__webpack_require__){"use strict";var ReactDOMFeatureFlags={useCreateElement:!0,useFiber:!1};module.exports=ReactDOMFeatureFlags},function(module,exports,__webpack_require__){"use strict";var DOMChildrenOperations=__webpack_require__(54),ReactDOMComponentTree=__webpack_require__(8),ReactDOMIDOperations={dangerouslyProcessChildrenUpdates:function(parentInst,updates){var node=ReactDOMComponentTree.getNodeFromInstance(parentInst);DOMChildrenOperations.processUpdates(node,updates)}};module.exports=ReactDOMIDOperations},function(module,exports,__webpack_require__){"use strict";(function(process){function forceUpdateIfMounted(){this._rootNodeID&&ReactDOMInput.updateWrapper(this)}function isControlled(props){return"checkbox"===props.type||"radio"===props.type?null!=props.checked:null!=props.value}function _handleChange(event){var props=this._currentElement.props,returnValue=LinkedValueUtils.executeOnChange(props,event);ReactUpdates.asap(forceUpdateIfMounted,this);var name=props.name;if("radio"===props.type&&null!=name){for(var rootNode=ReactDOMComponentTree.getNodeFromInstance(this),queryRoot=rootNode;queryRoot.parentNode;)queryRoot=queryRoot.parentNode;for(var group=queryRoot.querySelectorAll("input[name="+JSON.stringify(""+name)+'][type="radio"]'),i=0;i<group.length;i++){var otherNode=group[i];if(otherNode!==rootNode&&otherNode.form===rootNode.form){var otherInstance=ReactDOMComponentTree.getInstanceFromNode(otherNode);otherInstance||("production"!==process.env.NODE_ENV?invariant(!1,"ReactDOMInput: Mixing React and non-React radio inputs with the same `name` is not supported."):_prodInvariant("90")),ReactUpdates.asap(forceUpdateIfMounted,otherInstance)}}}return returnValue}var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),DOMPropertyOperations=__webpack_require__(104),LinkedValueUtils=__webpack_require__(58),ReactDOMComponentTree=__webpack_require__(8),ReactUpdates=__webpack_require__(17),invariant=__webpack_require__(1),warning=__webpack_require__(2),didWarnValueLink=!1,didWarnCheckedLink=!1,didWarnValueDefaultValue=!1,didWarnCheckedDefaultChecked=!1,didWarnControlledToUncontrolled=!1,didWarnUncontrolledToControlled=!1,ReactDOMInput={getHostProps:function(inst,props){var value=LinkedValueUtils.getValue(props),checked=LinkedValueUtils.getChecked(props);return _assign({type:void 0,step:void 0,min:void 0,max:void 0},props,{defaultChecked:void 0,defaultValue:void 0,value:null!=value?value:inst._wrapperState.initialValue,checked:null!=checked?checked:inst._wrapperState.initialChecked,onChange:inst._wrapperState.onChange})},mountWrapper:function(inst,props){if("production"!==process.env.NODE_ENV){LinkedValueUtils.checkPropTypes("input",props,inst._currentElement._owner);var owner=inst._currentElement._owner;void 0===props.valueLink||didWarnValueLink||("production"!==process.env.NODE_ENV&&warning(!1,"`valueLink` prop on `input` is deprecated; set `value` and `onChange` instead."),didWarnValueLink=!0),void 0===props.checkedLink||didWarnCheckedLink||("production"!==process.env.NODE_ENV&&warning(!1,"`checkedLink` prop on `input` is deprecated; set `value` and `onChange` instead."),didWarnCheckedLink=!0),void 0===props.checked||void 0===props.defaultChecked||didWarnCheckedDefaultChecked||("production"!==process.env.NODE_ENV&&warning(!1,"%s contains an input of type %s with both checked and defaultChecked props. Input elements must be either controlled or uncontrolled (specify either the checked prop, or the defaultChecked prop, but not both). Decide between using a controlled or uncontrolled input element and remove one of these props. More info: https://fb.me/react-controlled-components",owner&&owner.getName()||"A component",props.type),didWarnCheckedDefaultChecked=!0),void 0===props.value||void 0===props.defaultValue||didWarnValueDefaultValue||("production"!==process.env.NODE_ENV&&warning(!1,"%s contains an input of type %s with both value and defaultValue props. Input elements must be either controlled or uncontrolled (specify either the value prop, or the defaultValue prop, but not both). Decide between using a controlled or uncontrolled input element and remove one of these props. More info: https://fb.me/react-controlled-components",owner&&owner.getName()||"A component",props.type),didWarnValueDefaultValue=!0)}var defaultValue=props.defaultValue;inst._wrapperState={initialChecked:null!=props.checked?props.checked:props.defaultChecked,initialValue:null!=props.value?props.value:defaultValue,listeners:null,onChange:_handleChange.bind(inst),controlled:isControlled(props)}},updateWrapper:function(inst){var props=inst._currentElement.props;if("production"!==process.env.NODE_ENV){var controlled=isControlled(props),owner=inst._currentElement._owner;inst._wrapperState.controlled||!controlled||didWarnUncontrolledToControlled||("production"!==process.env.NODE_ENV&&warning(!1,"%s is changing an uncontrolled input of type %s to be controlled. Input elements should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component. More info: https://fb.me/react-controlled-components",owner&&owner.getName()||"A component",props.type),didWarnUncontrolledToControlled=!0),!inst._wrapperState.controlled||controlled||didWarnControlledToUncontrolled||("production"!==process.env.NODE_ENV&&warning(!1,"%s is changing a controlled input of type %s to be uncontrolled. Input elements should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component. More info: https://fb.me/react-controlled-components",owner&&owner.getName()||"A component",props.type),didWarnControlledToUncontrolled=!0)}var checked=props.checked;null!=checked&&DOMPropertyOperations.setValueForProperty(ReactDOMComponentTree.getNodeFromInstance(inst),"checked",checked||!1);var node=ReactDOMComponentTree.getNodeFromInstance(inst),value=LinkedValueUtils.getValue(props);if(null!=value)if(0===value&&""===node.value)node.value="0";else if("number"===props.type){var valueAsNumber=parseFloat(node.value,10)||0;(value!=valueAsNumber||value==valueAsNumber&&node.value!=value)&&(node.value=""+value)}else node.value!==""+value&&(node.value=""+value);else null==props.value&&null!=props.defaultValue&&node.defaultValue!==""+props.defaultValue&&(node.defaultValue=""+props.defaultValue),null==props.checked&&null!=props.defaultChecked&&(node.defaultChecked=!!props.defaultChecked)},postMountWrapper:function(inst){var props=inst._currentElement.props,node=ReactDOMComponentTree.getNodeFromInstance(inst);switch(props.type){case"submit":case"reset":break;case"color":case"date":case"datetime":case"datetime-local":case"month":case"time":case"week":node.value="",node.value=node.defaultValue;break;default:node.value=node.value}var name=node.name;""!==name&&(node.name=""),node.defaultChecked=!node.defaultChecked,node.defaultChecked=!node.defaultChecked,""!==name&&(node.name=name)}};module.exports=ReactDOMInput}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function validateProperty(tagName,name,debugID){if(warnedProperties.hasOwnProperty(name)&&warnedProperties[name])return!0;if(rARIA.test(name)){var lowerCasedName=name.toLowerCase(),standardName=DOMProperty.getPossibleStandardName.hasOwnProperty(lowerCasedName)?DOMProperty.getPossibleStandardName[lowerCasedName]:null;if(null==standardName)return warnedProperties[name]=!0,!1;if(name!==standardName)return"production"!==process.env.NODE_ENV&&warning(!1,"Unknown ARIA attribute %s. Did you mean %s?%s",name,standardName,ReactComponentTreeHook.getStackAddendumByID(debugID)),warnedProperties[name]=!0,!0}return!0}function warnInvalidARIAProps(debugID,element){var invalidProps=[];for(var key in element.props){validateProperty(element.type,key,debugID)||invalidProps.push(key)}var unknownPropString=invalidProps.map(function(prop){return"`"+prop+"`"}).join(", ");1===invalidProps.length?"production"!==process.env.NODE_ENV&&warning(!1,"Invalid aria prop %s on <%s> tag. For details, see https://fb.me/invalid-aria-prop%s",unknownPropString,element.type,ReactComponentTreeHook.getStackAddendumByID(debugID)):invalidProps.length>1&&"production"!==process.env.NODE_ENV&&warning(!1,"Invalid aria props %s on <%s> tag. For details, see https://fb.me/invalid-aria-prop%s",unknownPropString,element.type,ReactComponentTreeHook.getStackAddendumByID(debugID))}function handleElement(debugID,element){null!=element&&"string"==typeof element.type&&(element.type.indexOf("-")>=0||element.props.is||warnInvalidARIAProps(debugID,element))}var DOMProperty=__webpack_require__(21),ReactComponentTreeHook=__webpack_require__(11),warning=__webpack_require__(2),warnedProperties={},rARIA=new RegExp("^(aria)-["+DOMProperty.ATTRIBUTE_NAME_CHAR+"]*$"),ReactDOMInvalidARIAHook={onBeforeMountComponent:function(debugID,element){"production"!==process.env.NODE_ENV&&handleElement(debugID,element)},onBeforeUpdateComponent:function(debugID,element){"production"!==process.env.NODE_ENV&&handleElement(debugID,element)}};module.exports=ReactDOMInvalidARIAHook}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function handleElement(debugID,element){null!=element&&("input"!==element.type&&"textarea"!==element.type&&"select"!==element.type||null==element.props||null!==element.props.value||didWarnValueNull||("production"!==process.env.NODE_ENV&&warning(!1,"`value` prop on `%s` should not be null. Consider using the empty string to clear the component or `undefined` for uncontrolled components.%s",element.type,ReactComponentTreeHook.getStackAddendumByID(debugID)),didWarnValueNull=!0))}var ReactComponentTreeHook=__webpack_require__(11),warning=__webpack_require__(2),didWarnValueNull=!1,ReactDOMNullInputValuePropHook={onBeforeMountComponent:function(debugID,element){handleElement(debugID,element)},onBeforeUpdateComponent:function(debugID,element){handleElement(debugID,element)}};module.exports=ReactDOMNullInputValuePropHook}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function flattenChildren(children){var content="";return React.Children.forEach(children,function(child){null!=child&&("string"==typeof child||"number"==typeof child?content+=child:didWarnInvalidOptionChildren||(didWarnInvalidOptionChildren=!0,"production"!==process.env.NODE_ENV&&warning(!1,"Only strings and numbers are supported as <option> children.")))}),content}var _assign=__webpack_require__(7),React=__webpack_require__(28),ReactDOMComponentTree=__webpack_require__(8),ReactDOMSelect=__webpack_require__(106),warning=__webpack_require__(2),didWarnInvalidOptionChildren=!1,ReactDOMOption={mountWrapper:function(inst,props,hostParent){"production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(null==props.selected,"Use the `defaultValue` or `value` props on <select> instead of setting `selected` on <option>.");var selectValue=null;if(null!=hostParent){var selectParent=hostParent;"optgroup"===selectParent._tag&&(selectParent=selectParent._hostParent),null!=selectParent&&"select"===selectParent._tag&&(selectValue=ReactDOMSelect.getSelectValueContext(selectParent))}var selected=null;if(null!=selectValue){var value;if(value=null!=props.value?props.value+"":flattenChildren(props.children),selected=!1,Array.isArray(selectValue)){for(var i=0;i<selectValue.length;i++)if(""+selectValue[i]===value){selected=!0;break}}else selected=""+selectValue===value}inst._wrapperState={selected:selected}},postMountWrapper:function(inst){var props=inst._currentElement.props;if(null!=props.value){ReactDOMComponentTree.getNodeFromInstance(inst).setAttribute("value",props.value)}},getHostProps:function(inst,props){var hostProps=_assign({selected:void 0,children:void 0},props);null!=inst._wrapperState.selected&&(hostProps.selected=inst._wrapperState.selected);var content=flattenChildren(props.children);return content&&(hostProps.children=content),hostProps}};module.exports=ReactDOMOption}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function isCollapsed(anchorNode,anchorOffset,focusNode,focusOffset){return anchorNode===focusNode&&anchorOffset===focusOffset}function getIEOffsets(node){var selection=document.selection,selectedRange=selection.createRange(),selectedLength=selectedRange.text.length,fromStart=selectedRange.duplicate();fromStart.moveToElementText(node),fromStart.setEndPoint("EndToStart",selectedRange);var startOffset=fromStart.text.length;return{start:startOffset,end:startOffset+selectedLength}}function getModernOffsets(node){var selection=window.getSelection&&window.getSelection();if(!selection||0===selection.rangeCount)return null;var anchorNode=selection.anchorNode,anchorOffset=selection.anchorOffset,focusNode=selection.focusNode,focusOffset=selection.focusOffset,currentRange=selection.getRangeAt(0);try{currentRange.startContainer.nodeType,currentRange.endContainer.nodeType}catch(e){return null}var isSelectionCollapsed=isCollapsed(selection.anchorNode,selection.anchorOffset,selection.focusNode,selection.focusOffset),rangeLength=isSelectionCollapsed?0:currentRange.toString().length,tempRange=currentRange.cloneRange();tempRange.selectNodeContents(node),tempRange.setEnd(currentRange.startContainer,currentRange.startOffset);var isTempRangeCollapsed=isCollapsed(tempRange.startContainer,tempRange.startOffset,tempRange.endContainer,tempRange.endOffset),start=isTempRangeCollapsed?0:tempRange.toString().length,end=start+rangeLength,detectionRange=document.createRange();detectionRange.setStart(anchorNode,anchorOffset),detectionRange.setEnd(focusNode,focusOffset);var isBackward=detectionRange.collapsed;return{start:isBackward?end:start,end:isBackward?start:end}}function setIEOffsets(node,offsets){var start,end,range=document.selection.createRange().duplicate();void 0===offsets.end?(start=offsets.start,end=start):offsets.start>offsets.end?(start=offsets.end,end=offsets.start):(start=offsets.start,end=offsets.end),range.moveToElementText(node),range.moveStart("character",start),range.setEndPoint("EndToStart",range),range.moveEnd("character",end-start),range.select()}function setModernOffsets(node,offsets){if(window.getSelection){var selection=window.getSelection(),length=node[getTextContentAccessor()].length,start=Math.min(offsets.start,length),end=void 0===offsets.end?start:Math.min(offsets.end,length);if(!selection.extend&&start>end){var temp=end;end=start,start=temp}var startMarker=getNodeForCharacterOffset(node,start),endMarker=getNodeForCharacterOffset(node,end);if(startMarker&&endMarker){var range=document.createRange();range.setStart(startMarker.node,startMarker.offset),selection.removeAllRanges(),start>end?(selection.addRange(range),selection.extend(endMarker.node,endMarker.offset)):(range.setEnd(endMarker.node,endMarker.offset),selection.addRange(range))}}}var ExecutionEnvironment=__webpack_require__(9),getNodeForCharacterOffset=__webpack_require__(294),getTextContentAccessor=__webpack_require__(118),useIEOffsets=ExecutionEnvironment.canUseDOM&&"selection"in document&&!("getSelection"in window),ReactDOMSelection={getOffsets:useIEOffsets?getIEOffsets:getModernOffsets,setOffsets:useIEOffsets?setIEOffsets:setModernOffsets};module.exports=ReactDOMSelection},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),DOMChildrenOperations=__webpack_require__(54),DOMLazyTree=__webpack_require__(26),ReactDOMComponentTree=__webpack_require__(8),escapeTextContentForBrowser=__webpack_require__(43),invariant=__webpack_require__(1),validateDOMNesting=__webpack_require__(68),ReactDOMTextComponent=function(text){this._currentElement=text,this._stringText=""+text,this._hostNode=null,this._hostParent=null,this._domID=0,this._mountIndex=0,this._closingComment=null,this._commentNodes=null};_assign(ReactDOMTextComponent.prototype,{mountComponent:function(transaction,hostParent,hostContainerInfo,context){if("production"!==process.env.NODE_ENV){var parentInfo;null!=hostParent?parentInfo=hostParent._ancestorInfo:null!=hostContainerInfo&&(parentInfo=hostContainerInfo._ancestorInfo),parentInfo&&validateDOMNesting(null,this._stringText,this,parentInfo)}var domID=hostContainerInfo._idCounter++,openingValue=" react-text: "+domID+" ";if(this._domID=domID,this._hostParent=hostParent,transaction.useCreateElement){var ownerDocument=hostContainerInfo._ownerDocument,openingComment=ownerDocument.createComment(openingValue),closingComment=ownerDocument.createComment(" /react-text "),lazyTree=DOMLazyTree(ownerDocument.createDocumentFragment());return DOMLazyTree.queueChild(lazyTree,DOMLazyTree(openingComment)),this._stringText&&DOMLazyTree.queueChild(lazyTree,DOMLazyTree(ownerDocument.createTextNode(this._stringText))),DOMLazyTree.queueChild(lazyTree,DOMLazyTree(closingComment)),ReactDOMComponentTree.precacheNode(this,openingComment),this._closingComment=closingComment,lazyTree}var escapedText=escapeTextContentForBrowser(this._stringText);return transaction.renderToStaticMarkup?escapedText:"\x3c!--"+openingValue+"--\x3e"+escapedText+"\x3c!-- /react-text --\x3e"},receiveComponent:function(nextText,transaction){if(nextText!==this._currentElement){this._currentElement=nextText;var nextStringText=""+nextText;if(nextStringText!==this._stringText){this._stringText=nextStringText;var commentNodes=this.getHostNode();DOMChildrenOperations.replaceDelimitedText(commentNodes[0],commentNodes[1],nextStringText)}}},getHostNode:function(){var hostNode=this._commentNodes;if(hostNode)return hostNode;if(!this._closingComment)for(var openingComment=ReactDOMComponentTree.getNodeFromInstance(this),node=openingComment.nextSibling;;){if(null==node&&("production"!==process.env.NODE_ENV?invariant(!1,"Missing closing comment for text component %s",this._domID):_prodInvariant("67",this._domID)),8===node.nodeType&&" /react-text "===node.nodeValue){this._closingComment=node;break}node=node.nextSibling}return hostNode=[this._hostNode,this._closingComment],this._commentNodes=hostNode,hostNode},unmountComponent:function(){this._closingComment=null,this._commentNodes=null,ReactDOMComponentTree.uncacheNode(this)}}),module.exports=ReactDOMTextComponent}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function forceUpdateIfMounted(){this._rootNodeID&&ReactDOMTextarea.updateWrapper(this)}function _handleChange(event){var props=this._currentElement.props,returnValue=LinkedValueUtils.executeOnChange(props,event);return ReactUpdates.asap(forceUpdateIfMounted,this),returnValue}var _prodInvariant=__webpack_require__(4),_assign=__webpack_require__(7),LinkedValueUtils=__webpack_require__(58),ReactDOMComponentTree=__webpack_require__(8),ReactUpdates=__webpack_require__(17),invariant=__webpack_require__(1),warning=__webpack_require__(2),didWarnValueLink=!1,didWarnValDefaultVal=!1,ReactDOMTextarea={getHostProps:function(inst,props){return null!=props.dangerouslySetInnerHTML&&("production"!==process.env.NODE_ENV?invariant(!1,"`dangerouslySetInnerHTML` does not make sense on <textarea>."):_prodInvariant("91")),_assign({},props,{value:void 0,defaultValue:void 0,children:""+inst._wrapperState.initialValue,onChange:inst._wrapperState.onChange})},mountWrapper:function(inst,props){"production"!==process.env.NODE_ENV&&(LinkedValueUtils.checkPropTypes("textarea",props,inst._currentElement._owner),void 0===props.valueLink||didWarnValueLink||("production"!==process.env.NODE_ENV&&warning(!1,"`valueLink` prop on `textarea` is deprecated; set `value` and `onChange` instead."),didWarnValueLink=!0),void 0===props.value||void 0===props.defaultValue||didWarnValDefaultVal||("production"!==process.env.NODE_ENV&&warning(!1,"Textarea elements must be either controlled or uncontrolled (specify either the value prop, or the defaultValue prop, but not both). Decide between using a controlled or uncontrolled textarea and remove one of these props. More info: https://fb.me/react-controlled-components"),didWarnValDefaultVal=!0));var value=LinkedValueUtils.getValue(props),initialValue=value;if(null==value){var defaultValue=props.defaultValue,children=props.children;null!=children&&("production"!==process.env.NODE_ENV&&"production"!==process.env.NODE_ENV&&warning(!1,"Use the `defaultValue` or `value` props instead of setting children on <textarea>."),null!=defaultValue&&("production"!==process.env.NODE_ENV?invariant(!1,"If you supply `defaultValue` on a <textarea>, do not pass children."):_prodInvariant("92")),Array.isArray(children)&&(children.length<=1||("production"!==process.env.NODE_ENV?invariant(!1,"<textarea> can only have at most one child."):_prodInvariant("93")),children=children[0]),defaultValue=""+children),null==defaultValue&&(defaultValue=""),initialValue=defaultValue}inst._wrapperState={initialValue:""+initialValue,listeners:null,onChange:_handleChange.bind(inst)}},updateWrapper:function(inst){var props=inst._currentElement.props,node=ReactDOMComponentTree.getNodeFromInstance(inst),value=LinkedValueUtils.getValue(props);if(null!=value){var newValue=""+value;newValue!==node.value&&(node.value=newValue),null==props.defaultValue&&(node.defaultValue=newValue)}null!=props.defaultValue&&(node.defaultValue=props.defaultValue)},postMountWrapper:function(inst){var node=ReactDOMComponentTree.getNodeFromInstance(inst),textContent=node.textContent;textContent===inst._wrapperState.initialValue&&(node.value=textContent)}};module.exports=ReactDOMTextarea}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function getLowestCommonAncestor(instA,instB){"_hostNode"in instA||("production"!==process.env.NODE_ENV?invariant(!1,"getNodeFromInstance: Invalid argument."):_prodInvariant("33")),"_hostNode"in instB||("production"!==process.env.NODE_ENV?invariant(!1,"getNodeFromInstance: Invalid argument."):_prodInvariant("33"));for(var depthA=0,tempA=instA;tempA;tempA=tempA._hostParent)depthA++;for(var depthB=0,tempB=instB;tempB;tempB=tempB._hostParent)depthB++;for(;depthA-depthB>0;)instA=instA._hostParent,depthA--;for(;depthB-depthA>0;)instB=instB._hostParent,depthB--;for(var depth=depthA;depth--;){if(instA===instB)return instA;instA=instA._hostParent,instB=instB._hostParent}return null}function isAncestor(instA,instB){"_hostNode"in instA||("production"!==process.env.NODE_ENV?invariant(!1,"isAncestor: Invalid argument."):_prodInvariant("35")),"_hostNode"in instB||("production"!==process.env.NODE_ENV?invariant(!1,"isAncestor: Invalid argument."):_prodInvariant("35"));for(;instB;){if(instB===instA)return!0;instB=instB._hostParent}return!1}function getParentInstance(inst){return"_hostNode"in inst||("production"!==process.env.NODE_ENV?invariant(!1,"getParentInstance: Invalid argument."):_prodInvariant("36")),inst._hostParent}function traverseTwoPhase(inst,fn,arg){for(var path=[];inst;)path.push(inst),inst=inst._hostParent;var i;for(i=path.length;i-- >0;)fn(path[i],"captured",arg);for(i=0;i<path.length;i++)fn(path[i],"bubbled",arg)}function traverseEnterLeave(from,to,fn,argFrom,argTo){for(var common=from&&to?getLowestCommonAncestor(from,to):null,pathFrom=[];from&&from!==common;)pathFrom.push(from),from=from._hostParent;for(var pathTo=[];to&&to!==common;)pathTo.push(to),to=to._hostParent;var i;for(i=0;i<pathFrom.length;i++)fn(pathFrom[i],"bubbled",argFrom);for(i=pathTo.length;i-- >0;)fn(pathTo[i],"captured",argTo)}var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1);module.exports={isAncestor:isAncestor,getLowestCommonAncestor:getLowestCommonAncestor,getParentInstance:getParentInstance,traverseTwoPhase:traverseTwoPhase,traverseEnterLeave:traverseEnterLeave}}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function handleElement(debugID,element){null!=element&&"string"==typeof element.type&&(element.type.indexOf("-")>=0||element.props.is||warnUnknownProperties(debugID,element))}var DOMProperty=__webpack_require__(21),EventPluginRegistry=__webpack_require__(39),ReactComponentTreeHook=__webpack_require__(11),warning=__webpack_require__(2);if("production"!==process.env.NODE_ENV)var reactProps={children:!0,dangerouslySetInnerHTML:!0,key:!0,ref:!0,autoFocus:!0,defaultValue:!0,valueLink:!0,defaultChecked:!0,checkedLink:!0,innerHTML:!0,suppressContentEditableWarning:!0,onFocusIn:!0,onFocusOut:!0},warnedProperties={},validateProperty=function(tagName,name,debugID){if(DOMProperty.properties.hasOwnProperty(name)||DOMProperty.isCustomAttribute(name))return!0;if(reactProps.hasOwnProperty(name)&&reactProps[name]||warnedProperties.hasOwnProperty(name)&&warnedProperties[name])return!0;if(EventPluginRegistry.registrationNameModules.hasOwnProperty(name))return!0;warnedProperties[name]=!0;var lowerCasedName=name.toLowerCase(),standardName=DOMProperty.isCustomAttribute(lowerCasedName)?lowerCasedName:DOMProperty.getPossibleStandardName.hasOwnProperty(lowerCasedName)?DOMProperty.getPossibleStandardName[lowerCasedName]:null,registrationName=EventPluginRegistry.possibleRegistrationNames.hasOwnProperty(lowerCasedName)?EventPluginRegistry.possibleRegistrationNames[lowerCasedName]:null;return null!=standardName?("production"!==process.env.NODE_ENV&&warning(!1,"Unknown DOM property %s. Did you mean %s?%s",name,standardName,ReactComponentTreeHook.getStackAddendumByID(debugID)),!0):null!=registrationName&&("production"!==process.env.NODE_ENV&&warning(!1,"Unknown event handler property %s. Did you mean `%s`?%s",name,registrationName,ReactComponentTreeHook.getStackAddendumByID(debugID)),!0)};var warnUnknownProperties=function(debugID,element){var unknownProps=[];for(var key in element.props){validateProperty(element.type,key,debugID)||unknownProps.push(key)}var unknownPropString=unknownProps.map(function(prop){return"`"+prop+"`"}).join(", ");1===unknownProps.length?"production"!==process.env.NODE_ENV&&warning(!1,"Unknown prop %s on <%s> tag. Remove this prop from the element. For details, see https://fb.me/react-unknown-prop%s",unknownPropString,element.type,ReactComponentTreeHook.getStackAddendumByID(debugID)):unknownProps.length>1&&"production"!==process.env.NODE_ENV&&warning(!1,"Unknown props %s on <%s> tag. Remove these props from the element. For details, see https://fb.me/react-unknown-prop%s",unknownPropString,element.type,ReactComponentTreeHook.getStackAddendumByID(debugID))},ReactDOMUnknownPropertyHook={onBeforeMountComponent:function(debugID,element){handleElement(debugID,element)},onBeforeUpdateComponent:function(debugID,element){handleElement(debugID,element)}};module.exports=ReactDOMUnknownPropertyHook}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function callHook(event,fn,context,arg1,arg2,arg3,arg4,arg5){try{fn.call(context,arg1,arg2,arg3,arg4,arg5)}catch(e){"production"!==process.env.NODE_ENV&&warning(didHookThrowForEvent[event],"Exception thrown by hook while handling %s: %s",event,e+"\n"+e.stack),didHookThrowForEvent[event]=!0}}function emitEvent(event,arg1,arg2,arg3,arg4,arg5){for(var i=0;i<hooks.length;i++){var hook=hooks[i],fn=hook[event];fn&&callHook(event,fn,hook,arg1,arg2,arg3,arg4,arg5)}}function clearHistory(){ReactComponentTreeHook.purgeUnmountedComponents(),ReactHostOperationHistoryHook.clearHistory()}function getTreeSnapshot(registeredIDs){return registeredIDs.reduce(function(tree,id){var ownerID=ReactComponentTreeHook.getOwnerID(id),parentID=ReactComponentTreeHook.getParentID(id);return tree[id]={displayName:ReactComponentTreeHook.getDisplayName(id),text:ReactComponentTreeHook.getText(id),updateCount:ReactComponentTreeHook.getUpdateCount(id),childIDs:ReactComponentTreeHook.getChildIDs(id),ownerID:ownerID||parentID&&ReactComponentTreeHook.getOwnerID(parentID)||0,parentID:parentID},tree},{})}function resetMeasurements(){var previousStartTime=currentFlushStartTime,previousMeasurements=currentFlushMeasurements,previousOperations=ReactHostOperationHistoryHook.getHistory();if(0===currentFlushNesting)return currentFlushStartTime=0,currentFlushMeasurements=[],void clearHistory();if(previousMeasurements.length||previousOperations.length){var registeredIDs=ReactComponentTreeHook.getRegisteredIDs();flushHistory.push({duration:performanceNow()-previousStartTime,measurements:previousMeasurements||[],operations:previousOperations||[],treeSnapshot:getTreeSnapshot(registeredIDs)})}clearHistory(),currentFlushStartTime=performanceNow(),currentFlushMeasurements=[]}function checkDebugID(debugID){arguments.length>1&&void 0!==arguments[1]&&arguments[1]&&0===debugID||debugID||"production"!==process.env.NODE_ENV&&warning(!1,"ReactDebugTool: debugID may not be empty.")}function beginLifeCycleTimer(debugID,timerType){0!==currentFlushNesting&&(currentTimerType&&!lifeCycleTimerHasWarned&&("production"!==process.env.NODE_ENV&&warning(!1,"There is an internal error in the React performance measurement code. Did not expect %s timer to start while %s timer is still in progress for %s instance.",timerType,currentTimerType||"no",debugID===currentTimerDebugID?"the same":"another"),lifeCycleTimerHasWarned=!0),currentTimerStartTime=performanceNow(),currentTimerNestedFlushDuration=0,currentTimerDebugID=debugID,currentTimerType=timerType)}function endLifeCycleTimer(debugID,timerType){0!==currentFlushNesting&&(currentTimerType===timerType||lifeCycleTimerHasWarned||("production"!==process.env.NODE_ENV&&warning(!1,"There is an internal error in the React performance measurement code. We did not expect %s timer to stop while %s timer is still in progress for %s instance. Please report this as a bug in React.",timerType,currentTimerType||"no",debugID===currentTimerDebugID?"the same":"another"),lifeCycleTimerHasWarned=!0),isProfiling&&currentFlushMeasurements.push({timerType:timerType,instanceID:debugID,duration:performanceNow()-currentTimerStartTime-currentTimerNestedFlushDuration}),currentTimerStartTime=0,currentTimerNestedFlushDuration=0,currentTimerDebugID=null,currentTimerType=null)}function pauseCurrentLifeCycleTimer(){var currentTimer={startTime:currentTimerStartTime,nestedFlushStartTime:performanceNow(),debugID:currentTimerDebugID,timerType:currentTimerType};lifeCycleTimerStack.push(currentTimer),currentTimerStartTime=0,currentTimerNestedFlushDuration=0,currentTimerDebugID=null,currentTimerType=null}function resumeCurrentLifeCycleTimer(){var _lifeCycleTimerStack$=lifeCycleTimerStack.pop(),startTime=_lifeCycleTimerStack$.startTime,nestedFlushStartTime=_lifeCycleTimerStack$.nestedFlushStartTime,debugID=_lifeCycleTimerStack$.debugID,timerType=_lifeCycleTimerStack$.timerType,nestedFlushDuration=performanceNow()-nestedFlushStartTime;currentTimerStartTime=startTime,currentTimerNestedFlushDuration+=nestedFlushDuration,currentTimerDebugID=debugID,currentTimerType=timerType}function shouldMark(debugID){if(!isProfiling||!canUsePerformanceMeasure)return!1;var element=ReactComponentTreeHook.getElement(debugID);return null!=element&&"object"==typeof element&&!("string"==typeof element.type)}function markBegin(debugID,markType){if(shouldMark(debugID)){var markName=debugID+"::"+markType;lastMarkTimeStamp=performanceNow(),performance.mark(markName)}}function markEnd(debugID,markType){if(shouldMark(debugID)){var markName=debugID+"::"+markType,displayName=ReactComponentTreeHook.getDisplayName(debugID)||"Unknown";if(performanceNow()-lastMarkTimeStamp>.1){var measurementName=displayName+" ["+markType+"]";performance.measure(measurementName,markName)}performance.clearMarks(markName),measurementName&&performance.clearMeasures(measurementName)}}var ReactInvalidSetStateWarningHook=__webpack_require__(264),ReactHostOperationHistoryHook=__webpack_require__(262),ReactComponentTreeHook=__webpack_require__(11),ExecutionEnvironment=__webpack_require__(9),performanceNow=__webpack_require__(201),warning=__webpack_require__(2),hooks=[],didHookThrowForEvent={},isProfiling=!1,flushHistory=[],lifeCycleTimerStack=[],currentFlushNesting=0,currentFlushMeasurements=[],currentFlushStartTime=0,currentTimerDebugID=null,currentTimerStartTime=0,currentTimerNestedFlushDuration=0,currentTimerType=null,lifeCycleTimerHasWarned=!1,lastMarkTimeStamp=0,canUsePerformanceMeasure="undefined"!=typeof performance&&"function"==typeof performance.mark&&"function"==typeof performance.clearMarks&&"function"==typeof performance.measure&&"function"==typeof performance.clearMeasures,ReactDebugTool={addHook:function(hook){hooks.push(hook)},removeHook:function(hook){for(var i=0;i<hooks.length;i++)hooks[i]===hook&&(hooks.splice(i,1),i--)},isProfiling:function(){return isProfiling},beginProfiling:function(){isProfiling||(isProfiling=!0,flushHistory.length=0,resetMeasurements(),ReactDebugTool.addHook(ReactHostOperationHistoryHook))},endProfiling:function(){isProfiling&&(isProfiling=!1,resetMeasurements(),ReactDebugTool.removeHook(ReactHostOperationHistoryHook))},getFlushHistory:function(){return flushHistory},onBeginFlush:function(){currentFlushNesting++,resetMeasurements(),pauseCurrentLifeCycleTimer(),emitEvent("onBeginFlush")},onEndFlush:function(){resetMeasurements(),currentFlushNesting--,resumeCurrentLifeCycleTimer(),emitEvent("onEndFlush")},onBeginLifeCycleTimer:function(debugID,timerType){checkDebugID(debugID),emitEvent("onBeginLifeCycleTimer",debugID,timerType),markBegin(debugID,timerType),beginLifeCycleTimer(debugID,timerType)},onEndLifeCycleTimer:function(debugID,timerType){checkDebugID(debugID),endLifeCycleTimer(debugID,timerType),markEnd(debugID,timerType),emitEvent("onEndLifeCycleTimer",debugID,timerType)},onBeginProcessingChildContext:function(){emitEvent("onBeginProcessingChildContext")},onEndProcessingChildContext:function(){emitEvent("onEndProcessingChildContext")},onHostOperation:function(operation){checkDebugID(operation.instanceID),emitEvent("onHostOperation",operation)},onSetState:function(){emitEvent("onSetState")},onSetChildren:function(debugID,childDebugIDs){checkDebugID(debugID),childDebugIDs.forEach(checkDebugID),emitEvent("onSetChildren",debugID,childDebugIDs)},onBeforeMountComponent:function(debugID,element,parentDebugID){checkDebugID(debugID),checkDebugID(parentDebugID,!0),emitEvent("onBeforeMountComponent",debugID,element,parentDebugID),markBegin(debugID,"mount")},onMountComponent:function(debugID){checkDebugID(debugID),markEnd(debugID,"mount"),emitEvent("onMountComponent",debugID)},onBeforeUpdateComponent:function(debugID,element){checkDebugID(debugID),emitEvent("onBeforeUpdateComponent",debugID,element),markBegin(debugID,"update")},onUpdateComponent:function(debugID){checkDebugID(debugID),markEnd(debugID,"update"),emitEvent("onUpdateComponent",debugID)},onBeforeUnmountComponent:function(debugID){checkDebugID(debugID),emitEvent("onBeforeUnmountComponent",debugID),markBegin(debugID,"unmount")},onUnmountComponent:function(debugID){checkDebugID(debugID),markEnd(debugID,"unmount"),emitEvent("onUnmountComponent",debugID)},onTestEvent:function(){emitEvent("onTestEvent")}};ReactDebugTool.addDevtool=ReactDebugTool.addHook,ReactDebugTool.removeDevtool=ReactDebugTool.removeHook,ReactDebugTool.addHook(ReactInvalidSetStateWarningHook),ReactDebugTool.addHook(ReactComponentTreeHook),/[?&]react_perf\b/.test(ExecutionEnvironment.canUseDOM&&window.location.href||"")&&ReactDebugTool.beginProfiling(),module.exports=ReactDebugTool}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function ReactDefaultBatchingStrategyTransaction(){this.reinitializeTransaction()}var _assign=__webpack_require__(7),ReactUpdates=__webpack_require__(17),Transaction=__webpack_require__(42),emptyFunction=__webpack_require__(12),RESET_BATCHED_UPDATES={initialize:emptyFunction,close:function(){ReactDefaultBatchingStrategy.isBatchingUpdates=!1}},FLUSH_BATCHED_UPDATES={initialize:emptyFunction,close:ReactUpdates.flushBatchedUpdates.bind(ReactUpdates)},TRANSACTION_WRAPPERS=[FLUSH_BATCHED_UPDATES,RESET_BATCHED_UPDATES];_assign(ReactDefaultBatchingStrategyTransaction.prototype,Transaction,{getTransactionWrappers:function(){return TRANSACTION_WRAPPERS}});var transaction=new ReactDefaultBatchingStrategyTransaction,ReactDefaultBatchingStrategy={isBatchingUpdates:!1,batchedUpdates:function(callback,a,b,c,d,e){var alreadyBatchingUpdates=ReactDefaultBatchingStrategy.isBatchingUpdates;return ReactDefaultBatchingStrategy.isBatchingUpdates=!0,alreadyBatchingUpdates?callback(a,b,c,d,e):transaction.perform(callback,null,a,b,c,d,e)}};module.exports=ReactDefaultBatchingStrategy},function(module,exports,__webpack_require__){"use strict";function inject(){alreadyInjected||(alreadyInjected=!0,ReactInjection.EventEmitter.injectReactEventListener(ReactEventListener),ReactInjection.EventPluginHub.injectEventPluginOrder(DefaultEventPluginOrder),ReactInjection.EventPluginUtils.injectComponentTree(ReactDOMComponentTree),ReactInjection.EventPluginUtils.injectTreeTraversal(ReactDOMTreeTraversal),ReactInjection.EventPluginHub.injectEventPluginsByName({SimpleEventPlugin:SimpleEventPlugin,EnterLeaveEventPlugin:EnterLeaveEventPlugin,ChangeEventPlugin:ChangeEventPlugin,SelectEventPlugin:SelectEventPlugin,BeforeInputEventPlugin:BeforeInputEventPlugin}),ReactInjection.HostComponent.injectGenericComponentClass(ReactDOMComponent),ReactInjection.HostComponent.injectTextComponentClass(ReactDOMTextComponent),ReactInjection.DOMProperty.injectDOMPropertyConfig(ARIADOMPropertyConfig),ReactInjection.DOMProperty.injectDOMPropertyConfig(HTMLDOMPropertyConfig),ReactInjection.DOMProperty.injectDOMPropertyConfig(SVGDOMPropertyConfig),ReactInjection.EmptyComponent.injectEmptyComponentFactory(function(instantiate){return new ReactDOMEmptyComponent(instantiate)}),ReactInjection.Updates.injectReconcileTransaction(ReactReconcileTransaction),ReactInjection.Updates.injectBatchingStrategy(ReactDefaultBatchingStrategy),ReactInjection.Component.injectEnvironment(ReactComponentBrowserEnvironment))}var ARIADOMPropertyConfig=__webpack_require__(228),BeforeInputEventPlugin=__webpack_require__(230),ChangeEventPlugin=__webpack_require__(232),DefaultEventPluginOrder=__webpack_require__(234),EnterLeaveEventPlugin=__webpack_require__(235),HTMLDOMPropertyConfig=__webpack_require__(237),ReactComponentBrowserEnvironment=__webpack_require__(239),ReactDOMComponent=__webpack_require__(242),ReactDOMComponentTree=__webpack_require__(8),ReactDOMEmptyComponent=__webpack_require__(244),ReactDOMTreeTraversal=__webpack_require__(254),ReactDOMTextComponent=__webpack_require__(252),ReactDefaultBatchingStrategy=__webpack_require__(257),ReactEventListener=__webpack_require__(261),ReactInjection=__webpack_require__(263),ReactReconcileTransaction=__webpack_require__(269),SVGDOMPropertyConfig=__webpack_require__(274),SelectEventPlugin=__webpack_require__(275),SimpleEventPlugin=__webpack_require__(276),alreadyInjected=!1;module.exports={inject:inject}},function(module,exports,__webpack_require__){"use strict";var REACT_ELEMENT_TYPE="function"==typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103;module.exports=REACT_ELEMENT_TYPE},function(module,exports,__webpack_require__){"use strict";function runEventQueueInBatch(events){EventPluginHub.enqueueEvents(events),EventPluginHub.processEventQueue(!1)}var EventPluginHub=__webpack_require__(30),ReactEventEmitterMixin={handleTopLevel:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){runEventQueueInBatch(EventPluginHub.extractEvents(topLevelType,targetInst,nativeEvent,nativeEventTarget))}};module.exports=ReactEventEmitterMixin},function(module,exports,__webpack_require__){"use strict";function findParent(inst){for(;inst._hostParent;)inst=inst._hostParent;var rootNode=ReactDOMComponentTree.getNodeFromInstance(inst),container=rootNode.parentNode;return ReactDOMComponentTree.getClosestInstanceFromNode(container)}function TopLevelCallbackBookKeeping(topLevelType,nativeEvent){this.topLevelType=topLevelType,this.nativeEvent=nativeEvent,this.ancestors=[]}function handleTopLevelImpl(bookKeeping){var nativeEventTarget=getEventTarget(bookKeeping.nativeEvent),targetInst=ReactDOMComponentTree.getClosestInstanceFromNode(nativeEventTarget),ancestor=targetInst;do{bookKeeping.ancestors.push(ancestor),ancestor=ancestor&&findParent(ancestor)}while(ancestor);for(var i=0;i<bookKeeping.ancestors.length;i++)targetInst=bookKeeping.ancestors[i],ReactEventListener._handleTopLevel(bookKeeping.topLevelType,targetInst,bookKeeping.nativeEvent,getEventTarget(bookKeeping.nativeEvent))}function scrollValueMonitor(cb){cb(getUnboundedScrollPosition(window))}var _assign=__webpack_require__(7),EventListener=__webpack_require__(93),ExecutionEnvironment=__webpack_require__(9),PooledClass=__webpack_require__(23),ReactDOMComponentTree=__webpack_require__(8),ReactUpdates=__webpack_require__(17),getEventTarget=__webpack_require__(65),getUnboundedScrollPosition=__webpack_require__(194);_assign(TopLevelCallbackBookKeeping.prototype,{destructor:function(){this.topLevelType=null,this.nativeEvent=null,this.ancestors.length=0}}),PooledClass.addPoolingTo(TopLevelCallbackBookKeeping,PooledClass.twoArgumentPooler);var ReactEventListener={_enabled:!0,_handleTopLevel:null,WINDOW_HANDLE:ExecutionEnvironment.canUseDOM?window:null,setHandleTopLevel:function(handleTopLevel){ReactEventListener._handleTopLevel=handleTopLevel},setEnabled:function(enabled){ReactEventListener._enabled=!!enabled},isEnabled:function(){return ReactEventListener._enabled},trapBubbledEvent:function(topLevelType,handlerBaseName,element){return element?EventListener.listen(element,handlerBaseName,ReactEventListener.dispatchEvent.bind(null,topLevelType)):null},trapCapturedEvent:function(topLevelType,handlerBaseName,element){return element?EventListener.capture(element,handlerBaseName,ReactEventListener.dispatchEvent.bind(null,topLevelType)):null},monitorScrollValue:function(refresh){var callback=scrollValueMonitor.bind(null,refresh);EventListener.listen(window,"scroll",callback)},dispatchEvent:function(topLevelType,nativeEvent){if(ReactEventListener._enabled){var bookKeeping=TopLevelCallbackBookKeeping.getPooled(topLevelType,nativeEvent);try{ReactUpdates.batchedUpdates(handleTopLevelImpl,bookKeeping)}finally{TopLevelCallbackBookKeeping.release(bookKeeping)}}}};module.exports=ReactEventListener},function(module,exports,__webpack_require__){"use strict";var history=[],ReactHostOperationHistoryHook={onHostOperation:function(operation){history.push(operation)},clearHistory:function(){ReactHostOperationHistoryHook._preventClearing||(history=[])},getHistory:function(){return history}};module.exports=ReactHostOperationHistoryHook},function(module,exports,__webpack_require__){"use strict";var DOMProperty=__webpack_require__(21),EventPluginHub=__webpack_require__(30),EventPluginUtils=__webpack_require__(56),ReactComponentEnvironment=__webpack_require__(59),ReactEmptyComponent=__webpack_require__(107),ReactBrowserEventEmitter=__webpack_require__(40),ReactHostComponent=__webpack_require__(109),ReactUpdates=__webpack_require__(17),ReactInjection={Component:ReactComponentEnvironment.injection,DOMProperty:DOMProperty.injection,EmptyComponent:ReactEmptyComponent.injection,EventPluginHub:EventPluginHub.injection,EventPluginUtils:EventPluginUtils.injection,EventEmitter:ReactBrowserEventEmitter.injection,HostComponent:ReactHostComponent.injection,Updates:ReactUpdates.injection};module.exports=ReactInjection},function(module,exports,__webpack_require__){"use strict";(function(process){var warning=__webpack_require__(2);if("production"!==process.env.NODE_ENV)var processingChildContext=!1,warnInvalidSetState=function(){"production"!==process.env.NODE_ENV&&warning(!processingChildContext,"setState(...): Cannot call setState() inside getChildContext()")};var ReactInvalidSetStateWarningHook={onBeginProcessingChildContext:function(){processingChildContext=!0},onEndProcessingChildContext:function(){processingChildContext=!1},onSetState:function(){warnInvalidSetState()}};module.exports=ReactInvalidSetStateWarningHook}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var adler32=__webpack_require__(287),TAG_END=/\/?>/,COMMENT_START=/^<\!\-\-/,ReactMarkupChecksum={CHECKSUM_ATTR_NAME:"data-react-checksum",addChecksumToMarkup:function(markup){var checksum=adler32(markup);return COMMENT_START.test(markup)?markup:markup.replace(TAG_END," "+ReactMarkupChecksum.CHECKSUM_ATTR_NAME+'="'+checksum+'"$&')},canReuseMarkup:function(markup,element){var existingChecksum=element.getAttribute(ReactMarkupChecksum.CHECKSUM_ATTR_NAME);return existingChecksum=existingChecksum&&parseInt(existingChecksum,10),adler32(markup)===existingChecksum}};module.exports=ReactMarkupChecksum},function(module,exports,__webpack_require__){"use strict";(function(process){function makeInsertMarkup(markup,afterNode,toIndex){return{type:"INSERT_MARKUP",content:markup,fromIndex:null,fromNode:null,toIndex:toIndex,afterNode:afterNode}}function makeMove(child,afterNode,toIndex){return{type:"MOVE_EXISTING",content:null,fromIndex:child._mountIndex,fromNode:ReactReconciler.getHostNode(child),toIndex:toIndex,afterNode:afterNode}}function makeRemove(child,node){return{type:"REMOVE_NODE",content:null,fromIndex:child._mountIndex,fromNode:node,toIndex:null,afterNode:null}}function makeSetMarkup(markup){return{type:"SET_MARKUP",content:markup,fromIndex:null,fromNode:null,toIndex:null,afterNode:null}}function makeTextContent(textContent){return{type:"TEXT_CONTENT",content:textContent,fromIndex:null,fromNode:null,toIndex:null,afterNode:null}}function enqueue(queue,update){return update&&(queue=queue||[],queue.push(update)),queue}function processQueue(inst,updateQueue){ReactComponentEnvironment.processChildrenUpdates(inst,updateQueue)}var _prodInvariant=__webpack_require__(4),ReactComponentEnvironment=__webpack_require__(59),ReactInstanceMap=__webpack_require__(32),ReactInstrumentation=__webpack_require__(14),ReactCurrentOwner=__webpack_require__(18),ReactReconciler=__webpack_require__(27),ReactChildReconciler=__webpack_require__(238),emptyFunction=__webpack_require__(12),flattenChildren=__webpack_require__(291),invariant=__webpack_require__(1),setChildrenForInstrumentation=emptyFunction;if("production"!==process.env.NODE_ENV){var getDebugID=function(inst){if(!inst._debugID){var internal;(internal=ReactInstanceMap.get(inst))&&(inst=internal)}return inst._debugID};setChildrenForInstrumentation=function(children){var debugID=getDebugID(this);0!==debugID&&ReactInstrumentation.debugTool.onSetChildren(debugID,children?Object.keys(children).map(function(key){return children[key]._debugID}):[])}}var ReactMultiChild={Mixin:{_reconcilerInstantiateChildren:function(nestedChildren,transaction,context){if("production"!==process.env.NODE_ENV){var selfDebugID=getDebugID(this);if(this._currentElement)try{return ReactCurrentOwner.current=this._currentElement._owner,ReactChildReconciler.instantiateChildren(nestedChildren,transaction,context,selfDebugID)}finally{ReactCurrentOwner.current=null}}return ReactChildReconciler.instantiateChildren(nestedChildren,transaction,context)},_reconcilerUpdateChildren:function(prevChildren,nextNestedChildrenElements,mountImages,removedNodes,transaction,context){var nextChildren,selfDebugID=0;if("production"!==process.env.NODE_ENV&&(selfDebugID=getDebugID(this),this._currentElement)){try{ReactCurrentOwner.current=this._currentElement._owner,nextChildren=flattenChildren(nextNestedChildrenElements,selfDebugID)}finally{ReactCurrentOwner.current=null}return ReactChildReconciler.updateChildren(prevChildren,nextChildren,mountImages,removedNodes,transaction,this,this._hostContainerInfo,context,selfDebugID),nextChildren}return nextChildren=flattenChildren(nextNestedChildrenElements,selfDebugID),ReactChildReconciler.updateChildren(prevChildren,nextChildren,mountImages,removedNodes,transaction,this,this._hostContainerInfo,context,selfDebugID),nextChildren},mountChildren:function(nestedChildren,transaction,context){var children=this._reconcilerInstantiateChildren(nestedChildren,transaction,context);this._renderedChildren=children;var mountImages=[],index=0;for(var name in children)if(children.hasOwnProperty(name)){var child=children[name],selfDebugID=0;"production"!==process.env.NODE_ENV&&(selfDebugID=getDebugID(this));var mountImage=ReactReconciler.mountComponent(child,transaction,this,this._hostContainerInfo,context,selfDebugID);child._mountIndex=index++,mountImages.push(mountImage)}return"production"!==process.env.NODE_ENV&&setChildrenForInstrumentation.call(this,children),mountImages},updateTextContent:function(nextContent){var prevChildren=this._renderedChildren;ReactChildReconciler.unmountChildren(prevChildren,!1);for(var name in prevChildren)prevChildren.hasOwnProperty(name)&&("production"!==process.env.NODE_ENV?invariant(!1,"updateTextContent called on non-empty component."):_prodInvariant("118"));processQueue(this,[makeTextContent(nextContent)])},updateMarkup:function(nextMarkup){var prevChildren=this._renderedChildren;ReactChildReconciler.unmountChildren(prevChildren,!1);for(var name in prevChildren)prevChildren.hasOwnProperty(name)&&("production"!==process.env.NODE_ENV?invariant(!1,"updateTextContent called on non-empty component."):_prodInvariant("118"));processQueue(this,[makeSetMarkup(nextMarkup)])},updateChildren:function(nextNestedChildrenElements,transaction,context){this._updateChildren(nextNestedChildrenElements,transaction,context)},_updateChildren:function(nextNestedChildrenElements,transaction,context){var prevChildren=this._renderedChildren,removedNodes={},mountImages=[],nextChildren=this._reconcilerUpdateChildren(prevChildren,nextNestedChildrenElements,mountImages,removedNodes,transaction,context);if(nextChildren||prevChildren){var name,updates=null,nextIndex=0,lastIndex=0,nextMountIndex=0,lastPlacedNode=null;for(name in nextChildren)if(nextChildren.hasOwnProperty(name)){var prevChild=prevChildren&&prevChildren[name],nextChild=nextChildren[name];prevChild===nextChild?(updates=enqueue(updates,this.moveChild(prevChild,lastPlacedNode,nextIndex,lastIndex)),lastIndex=Math.max(prevChild._mountIndex,lastIndex),prevChild._mountIndex=nextIndex):(prevChild&&(lastIndex=Math.max(prevChild._mountIndex,lastIndex)),updates=enqueue(updates,this._mountChildAtIndex(nextChild,mountImages[nextMountIndex],lastPlacedNode,nextIndex,transaction,context)),nextMountIndex++),nextIndex++,lastPlacedNode=ReactReconciler.getHostNode(nextChild)}for(name in removedNodes)removedNodes.hasOwnProperty(name)&&(updates=enqueue(updates,this._unmountChild(prevChildren[name],removedNodes[name])));updates&&processQueue(this,updates),this._renderedChildren=nextChildren,"production"!==process.env.NODE_ENV&&setChildrenForInstrumentation.call(this,nextChildren)}},unmountChildren:function(safely){var renderedChildren=this._renderedChildren;ReactChildReconciler.unmountChildren(renderedChildren,safely),this._renderedChildren=null},moveChild:function(child,afterNode,toIndex,lastIndex){if(child._mountIndex<lastIndex)return makeMove(child,afterNode,toIndex)},createChild:function(child,afterNode,mountImage){return makeInsertMarkup(mountImage,afterNode,child._mountIndex)},removeChild:function(child,node){return makeRemove(child,node)},_mountChildAtIndex:function(child,mountImage,afterNode,index,transaction,context){return child._mountIndex=index,this.createChild(child,afterNode,mountImage)},_unmountChild:function(child,node){var update=this.removeChild(child,node);return child._mountIndex=null,update}}};module.exports=ReactMultiChild}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function isValidOwner(object){return!(!object||"function"!=typeof object.attachRef||"function"!=typeof object.detachRef)}var _prodInvariant=__webpack_require__(4),invariant=__webpack_require__(1),ReactOwner={addComponentAsRefTo:function(component,ref,owner){isValidOwner(owner)||("production"!==process.env.NODE_ENV?invariant(!1,"addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's `render` method, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner)."):_prodInvariant("119")),owner.attachRef(ref,component)},removeComponentAsRefFrom:function(component,ref,owner){isValidOwner(owner)||("production"!==process.env.NODE_ENV?invariant(!1,"removeComponentAsRefFrom(...): Only a ReactOwner can have refs. You might be removing a ref to a component that was not created inside a component's `render` method, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner)."):_prodInvariant("120"));var ownerPublicInstance=owner.getPublicInstance();ownerPublicInstance&&ownerPublicInstance.refs[ref]===component.getPublicInstance()&&owner.detachRef(ref)}};module.exports=ReactOwner}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var ReactPropTypeLocationNames={};"production"!==process.env.NODE_ENV&&(ReactPropTypeLocationNames={prop:"prop",context:"context",childContext:"child context"}),module.exports=ReactPropTypeLocationNames}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function ReactReconcileTransaction(useCreateElement){this.reinitializeTransaction(),this.renderToStaticMarkup=!1,this.reactMountReady=CallbackQueue.getPooled(null),this.useCreateElement=useCreateElement}var _assign=__webpack_require__(7),CallbackQueue=__webpack_require__(103),PooledClass=__webpack_require__(23),ReactBrowserEventEmitter=__webpack_require__(40),ReactInputSelection=__webpack_require__(110),ReactInstrumentation=__webpack_require__(14),Transaction=__webpack_require__(42),ReactUpdateQueue=__webpack_require__(61),SELECTION_RESTORATION={initialize:ReactInputSelection.getSelectionInformation,close:ReactInputSelection.restoreSelection},EVENT_SUPPRESSION={initialize:function(){var currentlyEnabled=ReactBrowserEventEmitter.isEnabled();return ReactBrowserEventEmitter.setEnabled(!1),currentlyEnabled},close:function(previouslyEnabled){ReactBrowserEventEmitter.setEnabled(previouslyEnabled)}},ON_DOM_READY_QUEUEING={initialize:function(){this.reactMountReady.reset()},close:function(){this.reactMountReady.notifyAll()}},TRANSACTION_WRAPPERS=[SELECTION_RESTORATION,EVENT_SUPPRESSION,ON_DOM_READY_QUEUEING];"production"!==process.env.NODE_ENV&&TRANSACTION_WRAPPERS.push({initialize:ReactInstrumentation.debugTool.onBeginFlush,close:ReactInstrumentation.debugTool.onEndFlush});var Mixin={getTransactionWrappers:function(){return TRANSACTION_WRAPPERS},getReactMountReady:function(){return this.reactMountReady},getUpdateQueue:function(){return ReactUpdateQueue},checkpoint:function(){return this.reactMountReady.checkpoint()},rollback:function(checkpoint){this.reactMountReady.rollback(checkpoint)},destructor:function(){CallbackQueue.release(this.reactMountReady),this.reactMountReady=null}};_assign(ReactReconcileTransaction.prototype,Transaction,Mixin),PooledClass.addPoolingTo(ReactReconcileTransaction),module.exports=ReactReconcileTransaction}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function attachRef(ref,component,owner){"function"==typeof ref?ref(component.getPublicInstance()):ReactOwner.addComponentAsRefTo(component,ref,owner)}function detachRef(ref,component,owner){"function"==typeof ref?ref(null):ReactOwner.removeComponentAsRefFrom(component,ref,owner)}var ReactOwner=__webpack_require__(267),ReactRef={};ReactRef.attachRefs=function(instance,element){if(null!==element&&"object"==typeof element){var ref=element.ref;null!=ref&&attachRef(ref,instance,element._owner)}},ReactRef.shouldUpdateRefs=function(prevElement,nextElement){var prevRef=null,prevOwner=null;null!==prevElement&&"object"==typeof prevElement&&(prevRef=prevElement.ref,prevOwner=prevElement._owner);var nextRef=null,nextOwner=null;return null!==nextElement&&"object"==typeof nextElement&&(nextRef=nextElement.ref,nextOwner=nextElement._owner),prevRef!==nextRef||"string"==typeof nextRef&&nextOwner!==prevOwner},ReactRef.detachRefs=function(instance,element){if(null!==element&&"object"==typeof element){var ref=element.ref;null!=ref&&detachRef(ref,instance,element._owner)}},module.exports=ReactRef},function(module,exports,__webpack_require__){"use strict";(function(process){function ReactServerRenderingTransaction(renderToStaticMarkup){this.reinitializeTransaction(),this.renderToStaticMarkup=renderToStaticMarkup,this.useCreateElement=!1,this.updateQueue=new ReactServerUpdateQueue(this)}var _assign=__webpack_require__(7),PooledClass=__webpack_require__(23),Transaction=__webpack_require__(42),ReactInstrumentation=__webpack_require__(14),ReactServerUpdateQueue=__webpack_require__(272),TRANSACTION_WRAPPERS=[];"production"!==process.env.NODE_ENV&&TRANSACTION_WRAPPERS.push({initialize:ReactInstrumentation.debugTool.onBeginFlush,close:ReactInstrumentation.debugTool.onEndFlush});var noopCallbackQueue={enqueue:function(){}},Mixin={getTransactionWrappers:function(){return TRANSACTION_WRAPPERS},getReactMountReady:function(){return noopCallbackQueue},getUpdateQueue:function(){return this.updateQueue},destructor:function(){},checkpoint:function(){},rollback:function(){}};_assign(ReactServerRenderingTransaction.prototype,Transaction,Mixin),PooledClass.addPoolingTo(ReactServerRenderingTransaction),module.exports=ReactServerRenderingTransaction}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function warnNoop(publicInstance,callerName){if("production"!==process.env.NODE_ENV){var constructor=publicInstance.constructor;"production"!==process.env.NODE_ENV&&warning(!1,"%s(...): Can only update a mounting component. This usually means you called %s() outside componentWillMount() on the server. This is a no-op. Please check the code for the %s component.",callerName,callerName,constructor&&(constructor.displayName||constructor.name)||"ReactClass")}}var ReactUpdateQueue=__webpack_require__(61),warning=__webpack_require__(2),ReactServerUpdateQueue=function(){function ReactServerUpdateQueue(transaction){_classCallCheck(this,ReactServerUpdateQueue),this.transaction=transaction}return ReactServerUpdateQueue.prototype.isMounted=function(publicInstance){return!1},ReactServerUpdateQueue.prototype.enqueueCallback=function(publicInstance,callback,callerName){this.transaction.isInTransaction()&&ReactUpdateQueue.enqueueCallback(publicInstance,callback,callerName)},ReactServerUpdateQueue.prototype.enqueueForceUpdate=function(publicInstance){this.transaction.isInTransaction()?ReactUpdateQueue.enqueueForceUpdate(publicInstance):warnNoop(publicInstance,"forceUpdate")},ReactServerUpdateQueue.prototype.enqueueReplaceState=function(publicInstance,completeState){this.transaction.isInTransaction()?ReactUpdateQueue.enqueueReplaceState(publicInstance,completeState):warnNoop(publicInstance,"replaceState")},ReactServerUpdateQueue.prototype.enqueueSetState=function(publicInstance,partialState){this.transaction.isInTransaction()?ReactUpdateQueue.enqueueSetState(publicInstance,partialState):warnNoop(publicInstance,"setState")},ReactServerUpdateQueue}();module.exports=ReactServerUpdateQueue}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";module.exports="15.6.1"},function(module,exports,__webpack_require__){"use strict";var NS={xlink:"http://www.w3.org/1999/xlink",xml:"http://www.w3.org/XML/1998/namespace"},ATTRS={accentHeight:"accent-height",accumulate:0,additive:0,alignmentBaseline:"alignment-baseline",allowReorder:"allowReorder",alphabetic:0,amplitude:0,arabicForm:"arabic-form",ascent:0,attributeName:"attributeName",attributeType:"attributeType",autoReverse:"autoReverse",azimuth:0,baseFrequency:"baseFrequency",baseProfile:"baseProfile",baselineShift:"baseline-shift",bbox:0,begin:0,bias:0,by:0,calcMode:"calcMode",capHeight:"cap-height",clip:0,clipPath:"clip-path",clipRule:"clip-rule",clipPathUnits:"clipPathUnits",colorInterpolation:"color-interpolation",colorInterpolationFilters:"color-interpolation-filters",colorProfile:"color-profile",colorRendering:"color-rendering",contentScriptType:"contentScriptType",contentStyleType:"contentStyleType",cursor:0,cx:0,cy:0,d:0,decelerate:0,descent:0,diffuseConstant:"diffuseConstant",direction:0,display:0,divisor:0,dominantBaseline:"dominant-baseline",dur:0,dx:0,dy:0,edgeMode:"edgeMode",elevation:0,enableBackground:"enable-background",end:0,exponent:0,externalResourcesRequired:"externalResourcesRequired",fill:0,fillOpacity:"fill-opacity",fillRule:"fill-rule",filter:0,filterRes:"filterRes",filterUnits:"filterUnits",floodColor:"flood-color",floodOpacity:"flood-opacity",focusable:0,fontFamily:"font-family",fontSize:"font-size",fontSizeAdjust:"font-size-adjust",fontStretch:"font-stretch",fontStyle:"font-style",fontVariant:"font-variant",fontWeight:"font-weight",format:0,from:0,fx:0,fy:0,g1:0,g2:0,glyphName:"glyph-name",glyphOrientationHorizontal:"glyph-orientation-horizontal",glyphOrientationVertical:"glyph-orientation-vertical",glyphRef:"glyphRef",gradientTransform:"gradientTransform",gradientUnits:"gradientUnits",hanging:0,horizAdvX:"horiz-adv-x",horizOriginX:"horiz-origin-x",ideographic:0,imageRendering:"image-rendering",in:0,in2:0,intercept:0,k:0,k1:0,k2:0,k3:0,k4:0,kernelMatrix:"kernelMatrix",kernelUnitLength:"kernelUnitLength",kerning:0,keyPoints:"keyPoints",keySplines:"keySplines",keyTimes:"keyTimes",lengthAdjust:"lengthAdjust",letterSpacing:"letter-spacing",lightingColor:"lighting-color",limitingConeAngle:"limitingConeAngle",local:0,markerEnd:"marker-end",markerMid:"marker-mid",markerStart:"marker-start",markerHeight:"markerHeight",markerUnits:"markerUnits",markerWidth:"markerWidth",mask:0,maskContentUnits:"maskContentUnits",maskUnits:"maskUnits",mathematical:0,mode:0,numOctaves:"numOctaves",offset:0,opacity:0,operator:0,order:0,orient:0,orientation:0,origin:0,overflow:0,overlinePosition:"overline-position",overlineThickness:"overline-thickness",paintOrder:"paint-order",panose1:"panose-1",pathLength:"pathLength",patternContentUnits:"patternContentUnits",patternTransform:"patternTransform",patternUnits:"patternUnits",pointerEvents:"pointer-events",points:0,pointsAtX:"pointsAtX",pointsAtY:"pointsAtY",pointsAtZ:"pointsAtZ",preserveAlpha:"preserveAlpha",preserveAspectRatio:"preserveAspectRatio",primitiveUnits:"primitiveUnits",r:0,radius:0,refX:"refX",refY:"refY",renderingIntent:"rendering-intent",repeatCount:"repeatCount",repeatDur:"repeatDur",requiredExtensions:"requiredExtensions",requiredFeatures:"requiredFeatures",restart:0,result:0,rotate:0,rx:0,ry:0,scale:0,seed:0,shapeRendering:"shape-rendering",slope:0,spacing:0,specularConstant:"specularConstant",specularExponent:"specularExponent",speed:0,spreadMethod:"spreadMethod",startOffset:"startOffset",stdDeviation:"stdDeviation",stemh:0,stemv:0,stitchTiles:"stitchTiles",stopColor:"stop-color",stopOpacity:"stop-opacity",strikethroughPosition:"strikethrough-position",strikethroughThickness:"strikethrough-thickness",string:0,stroke:0,strokeDasharray:"stroke-dasharray",strokeDashoffset:"stroke-dashoffset",strokeLinecap:"stroke-linecap",strokeLinejoin:"stroke-linejoin",strokeMiterlimit:"stroke-miterlimit",strokeOpacity:"stroke-opacity",strokeWidth:"stroke-width",surfaceScale:"surfaceScale",systemLanguage:"systemLanguage",tableValues:"tableValues",targetX:"targetX",targetY:"targetY",textAnchor:"text-anchor",textDecoration:"text-decoration",textRendering:"text-rendering",textLength:"textLength",to:0,transform:0,u1:0,u2:0,underlinePosition:"underline-position",underlineThickness:"underline-thickness",unicode:0,unicodeBidi:"unicode-bidi",unicodeRange:"unicode-range",unitsPerEm:"units-per-em",vAlphabetic:"v-alphabetic",vHanging:"v-hanging",vIdeographic:"v-ideographic",vMathematical:"v-mathematical",values:0,vectorEffect:"vector-effect",version:0,vertAdvY:"vert-adv-y",vertOriginX:"vert-origin-x",vertOriginY:"vert-origin-y",viewBox:"viewBox",viewTarget:"viewTarget",visibility:0,widths:0,wordSpacing:"word-spacing",writingMode:"writing-mode",x:0,xHeight:"x-height",x1:0,x2:0,xChannelSelector:"xChannelSelector",xlinkActuate:"xlink:actuate",xlinkArcrole:"xlink:arcrole",xlinkHref:"xlink:href",xlinkRole:"xlink:role",xlinkShow:"xlink:show",xlinkTitle:"xlink:title",xlinkType:"xlink:type",xmlBase:"xml:base",xmlns:0,xmlnsXlink:"xmlns:xlink",xmlLang:"xml:lang",xmlSpace:"xml:space",y:0,y1:0,y2:0,yChannelSelector:"yChannelSelector",z:0,zoomAndPan:"zoomAndPan"},SVGDOMPropertyConfig={Properties:{},DOMAttributeNamespaces:{xlinkActuate:NS.xlink,xlinkArcrole:NS.xlink,xlinkHref:NS.xlink,xlinkRole:NS.xlink,xlinkShow:NS.xlink,xlinkTitle:NS.xlink,xlinkType:NS.xlink,xmlBase:NS.xml,xmlLang:NS.xml,xmlSpace:NS.xml},DOMAttributeNames:{}};Object.keys(ATTRS).forEach(function(key){SVGDOMPropertyConfig.Properties[key]=0,ATTRS[key]&&(SVGDOMPropertyConfig.DOMAttributeNames[key]=ATTRS[key])}),module.exports=SVGDOMPropertyConfig},function(module,exports,__webpack_require__){"use strict";function getSelection(node){if("selectionStart"in node&&ReactInputSelection.hasSelectionCapabilities(node))return{start:node.selectionStart,end:node.selectionEnd};if(window.getSelection){var selection=window.getSelection();return{anchorNode:selection.anchorNode,anchorOffset:selection.anchorOffset,focusNode:selection.focusNode,focusOffset:selection.focusOffset}}if(document.selection){var range=document.selection.createRange();return{parentElement:range.parentElement(),text:range.text,top:range.boundingTop,left:range.boundingLeft}}}function constructSelectEvent(nativeEvent,nativeEventTarget){if(mouseDown||null==activeElement||activeElement!==getActiveElement())return null;var currentSelection=getSelection(activeElement);if(!lastSelection||!shallowEqual(lastSelection,currentSelection)){lastSelection=currentSelection;var syntheticEvent=SyntheticEvent.getPooled(eventTypes.select,activeElementInst,nativeEvent,nativeEventTarget);return syntheticEvent.type="select",syntheticEvent.target=activeElement,EventPropagators.accumulateTwoPhaseDispatches(syntheticEvent),syntheticEvent}return null}var EventPropagators=__webpack_require__(31),ExecutionEnvironment=__webpack_require__(9),ReactDOMComponentTree=__webpack_require__(8),ReactInputSelection=__webpack_require__(110),SyntheticEvent=__webpack_require__(20),getActiveElement=__webpack_require__(95),isTextInputElement=__webpack_require__(121),shallowEqual=__webpack_require__(51),skipSelectionChangeEvent=ExecutionEnvironment.canUseDOM&&"documentMode"in document&&document.documentMode<=11,eventTypes={select:{phasedRegistrationNames:{bubbled:"onSelect",captured:"onSelectCapture"},dependencies:["topBlur","topContextMenu","topFocus","topKeyDown","topKeyUp","topMouseDown","topMouseUp","topSelectionChange"]}},activeElement=null,activeElementInst=null,lastSelection=null,mouseDown=!1,hasListener=!1,SelectEventPlugin={eventTypes:eventTypes,extractEvents:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){if(!hasListener)return null;var targetNode=targetInst?ReactDOMComponentTree.getNodeFromInstance(targetInst):window;switch(topLevelType){case"topFocus":(isTextInputElement(targetNode)||"true"===targetNode.contentEditable)&&(activeElement=targetNode,activeElementInst=targetInst,lastSelection=null);break;case"topBlur":activeElement=null,activeElementInst=null,lastSelection=null;break;case"topMouseDown":mouseDown=!0;break;case"topContextMenu":case"topMouseUp":return mouseDown=!1,constructSelectEvent(nativeEvent,nativeEventTarget);case"topSelectionChange":if(skipSelectionChangeEvent)break;case"topKeyDown":case"topKeyUp":return constructSelectEvent(nativeEvent,nativeEventTarget)}return null},didPutListener:function(inst,registrationName,listener){"onSelect"===registrationName&&(hasListener=!0)}};module.exports=SelectEventPlugin},function(module,exports,__webpack_require__){"use strict";(function(process){function getDictionaryKey(inst){return"."+inst._rootNodeID}function isInteractive(tag){return"button"===tag||"input"===tag||"select"===tag||"textarea"===tag}var _prodInvariant=__webpack_require__(4),EventListener=__webpack_require__(93),EventPropagators=__webpack_require__(31),ReactDOMComponentTree=__webpack_require__(8),SyntheticAnimationEvent=__webpack_require__(277),SyntheticClipboardEvent=__webpack_require__(278),SyntheticEvent=__webpack_require__(20),SyntheticFocusEvent=__webpack_require__(281),SyntheticKeyboardEvent=__webpack_require__(283),SyntheticMouseEvent=__webpack_require__(41),SyntheticDragEvent=__webpack_require__(280),SyntheticTouchEvent=__webpack_require__(284),SyntheticTransitionEvent=__webpack_require__(285),SyntheticUIEvent=__webpack_require__(33),SyntheticWheelEvent=__webpack_require__(286),emptyFunction=__webpack_require__(12),getEventCharCode=__webpack_require__(63),invariant=__webpack_require__(1),eventTypes={},topLevelEventsToDispatchConfig={};["abort","animationEnd","animationIteration","animationStart","blur","canPlay","canPlayThrough","click","contextMenu","copy","cut","doubleClick","drag","dragEnd","dragEnter","dragExit","dragLeave","dragOver","dragStart","drop","durationChange","emptied","encrypted","ended","error","focus","input","invalid","keyDown","keyPress","keyUp","load","loadedData","loadedMetadata","loadStart","mouseDown","mouseMove","mouseOut","mouseOver","mouseUp","paste","pause","play","playing","progress","rateChange","reset","scroll","seeked","seeking","stalled","submit","suspend","timeUpdate","touchCancel","touchEnd","touchMove","touchStart","transitionEnd","volumeChange","waiting","wheel"].forEach(function(event){var capitalizedEvent=event[0].toUpperCase()+event.slice(1),onEvent="on"+capitalizedEvent,topEvent="top"+capitalizedEvent,type={phasedRegistrationNames:{bubbled:onEvent,captured:onEvent+"Capture"},dependencies:[topEvent]};eventTypes[event]=type,topLevelEventsToDispatchConfig[topEvent]=type});var onClickListeners={},SimpleEventPlugin={eventTypes:eventTypes,extractEvents:function(topLevelType,targetInst,nativeEvent,nativeEventTarget){var dispatchConfig=topLevelEventsToDispatchConfig[topLevelType];if(!dispatchConfig)return null;var EventConstructor;switch(topLevelType){case"topAbort":case"topCanPlay":case"topCanPlayThrough":case"topDurationChange":case"topEmptied":case"topEncrypted":case"topEnded":case"topError":case"topInput":case"topInvalid":case"topLoad":case"topLoadedData":case"topLoadedMetadata":case"topLoadStart":case"topPause":case"topPlay":case"topPlaying":case"topProgress":case"topRateChange":case"topReset":case"topSeeked":case"topSeeking":case"topStalled":case"topSubmit":case"topSuspend":case"topTimeUpdate":case"topVolumeChange":case"topWaiting":EventConstructor=SyntheticEvent;break;case"topKeyPress":if(0===getEventCharCode(nativeEvent))return null;case"topKeyDown":case"topKeyUp":EventConstructor=SyntheticKeyboardEvent;break;case"topBlur":case"topFocus":EventConstructor=SyntheticFocusEvent;break;case"topClick":if(2===nativeEvent.button)return null;case"topDoubleClick":case"topMouseDown":case"topMouseMove":case"topMouseUp":case"topMouseOut":case"topMouseOver":case"topContextMenu":EventConstructor=SyntheticMouseEvent;break;case"topDrag":case"topDragEnd":case"topDragEnter":case"topDragExit":case"topDragLeave":case"topDragOver":case"topDragStart":case"topDrop":EventConstructor=SyntheticDragEvent;break;case"topTouchCancel":case"topTouchEnd":case"topTouchMove":case"topTouchStart":EventConstructor=SyntheticTouchEvent;break;case"topAnimationEnd":case"topAnimationIteration":case"topAnimationStart":EventConstructor=SyntheticAnimationEvent;break;case"topTransitionEnd":EventConstructor=SyntheticTransitionEvent;break;case"topScroll":EventConstructor=SyntheticUIEvent;break;case"topWheel":EventConstructor=SyntheticWheelEvent;break;case"topCopy":case"topCut":case"topPaste":EventConstructor=SyntheticClipboardEvent}EventConstructor||("production"!==process.env.NODE_ENV?invariant(!1,"SimpleEventPlugin: Unhandled event type, `%s`.",topLevelType):_prodInvariant("86",topLevelType));var event=EventConstructor.getPooled(dispatchConfig,targetInst,nativeEvent,nativeEventTarget);return EventPropagators.accumulateTwoPhaseDispatches(event),event},didPutListener:function(inst,registrationName,listener){if("onClick"===registrationName&&!isInteractive(inst._tag)){var key=getDictionaryKey(inst),node=ReactDOMComponentTree.getNodeFromInstance(inst);onClickListeners[key]||(onClickListeners[key]=EventListener.listen(node,"click",emptyFunction))}},willDeleteListener:function(inst,registrationName){if("onClick"===registrationName&&!isInteractive(inst._tag)){var key=getDictionaryKey(inst);onClickListeners[key].remove(),delete onClickListeners[key]}}};module.exports=SimpleEventPlugin}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function SyntheticAnimationEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticEvent=__webpack_require__(20),AnimationEventInterface={animationName:null,elapsedTime:null,pseudoElement:null};SyntheticEvent.augmentClass(SyntheticAnimationEvent,AnimationEventInterface),module.exports=SyntheticAnimationEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticClipboardEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticEvent=__webpack_require__(20),ClipboardEventInterface={clipboardData:function(event){return"clipboardData"in event?event.clipboardData:window.clipboardData}};SyntheticEvent.augmentClass(SyntheticClipboardEvent,ClipboardEventInterface),module.exports=SyntheticClipboardEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticCompositionEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticEvent=__webpack_require__(20),CompositionEventInterface={data:null};SyntheticEvent.augmentClass(SyntheticCompositionEvent,CompositionEventInterface),module.exports=SyntheticCompositionEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticDragEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticMouseEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticMouseEvent=__webpack_require__(41),DragEventInterface={dataTransfer:null};SyntheticMouseEvent.augmentClass(SyntheticDragEvent,DragEventInterface),module.exports=SyntheticDragEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticFocusEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticUIEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticUIEvent=__webpack_require__(33),FocusEventInterface={relatedTarget:null};SyntheticUIEvent.augmentClass(SyntheticFocusEvent,FocusEventInterface),module.exports=SyntheticFocusEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticInputEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticEvent=__webpack_require__(20),InputEventInterface={data:null};SyntheticEvent.augmentClass(SyntheticInputEvent,InputEventInterface),module.exports=SyntheticInputEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticKeyboardEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticUIEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticUIEvent=__webpack_require__(33),getEventCharCode=__webpack_require__(63),getEventKey=__webpack_require__(292),getEventModifierState=__webpack_require__(64),KeyboardEventInterface={key:getEventKey,location:null,ctrlKey:null,shiftKey:null,altKey:null,metaKey:null,repeat:null,locale:null,getModifierState:getEventModifierState,charCode:function(event){return"keypress"===event.type?getEventCharCode(event):0},keyCode:function(event){return"keydown"===event.type||"keyup"===event.type?event.keyCode:0},which:function(event){return"keypress"===event.type?getEventCharCode(event):"keydown"===event.type||"keyup"===event.type?event.keyCode:0}};SyntheticUIEvent.augmentClass(SyntheticKeyboardEvent,KeyboardEventInterface),module.exports=SyntheticKeyboardEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticTouchEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticUIEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticUIEvent=__webpack_require__(33),getEventModifierState=__webpack_require__(64),TouchEventInterface={touches:null,targetTouches:null,changedTouches:null,altKey:null,metaKey:null,ctrlKey:null,shiftKey:null,getModifierState:getEventModifierState};SyntheticUIEvent.augmentClass(SyntheticTouchEvent,TouchEventInterface),module.exports=SyntheticTouchEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticTransitionEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticEvent=__webpack_require__(20),TransitionEventInterface={propertyName:null,elapsedTime:null,pseudoElement:null};SyntheticEvent.augmentClass(SyntheticTransitionEvent,TransitionEventInterface),module.exports=SyntheticTransitionEvent},function(module,exports,__webpack_require__){"use strict";function SyntheticWheelEvent(dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget){return SyntheticMouseEvent.call(this,dispatchConfig,dispatchMarker,nativeEvent,nativeEventTarget)}var SyntheticMouseEvent=__webpack_require__(41),WheelEventInterface={deltaX:function(event){return"deltaX"in event?event.deltaX:"wheelDeltaX"in event?-event.wheelDeltaX:0},deltaY:function(event){return"deltaY"in event?event.deltaY:"wheelDeltaY"in event?-event.wheelDeltaY:"wheelDelta"in event?-event.wheelDelta:0},deltaZ:null,deltaMode:null};SyntheticMouseEvent.augmentClass(SyntheticWheelEvent,WheelEventInterface),module.exports=SyntheticWheelEvent},function(module,exports,__webpack_require__){"use strict";function adler32(data){for(var a=1,b=0,i=0,l=data.length,m=-4&l;i<m;){for(var n=Math.min(i+4096,m);i<n;i+=4)b+=(a+=data.charCodeAt(i))+(a+=data.charCodeAt(i+1))+(a+=data.charCodeAt(i+2))+(a+=data.charCodeAt(i+3));a%=MOD,b%=MOD}for(;i<l;i++)b+=a+=data.charCodeAt(i);return a%=MOD,b%=MOD,a|b<<16}var MOD=65521;module.exports=adler32},function(module,exports,__webpack_require__){"use strict";(function(process){function checkReactTypeSpec(typeSpecs,values,location,componentName,element,debugID){for(var typeSpecName in typeSpecs)if(typeSpecs.hasOwnProperty(typeSpecName)){var error;try{"function"!=typeof typeSpecs[typeSpecName]&&("production"!==process.env.NODE_ENV?invariant(!1,"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName):_prodInvariant("84",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName)),error=typeSpecs[typeSpecName](values,typeSpecName,componentName,location,null,ReactPropTypesSecret)}catch(ex){error=ex}if("production"!==process.env.NODE_ENV&&warning(!error||error instanceof Error,"%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName,typeof error),error instanceof Error&&!(error.message in loggedTypeFailures)){loggedTypeFailures[error.message]=!0;var componentStackInfo="";"production"!==process.env.NODE_ENV&&(ReactComponentTreeHook||(ReactComponentTreeHook=__webpack_require__(11)),null!==debugID?componentStackInfo=ReactComponentTreeHook.getStackAddendumByID(debugID):null!==element&&(componentStackInfo=ReactComponentTreeHook.getCurrentStackAddendum(element))),"production"!==process.env.NODE_ENV&&warning(!1,"Failed %s type: %s%s",location,error.message,componentStackInfo)}}}var ReactComponentTreeHook,_prodInvariant=__webpack_require__(4),ReactPropTypeLocationNames=__webpack_require__(268),ReactPropTypesSecret=__webpack_require__(113),invariant=__webpack_require__(1),warning=__webpack_require__(2);void 0!==process&&process.env&&"test"===process.env.NODE_ENV&&(ReactComponentTreeHook=__webpack_require__(11));var loggedTypeFailures={};module.exports=checkReactTypeSpec}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function dangerousStyleValue(name,value,component,isCustomProperty){if(null==value||"boolean"==typeof value||""===value)return"";var isNonNumeric=isNaN(value);if(isCustomProperty||isNonNumeric||0===value||isUnitlessNumber.hasOwnProperty(name)&&isUnitlessNumber[name])return""+value;if("string"==typeof value){if("production"!==process.env.NODE_ENV&&component&&"0"!==value){var owner=component._currentElement._owner,ownerName=owner?owner.getName():null;ownerName&&!styleWarnings[ownerName]&&(styleWarnings[ownerName]={});var warned=!1;if(ownerName){var warnings=styleWarnings[ownerName];warned=warnings[name],warned||(warnings[name]=!0)}warned||"production"!==process.env.NODE_ENV&&warning(!1,"a `%s` tag (owner: `%s`) was passed a numeric string value for CSS property `%s` (value: `%s`) which will be treated as a unitless number in a future version of React.",component._currentElement.type,ownerName||"unknown",name,value)}value=value.trim()}return value+"px"}var CSSProperty=__webpack_require__(102),warning=__webpack_require__(2),isUnitlessNumber=CSSProperty.isUnitlessNumber,styleWarnings={};module.exports=dangerousStyleValue}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function findDOMNode(componentOrElement){if("production"!==process.env.NODE_ENV){var owner=ReactCurrentOwner.current;null!==owner&&("production"!==process.env.NODE_ENV&&warning(owner._warnedAboutRefsInRender,"%s is accessing findDOMNode inside its render(). render() should be a pure function of props and state. It should never access something that requires stale data from the previous render, such as refs. Move this logic to componentDidMount and componentDidUpdate instead.",owner.getName()||"A component"),owner._warnedAboutRefsInRender=!0)}if(null==componentOrElement)return null;if(1===componentOrElement.nodeType)return componentOrElement;var inst=ReactInstanceMap.get(componentOrElement);if(inst)return inst=getHostComponentFromComposite(inst),inst?ReactDOMComponentTree.getNodeFromInstance(inst):null;"function"==typeof componentOrElement.render?"production"!==process.env.NODE_ENV?invariant(!1,"findDOMNode was called on an unmounted component."):_prodInvariant("44"):"production"!==process.env.NODE_ENV?invariant(!1,"Element appears to be neither ReactComponent nor DOMNode (keys: %s)",Object.keys(componentOrElement)):_prodInvariant("45",Object.keys(componentOrElement))}var _prodInvariant=__webpack_require__(4),ReactCurrentOwner=__webpack_require__(18),ReactDOMComponentTree=__webpack_require__(8),ReactInstanceMap=__webpack_require__(32),getHostComponentFromComposite=__webpack_require__(117),invariant=__webpack_require__(1),warning=__webpack_require__(2);module.exports=findDOMNode}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function flattenSingleChildIntoContext(traverseContext,child,name,selfDebugID){if(traverseContext&&"object"==typeof traverseContext){var result=traverseContext,keyUnique=void 0===result[name];"production"!==process.env.NODE_ENV&&(ReactComponentTreeHook||(ReactComponentTreeHook=__webpack_require__(11)),keyUnique||"production"!==process.env.NODE_ENV&&warning(!1,"flattenChildren(...): Encountered two children with the same key, `%s`. Child keys must be unique; when two children share a key, only the first child will be used.%s",KeyEscapeUtils.unescape(name),ReactComponentTreeHook.getStackAddendumByID(selfDebugID))),keyUnique&&null!=child&&(result[name]=child)}}function flattenChildren(children,selfDebugID){if(null==children)return children;var result={};return"production"!==process.env.NODE_ENV?traverseAllChildren(children,function(traverseContext,child,name){return flattenSingleChildIntoContext(traverseContext,child,name,selfDebugID)},result):traverseAllChildren(children,flattenSingleChildIntoContext,result),result}var ReactComponentTreeHook,KeyEscapeUtils=__webpack_require__(57),traverseAllChildren=__webpack_require__(123),warning=__webpack_require__(2);void 0!==process&&process.env&&"test"===process.env.NODE_ENV&&(ReactComponentTreeHook=__webpack_require__(11)),module.exports=flattenChildren}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function getEventKey(nativeEvent){if(nativeEvent.key){var key=normalizeKey[nativeEvent.key]||nativeEvent.key;if("Unidentified"!==key)return key}if("keypress"===nativeEvent.type){var charCode=getEventCharCode(nativeEvent);return 13===charCode?"Enter":String.fromCharCode(charCode)}return"keydown"===nativeEvent.type||"keyup"===nativeEvent.type?translateToKey[nativeEvent.keyCode]||"Unidentified":""}var getEventCharCode=__webpack_require__(63),normalizeKey={Esc:"Escape",Spacebar:" ",Left:"ArrowLeft",Up:"ArrowUp",Right:"ArrowRight",Down:"ArrowDown",Del:"Delete",Win:"OS",Menu:"ContextMenu",Apps:"ContextMenu",Scroll:"ScrollLock",MozPrintableKey:"Unidentified"},translateToKey={8:"Backspace",9:"Tab",12:"Clear",13:"Enter",16:"Shift",17:"Control",18:"Alt",19:"Pause",20:"CapsLock",27:"Escape",32:" ",33:"PageUp",34:"PageDown",35:"End",36:"Home",37:"ArrowLeft",38:"ArrowUp",39:"ArrowRight",40:"ArrowDown",45:"Insert",46:"Delete",112:"F1",113:"F2",114:"F3",115:"F4",116:"F5",117:"F6",118:"F7",119:"F8",120:"F9",121:"F10",122:"F11",123:"F12",144:"NumLock",145:"ScrollLock",224:"Meta"};module.exports=getEventKey},function(module,exports,__webpack_require__){"use strict";function getIteratorFn(maybeIterable){var iteratorFn=maybeIterable&&(ITERATOR_SYMBOL&&maybeIterable[ITERATOR_SYMBOL]||maybeIterable[FAUX_ITERATOR_SYMBOL]);if("function"==typeof iteratorFn)return iteratorFn}var ITERATOR_SYMBOL="function"==typeof Symbol&&Symbol.iterator,FAUX_ITERATOR_SYMBOL="@@iterator";module.exports=getIteratorFn},function(module,exports,__webpack_require__){"use strict";function getLeafNode(node){for(;node&&node.firstChild;)node=node.firstChild;return node}function getSiblingNode(node){for(;node;){if(node.nextSibling)return node.nextSibling;node=node.parentNode}}function getNodeForCharacterOffset(root,offset){for(var node=getLeafNode(root),nodeStart=0,nodeEnd=0;node;){if(3===node.nodeType){if(nodeEnd=nodeStart+node.textContent.length,nodeStart<=offset&&nodeEnd>=offset)return{node:node,offset:offset-nodeStart};nodeStart=nodeEnd}node=getLeafNode(getSiblingNode(node))}}module.exports=getNodeForCharacterOffset},function(module,exports,__webpack_require__){"use strict";function makePrefixMap(styleProp,eventName){var prefixes={};return prefixes[styleProp.toLowerCase()]=eventName.toLowerCase(),prefixes["Webkit"+styleProp]="webkit"+eventName,prefixes["Moz"+styleProp]="moz"+eventName,prefixes["ms"+styleProp]="MS"+eventName,prefixes["O"+styleProp]="o"+eventName.toLowerCase(),prefixes}function getVendorPrefixedEventName(eventName){if(prefixedEventNames[eventName])return prefixedEventNames[eventName];if(!vendorPrefixes[eventName])return eventName;var prefixMap=vendorPrefixes[eventName];for(var styleProp in prefixMap)if(prefixMap.hasOwnProperty(styleProp)&&styleProp in style)return prefixedEventNames[eventName]=prefixMap[styleProp];return""}var ExecutionEnvironment=__webpack_require__(9),vendorPrefixes={animationend:makePrefixMap("Animation","AnimationEnd"),animationiteration:makePrefixMap("Animation","AnimationIteration"),animationstart:makePrefixMap("Animation","AnimationStart"),transitionend:makePrefixMap("Transition","TransitionEnd")},prefixedEventNames={},style={};ExecutionEnvironment.canUseDOM&&(style=document.createElement("div").style,"AnimationEvent"in window||(delete vendorPrefixes.animationend.animation,delete vendorPrefixes.animationiteration.animation,delete vendorPrefixes.animationstart.animation),"TransitionEvent"in window||delete vendorPrefixes.transitionend.transition),module.exports=getVendorPrefixedEventName},function(module,exports,__webpack_require__){"use strict";function quoteAttributeValueForBrowser(value){return'"'+escapeTextContentForBrowser(value)+'"'}var escapeTextContentForBrowser=__webpack_require__(43);module.exports=quoteAttributeValueForBrowser},function(module,exports,__webpack_require__){"use strict";var ReactMount=__webpack_require__(111);module.exports=ReactMount.renderSubtreeIntoContainer},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function reactElementToJSXString(ReactElement){function toJSXString(_ref2){var _ref2$ReactElement=_ref2.ReactElement,Element=void 0===_ref2$ReactElement?null:_ref2$ReactElement,_ref2$lvl=_ref2.lvl,lvl=void 0===_ref2$lvl?0:_ref2$lvl,_ref2$inline=_ref2.inline,inline=void 0!==_ref2$inline&&_ref2$inline;if("string"==typeof Element||"number"==typeof Element)return Element;if(!(0,_react.isValidElement)(Element))throw new Error("react-element-to-jsx-string: Expected a ReactElement,\ngot `"+(void 0===Element?"undefined":_typeof(Element))+"`");var tagName=getDisplayName(Element),out="<"+tagName,props=formatProps(Element.props,getDefaultProps(Element),inline,sortProps,lvl),attributes=[],children=_react2.default.Children.toArray(Element.props.children).filter(onlyMeaningfulChildren);null!==Element.ref&&attributes.push(getJSXAttribute("ref",Element.ref,inline,lvl)),null===Element.key||/^\./.test(Element.key)||attributes.push(getJSXAttribute("key",Element.key,inline,lvl)),attributes=attributes.concat(props).filter(function(_ref3){var name=_ref3.name;return-1===filterProps.indexOf(name)});var outMultilineAttr=out,outInlineAttr=out,containsMultilineAttr=!1;return attributes.forEach(function(attribute){var isMultilineAttr=!1;["plainObject","array","function"].indexOf(attribute.type)>-1&&(isMultilineAttr=attribute.value.indexOf("\n")>-1),isMultilineAttr&&(containsMultilineAttr=!0),outInlineAttr+=" ",outMultilineAttr+="\n"+spacer(lvl+1,tabStop),useBooleanShorthandSyntax&&"{true}"===attribute.value?(outInlineAttr+=""+attribute.name,outMultilineAttr+=""+attribute.name):(outInlineAttr+=attribute.name+"="+attribute.value,outMultilineAttr+=attribute.name+"="+attribute.value)}),outMultilineAttr+="\n"+spacer(lvl,tabStop),out=shouldRenderMultilineAttr(attributes,outInlineAttr,containsMultilineAttr,inline,lvl)?outMultilineAttr:outInlineAttr,children.length>0?(out+=">",lvl++,inline||(out+="\n",out+=spacer(lvl,tabStop)),out+="string"==typeof children?children:children.reduce(mergePlainStringChildren,[]).map(recurse({lvl:lvl,inline:inline})).join("\n"+spacer(lvl,tabStop)),inline||(out+="\n",out+=spacer(lvl-1,tabStop)),out+="</"+tagName+">"):(isInlineAttributeTooLong(attributes,outInlineAttr,lvl)||(out+=" "),out+="/>"),out}function shouldRenderMultilineAttr(attributes,inlineAttributeString,containsMultilineAttr,inline,lvl){return(isInlineAttributeTooLong(attributes,inlineAttributeString,lvl)||containsMultilineAttr)&&!inline}function isInlineAttributeTooLong(attributes,inlineAttributeString,lvl){return void 0===maxInlineAttributesLineLength?attributes.length>1:spacer(lvl,tabStop).length+inlineAttributeString.length>maxInlineAttributesLineLength}function formatProps(props,defaultProps,inline,sortProps,lvl){var formatted=Object.keys(props).filter(noChildren);return useBooleanShorthandSyntax&&(formatted=formatted.filter(function(key){return noFalse(props[key],defaultProps[key])})),showDefaultProps||(formatted=formatted.filter(function(key){return void 0===defaultProps[key]?void 0!==props[key]:defaultProps[key]!==props[key]})),sortProps&&(formatted=formatted.sort()),formatted.map(function(propName){return getJSXAttribute(propName,props[propName],inline,lvl)})}function getJSXAttribute(name,value,inline,lvl){return{name:name,type:getValueType(value),value:formatJSXAttribute(value,inline,lvl).replace(/'?<__reactElementToJSXString__Wrapper__>/g,"").replace(/<\/__reactElementToJSXString__Wrapper__>'?/g,"")}}function formatJSXAttribute(propValue,inline,lvl){return"string"==typeof propValue?'"'+escape(propValue)+'"':"symbol"===(void 0===propValue?"undefined":_typeof(propValue))?"{"+propValue.toString()+"}":"{"+formatValue(propValue,inline,lvl)+"}"}function getValueType(value){return(0,_react.isValidElement)(value)?"element":(0,_isPlainObject2.default)(value)?"plainObject":Array.isArray(value)?"array":void 0===value?"undefined":_typeof(value)}function isFunction(value){return"function"==typeof value}function formatValue(value,inline,lvl){var wrapper="__reactElementToJSXString__Wrapper__";return isFunction(value)?functionValue(!1===showFunctions&&functionValue===defaultFunctionValue?function(){}:value):(0,_react.isValidElement)(value)?"<"+wrapper+">"+toJSXString({ReactElement:value,inline:!0})+"</"+wrapper+">":(0,_isPlainObject2.default)(value)||Array.isArray(value)?"<"+wrapper+">"+stringifyObject(value,inline,lvl)+"</"+wrapper+">":value}function recurse(_ref4){var lvl=_ref4.lvl,inline=_ref4.inline;return function(Element){return toJSXString({ReactElement:Element,lvl:lvl,inline:inline})}}function stringifyObject(obj,inline,lvl){(Object.keys(obj).length>0||obj.length>0)&&(obj=(0,_traverse2.default)(obj).map(function(value){((0,_react.isValidElement)(value)||this.isLeaf)&&this.update(formatValue(value,inline,lvl))}),obj=(0,_sortobject2.default)(obj));var stringified=(0,_stringifyObject2.default)(obj);return inline?(0,_collapseWhiteSpace2.default)(stringified).replace(/{ /g,"{").replace(/ }/g,"}").replace(/\[ /g,"[").replace(/ ]/g,"]"):stringified.replace(/\\\'/g,"'").replace(/\t/g,spacer(1,tabStop)).replace(/\n([^$])/g,"\n"+spacer(lvl+1,tabStop)+"$1")}var _ref=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},displayName=_ref.displayName,_ref$filterProps=_ref.filterProps,filterProps=void 0===_ref$filterProps?[]:_ref$filterProps,_ref$showDefaultProps=_ref.showDefaultProps,showDefaultProps=void 0===_ref$showDefaultProps||_ref$showDefaultProps,_ref$showFunctions=_ref.showFunctions,showFunctions=void 0!==_ref$showFunctions&&_ref$showFunctions,_ref$functionValue=_ref.functionValue,functionValue=void 0===_ref$functionValue?defaultFunctionValue:_ref$functionValue,_ref$tabStop=_ref.tabStop,tabStop=void 0===_ref$tabStop?2:_ref$tabStop,_ref$useBooleanShorth=_ref.useBooleanShorthandSyntax,useBooleanShorthandSyntax=void 0===_ref$useBooleanShorth||_ref$useBooleanShorth,maxInlineAttributesLineLength=_ref.maxInlineAttributesLineLength,_ref$sortProps=_ref.sortProps,sortProps=void 0===_ref$sortProps||_ref$sortProps,getDisplayName=displayName||getDefaultDisplayName;return toJSXString({ReactElement:ReactElement})}function getDefaultDisplayName(ReactElement){return ReactElement.type.displayName||ReactElement.type.name||("function"==typeof ReactElement.type?"No Display Name":ReactElement.type)}function getDefaultProps(ReactElement){return ReactElement.type.defaultProps||{}}function mergePlainStringChildren(prev,cur){var lastItem=prev[prev.length-1];return"number"==typeof cur&&(cur=String(cur)),"string"==typeof lastItem&&"string"==typeof cur?prev[prev.length-1]+=cur:prev.push(cur),prev}function spacer(times,tabStop){return 0===times?"":(0,_fill3.default)(new Array(times*tabStop)," ").join("")}function noChildren(propName){return"children"!==propName}function noFalse(propValue,defaultValue){return"boolean"!=typeof propValue||propValue||Boolean(defaultValue)}function onlyMeaningfulChildren(children){return!0!==children&&!1!==children&&null!==children&&""!==children}Object.defineProperty(exports,"__esModule",{value:!0});var _fill2=__webpack_require__(215),_fill3=_interopRequireDefault(_fill2),_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj};exports.default=reactElementToJSXString;var _react=__webpack_require__(10),_react2=_interopRequireDefault(_react),_collapseWhiteSpace=__webpack_require__(186),_collapseWhiteSpace2=_interopRequireDefault(_collapseWhiteSpace),_isPlainObject=__webpack_require__(203),_isPlainObject2=_interopRequireDefault(_isPlainObject),_stringifyObject=__webpack_require__(148),_stringifyObject2=_interopRequireDefault(_stringifyObject),_sortobject=__webpack_require__(312),_sortobject2=_interopRequireDefault(_sortobject),_traverse=__webpack_require__(313),_traverse2=_interopRequireDefault(_traverse),escape=function(s){return s.replace(/"/g,"&quot;")},defaultFunctionValue=function(fn){return fn}},function(module,exports,__webpack_require__){"use strict";function escape(key){var escaperLookup={"=":"=0",":":"=2"};return"$"+(""+key).replace(/[=:]/g,function(match){return escaperLookup[match]})}function unescape(key){var unescapeRegex=/(=0|=2)/g,unescaperLookup={"=0":"=","=2":":"};return(""+("."===key[0]&&"$"===key[1]?key.substring(2):key.substring(1))).replace(unescapeRegex,function(match){return unescaperLookup[match]})}var KeyEscapeUtils={escape:escape,unescape:unescape};module.exports=KeyEscapeUtils},function(module,exports,__webpack_require__){"use strict";(function(process){var _prodInvariant=__webpack_require__(29),invariant=__webpack_require__(1),oneArgumentPooler=function(copyFieldsFrom){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,copyFieldsFrom),instance}return new Klass(copyFieldsFrom)},twoArgumentPooler=function(a1,a2){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2),instance}return new Klass(a1,a2)},threeArgumentPooler=function(a1,a2,a3){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2,a3),instance}return new Klass(a1,a2,a3)},fourArgumentPooler=function(a1,a2,a3,a4){var Klass=this;if(Klass.instancePool.length){var instance=Klass.instancePool.pop();return Klass.call(instance,a1,a2,a3,a4),instance}return new Klass(a1,a2,a3,a4)},standardReleaser=function(instance){var Klass=this;instance instanceof Klass||("production"!==process.env.NODE_ENV?invariant(!1,"Trying to release an instance into a pool of a different type."):_prodInvariant("25")),instance.destructor(),Klass.instancePool.length<Klass.poolSize&&Klass.instancePool.push(instance)},DEFAULT_POOLER=oneArgumentPooler,addPoolingTo=function(CopyConstructor,pooler){var NewKlass=CopyConstructor;return NewKlass.instancePool=[],NewKlass.getPooled=pooler||DEFAULT_POOLER,NewKlass.poolSize||(NewKlass.poolSize=10),NewKlass.release=standardReleaser,NewKlass},PooledClass={addPoolingTo:addPoolingTo,oneArgumentPooler:oneArgumentPooler,twoArgumentPooler:twoArgumentPooler,threeArgumentPooler:threeArgumentPooler,fourArgumentPooler:fourArgumentPooler};module.exports=PooledClass}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";function escapeUserProvidedKey(text){return(""+text).replace(userProvidedKeyEscapeRegex,"$&/")}function ForEachBookKeeping(forEachFunction,forEachContext){this.func=forEachFunction,this.context=forEachContext,this.count=0}function forEachSingleChild(bookKeeping,child,name){var func=bookKeeping.func,context=bookKeeping.context;func.call(context,child,bookKeeping.count++)}function forEachChildren(children,forEachFunc,forEachContext){if(null==children)return children;var traverseContext=ForEachBookKeeping.getPooled(forEachFunc,forEachContext);traverseAllChildren(children,forEachSingleChild,traverseContext),ForEachBookKeeping.release(traverseContext)}function MapBookKeeping(mapResult,keyPrefix,mapFunction,mapContext){this.result=mapResult,this.keyPrefix=keyPrefix,this.func=mapFunction,this.context=mapContext,this.count=0}function mapSingleChildIntoContext(bookKeeping,child,childKey){var result=bookKeeping.result,keyPrefix=bookKeeping.keyPrefix,func=bookKeeping.func,context=bookKeeping.context,mappedChild=func.call(context,child,bookKeeping.count++);Array.isArray(mappedChild)?mapIntoWithKeyPrefixInternal(mappedChild,result,childKey,emptyFunction.thatReturnsArgument):null!=mappedChild&&(ReactElement.isValidElement(mappedChild)&&(mappedChild=ReactElement.cloneAndReplaceKey(mappedChild,keyPrefix+(!mappedChild.key||child&&child.key===mappedChild.key?"":escapeUserProvidedKey(mappedChild.key)+"/")+childKey)),result.push(mappedChild))}function mapIntoWithKeyPrefixInternal(children,array,prefix,func,context){var escapedPrefix="";null!=prefix&&(escapedPrefix=escapeUserProvidedKey(prefix)+"/");var traverseContext=MapBookKeeping.getPooled(array,escapedPrefix,func,context);traverseAllChildren(children,mapSingleChildIntoContext,traverseContext),MapBookKeeping.release(traverseContext)}function mapChildren(children,func,context){if(null==children)return children;var result=[];return mapIntoWithKeyPrefixInternal(children,result,null,func,context),result}function forEachSingleChildDummy(traverseContext,child,name){return null}function countChildren(children,context){return traverseAllChildren(children,forEachSingleChildDummy,null)}function toArray(children){var result=[];return mapIntoWithKeyPrefixInternal(children,result,null,emptyFunction.thatReturnsArgument),result}var PooledClass=__webpack_require__(300),ReactElement=__webpack_require__(24),emptyFunction=__webpack_require__(12),traverseAllChildren=__webpack_require__(311),twoArgumentPooler=PooledClass.twoArgumentPooler,fourArgumentPooler=PooledClass.fourArgumentPooler,userProvidedKeyEscapeRegex=/\/+/g;ForEachBookKeeping.prototype.destructor=function(){this.func=null,this.context=null,this.count=0},PooledClass.addPoolingTo(ForEachBookKeeping,twoArgumentPooler),MapBookKeeping.prototype.destructor=function(){this.result=null,this.keyPrefix=null,this.func=null,this.context=null,this.count=0},PooledClass.addPoolingTo(MapBookKeeping,fourArgumentPooler);var ReactChildren={forEach:forEachChildren,map:mapChildren,mapIntoWithKeyPrefixInternal:mapIntoWithKeyPrefixInternal,count:countChildren,toArray:toArray};module.exports=ReactChildren},function(module,exports,__webpack_require__){"use strict";(function(process){var ReactElement=__webpack_require__(24),createDOMFactory=ReactElement.createFactory;if("production"!==process.env.NODE_ENV){createDOMFactory=__webpack_require__(126).createFactory}var ReactDOMFactories={a:createDOMFactory("a"),abbr:createDOMFactory("abbr"),address:createDOMFactory("address"),area:createDOMFactory("area"),article:createDOMFactory("article"),aside:createDOMFactory("aside"),audio:createDOMFactory("audio"),b:createDOMFactory("b"),base:createDOMFactory("base"),bdi:createDOMFactory("bdi"),bdo:createDOMFactory("bdo"),big:createDOMFactory("big"),blockquote:createDOMFactory("blockquote"),body:createDOMFactory("body"),br:createDOMFactory("br"),button:createDOMFactory("button"),canvas:createDOMFactory("canvas"),caption:createDOMFactory("caption"),cite:createDOMFactory("cite"),code:createDOMFactory("code"),col:createDOMFactory("col"),colgroup:createDOMFactory("colgroup"),data:createDOMFactory("data"),datalist:createDOMFactory("datalist"),dd:createDOMFactory("dd"),del:createDOMFactory("del"),details:createDOMFactory("details"),dfn:createDOMFactory("dfn"),dialog:createDOMFactory("dialog"),div:createDOMFactory("div"),dl:createDOMFactory("dl"),dt:createDOMFactory("dt"),em:createDOMFactory("em"),embed:createDOMFactory("embed"),fieldset:createDOMFactory("fieldset"),figcaption:createDOMFactory("figcaption"),figure:createDOMFactory("figure"),footer:createDOMFactory("footer"),form:createDOMFactory("form"),h1:createDOMFactory("h1"),h2:createDOMFactory("h2"),h3:createDOMFactory("h3"),h4:createDOMFactory("h4"),h5:createDOMFactory("h5"),h6:createDOMFactory("h6"),head:createDOMFactory("head"),header:createDOMFactory("header"),hgroup:createDOMFactory("hgroup"),hr:createDOMFactory("hr"),html:createDOMFactory("html"),i:createDOMFactory("i"),iframe:createDOMFactory("iframe"),img:createDOMFactory("img"),input:createDOMFactory("input"),ins:createDOMFactory("ins"),kbd:createDOMFactory("kbd"),keygen:createDOMFactory("keygen"),label:createDOMFactory("label"),legend:createDOMFactory("legend"),li:createDOMFactory("li"),link:createDOMFactory("link"),main:createDOMFactory("main"),map:createDOMFactory("map"),mark:createDOMFactory("mark"),menu:createDOMFactory("menu"),menuitem:createDOMFactory("menuitem"),meta:createDOMFactory("meta"),meter:createDOMFactory("meter"),nav:createDOMFactory("nav"),noscript:createDOMFactory("noscript"),object:createDOMFactory("object"),ol:createDOMFactory("ol"),optgroup:createDOMFactory("optgroup"),option:createDOMFactory("option"),output:createDOMFactory("output"),p:createDOMFactory("p"),param:createDOMFactory("param"),picture:createDOMFactory("picture"),pre:createDOMFactory("pre"),progress:createDOMFactory("progress"),q:createDOMFactory("q"),rp:createDOMFactory("rp"),rt:createDOMFactory("rt"),ruby:createDOMFactory("ruby"),s:createDOMFactory("s"),samp:createDOMFactory("samp"),script:createDOMFactory("script"),section:createDOMFactory("section"),select:createDOMFactory("select"),small:createDOMFactory("small"),source:createDOMFactory("source"),span:createDOMFactory("span"),strong:createDOMFactory("strong"),style:createDOMFactory("style"),sub:createDOMFactory("sub"),summary:createDOMFactory("summary"),sup:createDOMFactory("sup"),table:createDOMFactory("table"),tbody:createDOMFactory("tbody"),td:createDOMFactory("td"),textarea:createDOMFactory("textarea"),tfoot:createDOMFactory("tfoot"),th:createDOMFactory("th"),thead:createDOMFactory("thead"),time:createDOMFactory("time"),title:createDOMFactory("title"),tr:createDOMFactory("tr"),track:createDOMFactory("track"),u:createDOMFactory("u"),ul:createDOMFactory("ul"),var:createDOMFactory("var"),video:createDOMFactory("video"),wbr:createDOMFactory("wbr"),circle:createDOMFactory("circle"),clipPath:createDOMFactory("clipPath"),defs:createDOMFactory("defs"),ellipse:createDOMFactory("ellipse"),g:createDOMFactory("g"),image:createDOMFactory("image"),line:createDOMFactory("line"),linearGradient:createDOMFactory("linearGradient"),mask:createDOMFactory("mask"),path:createDOMFactory("path"),pattern:createDOMFactory("pattern"),polygon:createDOMFactory("polygon"),polyline:createDOMFactory("polyline"),radialGradient:createDOMFactory("radialGradient"),rect:createDOMFactory("rect"),stop:createDOMFactory("stop"),svg:createDOMFactory("svg"),text:createDOMFactory("text"),tspan:createDOMFactory("tspan")};module.exports=ReactDOMFactories}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){var ReactPropTypeLocationNames={};"production"!==process.env.NODE_ENV&&(ReactPropTypeLocationNames={prop:"prop",context:"context",childContext:"child context"}),module.exports=ReactPropTypeLocationNames}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var _require=__webpack_require__(24),isValidElement=_require.isValidElement,factory=__webpack_require__(100);module.exports=factory(isValidElement)},function(module,exports,__webpack_require__){"use strict";module.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(module,exports,__webpack_require__){"use strict";module.exports="15.6.1"},function(module,exports,__webpack_require__){"use strict";(function(process){function checkReactTypeSpec(typeSpecs,values,location,componentName,element,debugID){for(var typeSpecName in typeSpecs)if(typeSpecs.hasOwnProperty(typeSpecName)){var error;try{"function"!=typeof typeSpecs[typeSpecName]&&("production"!==process.env.NODE_ENV?invariant(!1,"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName):_prodInvariant("84",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName)),error=typeSpecs[typeSpecName](values,typeSpecName,componentName,location,null,ReactPropTypesSecret)}catch(ex){error=ex}if("production"!==process.env.NODE_ENV&&warning(!error||error instanceof Error,"%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",componentName||"React class",ReactPropTypeLocationNames[location],typeSpecName,typeof error),error instanceof Error&&!(error.message in loggedTypeFailures)){loggedTypeFailures[error.message]=!0;var componentStackInfo="";"production"!==process.env.NODE_ENV&&(ReactComponentTreeHook||(ReactComponentTreeHook=__webpack_require__(11)),null!==debugID?componentStackInfo=ReactComponentTreeHook.getStackAddendumByID(debugID):null!==element&&(componentStackInfo=ReactComponentTreeHook.getCurrentStackAddendum(element))),"production"!==process.env.NODE_ENV&&warning(!1,"Failed %s type: %s%s",location,error.message,componentStackInfo)}}}var ReactComponentTreeHook,_prodInvariant=__webpack_require__(29),ReactPropTypeLocationNames=__webpack_require__(303),ReactPropTypesSecret=__webpack_require__(305),invariant=__webpack_require__(1),warning=__webpack_require__(2);void 0!==process&&process.env&&"test"===process.env.NODE_ENV&&(ReactComponentTreeHook=__webpack_require__(11));var loggedTypeFailures={};module.exports=checkReactTypeSpec}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var _require=__webpack_require__(124),Component=_require.Component,_require2=__webpack_require__(24),isValidElement=_require2.isValidElement,ReactNoopUpdateQueue=__webpack_require__(127),factory=__webpack_require__(187);module.exports=factory(Component,isValidElement,ReactNoopUpdateQueue)},function(module,exports,__webpack_require__){"use strict";function getNextDebugID(){return nextDebugID++}var nextDebugID=1;module.exports=getNextDebugID},function(module,exports,__webpack_require__){"use strict";(function(process){function onlyChild(children){return ReactElement.isValidElement(children)||("production"!==process.env.NODE_ENV?invariant(!1,"React.Children.only expected to receive a single React element child."):_prodInvariant("143")),children}var _prodInvariant=__webpack_require__(29),ReactElement=__webpack_require__(24),invariant=__webpack_require__(1);module.exports=onlyChild}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";(function(process){function getComponentKey(component,index){return component&&"object"==typeof component&&null!=component.key?KeyEscapeUtils.escape(component.key):index.toString(36)}function traverseAllChildrenImpl(children,nameSoFar,callback,traverseContext){var type=typeof children;if("undefined"!==type&&"boolean"!==type||(children=null),null===children||"string"===type||"number"===type||"object"===type&&children.$$typeof===REACT_ELEMENT_TYPE)return callback(traverseContext,children,""===nameSoFar?SEPARATOR+getComponentKey(children,0):nameSoFar),1;var child,nextName,subtreeCount=0,nextNamePrefix=""===nameSoFar?SEPARATOR:nameSoFar+SUBSEPARATOR;if(Array.isArray(children))for(var i=0;i<children.length;i++)child=children[i],nextName=nextNamePrefix+getComponentKey(child,i),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext);else{var iteratorFn=getIteratorFn(children);if(iteratorFn){var step,iterator=iteratorFn.call(children);if(iteratorFn!==children.entries)for(var ii=0;!(step=iterator.next()).done;)child=step.value,nextName=nextNamePrefix+getComponentKey(child,ii++),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext);else{if("production"!==process.env.NODE_ENV){var mapsAsChildrenAddendum="";if(ReactCurrentOwner.current){var mapsAsChildrenOwnerName=ReactCurrentOwner.current.getName();mapsAsChildrenOwnerName&&(mapsAsChildrenAddendum=" Check the render method of `"+mapsAsChildrenOwnerName+"`.")}"production"!==process.env.NODE_ENV&&warning(didWarnAboutMaps,"Using Maps as children is not yet fully supported. It is an experimental feature that might be removed. Convert it to a sequence / iterable of keyed ReactElements instead.%s",mapsAsChildrenAddendum),didWarnAboutMaps=!0}for(;!(step=iterator.next()).done;){var entry=step.value;entry&&(child=entry[1],nextName=nextNamePrefix+KeyEscapeUtils.escape(entry[0])+SUBSEPARATOR+getComponentKey(child,0),subtreeCount+=traverseAllChildrenImpl(child,nextName,callback,traverseContext))}}}else if("object"===type){var addendum="";if("production"!==process.env.NODE_ENV&&(addendum=" If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons.",children._isReactElement&&(addendum=" It looks like you're using an element created by a different version of React. Make sure to use only one copy of React."),ReactCurrentOwner.current)){var name=ReactCurrentOwner.current.getName();name&&(addendum+=" Check the render method of `"+name+"`.")}var childrenString=String(children);"production"!==process.env.NODE_ENV?invariant(!1,"Objects are not valid as a React child (found: %s).%s","[object Object]"===childrenString?"object with keys {"+Object.keys(children).join(", ")+"}":childrenString,addendum):_prodInvariant("31","[object Object]"===childrenString?"object with keys {"+Object.keys(children).join(", ")+"}":childrenString,addendum)}}return subtreeCount}function traverseAllChildren(children,callback,traverseContext){return null==children?0:traverseAllChildrenImpl(children,"",callback,traverseContext)}var _prodInvariant=__webpack_require__(29),ReactCurrentOwner=__webpack_require__(18),REACT_ELEMENT_TYPE=__webpack_require__(125),getIteratorFn=__webpack_require__(128),invariant=__webpack_require__(1),KeyEscapeUtils=__webpack_require__(299),warning=__webpack_require__(2),SEPARATOR=".",SUBSEPARATOR=":",didWarnAboutMaps=!1;module.exports=traverseAllChildren}).call(exports,__webpack_require__(0))},function(module,exports,__webpack_require__){"use strict";var _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol?"symbol":typeof obj};module.exports=function sortObject(obj,comparator){if(Array.isArray(obj)){for(var result=[],i=0;i<obj.length;++i){var value=obj[i];null!=value&&"object"===(void 0===value?"undefined":_typeof(value))&&(value=sortObject(value,comparator)),result.push(value)}return result}for(var _result={},sortedKeys=Object.keys(obj).sort(comparator),_i=0;_i<sortedKeys.length;++_i){var key=sortedKeys[_i],_value=obj[key];null!=_value&&"object"===(void 0===_value?"undefined":_typeof(_value))&&(_value=sortObject(_value,comparator)),_result[key]=_value}return _result}},function(module,exports){function Traverse(obj){this.value=obj}function walk(root,cb,immutable){var path=[],parents=[],alive=!0;return function walker(node_){function updateState(){if("object"==typeof state.node&&null!==state.node){state.keys&&state.node_===state.node||(state.keys=objectKeys(state.node)),state.isLeaf=0==state.keys.length;for(var i=0;i<parents.length;i++)if(parents[i].node_===node_){state.circular=parents[i];break}}else state.isLeaf=!0,state.keys=null;state.notLeaf=!state.isLeaf,state.notRoot=!state.isRoot}var node=immutable?copy(node_):node_,modifiers={},keepGoing=!0,state={node:node,node_:node_,path:[].concat(path),parent:parents[parents.length-1],parents:parents,key:path.slice(-1)[0],isRoot:0===path.length,level:path.length,circular:null,update:function(x,stopHere){state.isRoot||(state.parent.node[state.key]=x),state.node=x,stopHere&&(keepGoing=!1)},delete:function(stopHere){delete state.parent.node[state.key],stopHere&&(keepGoing=!1)},remove:function(stopHere){isArray(state.parent.node)?state.parent.node.splice(state.key,1):delete state.parent.node[state.key],stopHere&&(keepGoing=!1)},keys:null,before:function(f){modifiers.before=f},after:function(f){modifiers.after=f},pre:function(f){modifiers.pre=f},post:function(f){modifiers.post=f},stop:function(){alive=!1},block:function(){keepGoing=!1}};if(!alive)return state;updateState();var ret=cb.call(state,state.node);return void 0!==ret&&state.update&&state.update(ret),modifiers.before&&modifiers.before.call(state,state.node),keepGoing?("object"!=typeof state.node||null===state.node||state.circular||(parents.push(state),updateState(),forEach(state.keys,function(key,i){path.push(key),modifiers.pre&&modifiers.pre.call(state,state.node[key],key);var child=walker(state.node[key]);immutable&&hasOwnProperty.call(state.node,key)&&(state.node[key]=child.node),child.isLast=i==state.keys.length-1,child.isFirst=0==i,modifiers.post&&modifiers.post.call(state,child),path.pop()}),parents.pop()),modifiers.after&&modifiers.after.call(state,state.node),state):state}(root).node}function copy(src){if("object"==typeof src&&null!==src){var dst;if(isArray(src))dst=[];else if(isDate(src))dst=new Date(src.getTime?src.getTime():src);else if(isRegExp(src))dst=new RegExp(src);else if(isError(src))dst={message:src.message};else if(isBoolean(src))dst=new Boolean(src);else if(isNumber(src))dst=new Number(src);else if(isString(src))dst=new String(src);else if(Object.create&&Object.getPrototypeOf)dst=Object.create(Object.getPrototypeOf(src));else if(src.constructor===Object)dst={};else{var proto=src.constructor&&src.constructor.prototype||src.__proto__||{},T=function(){};T.prototype=proto,dst=new T}return forEach(objectKeys(src),function(key){dst[key]=src[key]}),dst}return src}function toS(obj){return Object.prototype.toString.call(obj)}function isDate(obj){return"[object Date]"===toS(obj)}function isRegExp(obj){return"[object RegExp]"===toS(obj)}function isError(obj){return"[object Error]"===toS(obj)}function isBoolean(obj){return"[object Boolean]"===toS(obj)}function isNumber(obj){return"[object Number]"===toS(obj)}function isString(obj){return"[object String]"===toS(obj)}var traverse=module.exports=function(obj){return new Traverse(obj)};Traverse.prototype.get=function(ps){for(var node=this.value,i=0;i<ps.length;i++){var key=ps[i];if(!node||!hasOwnProperty.call(node,key)){node=void 0;break}node=node[key]}return node},Traverse.prototype.has=function(ps){for(var node=this.value,i=0;i<ps.length;i++){var key=ps[i];if(!node||!hasOwnProperty.call(node,key))return!1;node=node[key]}return!0},Traverse.prototype.set=function(ps,value){for(var node=this.value,i=0;i<ps.length-1;i++){var key=ps[i];hasOwnProperty.call(node,key)||(node[key]={}),node=node[key]}return node[ps[i]]=value,value},Traverse.prototype.map=function(cb){return walk(this.value,cb,!0)},Traverse.prototype.forEach=function(cb){return this.value=walk(this.value,cb,!1),this.value},Traverse.prototype.reduce=function(cb,init){var skip=1===arguments.length,acc=skip?this.value:init;return this.forEach(function(x){this.isRoot&&skip||(acc=cb.call(this,acc,x))}),acc},Traverse.prototype.paths=function(){var acc=[];return this.forEach(function(x){acc.push(this.path)}),acc},Traverse.prototype.nodes=function(){var acc=[];return this.forEach(function(x){acc.push(this.node)}),acc},Traverse.prototype.clone=function(){var parents=[],nodes=[];return function clone(src){for(var i=0;i<parents.length;i++)if(parents[i]===src)return nodes[i];if("object"==typeof src&&null!==src){var dst=copy(src);return parents.push(src),nodes.push(dst),forEach(objectKeys(src),function(key){dst[key]=clone(src[key])}),parents.pop(),nodes.pop(),dst}return src}(this.value)};var objectKeys=Object.keys||function(obj){var res=[];for(var key in obj)res.push(key);return res},isArray=Array.isArray||function(xs){return"[object Array]"===Object.prototype.toString.call(xs)},forEach=function(xs,fn){if(xs.forEach)return xs.forEach(fn);for(var i=0;i<xs.length;i++)fn(xs[i],i,xs)};forEach(objectKeys(Traverse.prototype),function(key){traverse[key]=function(obj){var args=[].slice.call(arguments,1),t=new Traverse(obj);return t[key].apply(t,args)}});var hasOwnProperty=Object.hasOwnProperty||function(obj,key){return key in obj}},function(module,exports){module.exports={"core/src/components/Badge/Badge.jsx":[{description:"",methods:[],props:{children:{type:{name:"union",value:[{name:"node"},{name:"string"}]},required:!0,description:"<p>In most cases this will be the badge&#39;s label, but you could also use this\nto nest more advanced JSX.</p>\n"}}}],"core/src/components/Alert/Alert.jsx":[{description:"",methods:[{name:"heading",docblock:null,modifiers:[],params:[],returns:null}],props:{children:{type:{name:"node"},required:!0,description:""},heading:{type:{name:"string"},required:!1,description:""},role:{type:{name:"enum",value:[{value:"'alert'",computed:!1},{value:"'alertdialog'",computed:!1}]},required:!1,description:"<p>ARIA <code>role</code></p>\n"},variation:{type:{name:"enum",value:[{value:"'error'",computed:!1},{value:"'warn'",computed:!1},{value:"'success'",computed:!1}]},required:!1,description:""}}}],"core/src/components/Button/Button.jsx":[{description:"<p>The <code>Button</code> component accepts its text as children (AKA inner HTML), which\nmeans you can also pass in HTML or custom components. This gives you a lot of\nflexibility and supports a variety of advanced use cases. The most common use\ncase would be passing in an SVG icon along with the text.</p>\n<p>In addition to the supported props listed, you can also pass in additional\nprops, which will be passed to the rendered root component. For example,\nyou could pass in a <code>target</code> prop to pass to the rendered anchor element.</p>\n",methods:[{name:"attrs",docblock:null,modifiers:[],params:[],returns:null},{name:"classNames",docblock:null,modifiers:[],params:[],returns:null},{name:"handleClick",docblock:null,modifiers:[],params:[{name:"e",type:null}],returns:null}],props:{children:{type:{name:"node"},required:!0,description:""},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root button element.\nUseful for adding utility classes.</p>\n"},component:{type:{name:"union",value:[{name:"element"},{name:"func"}]},required:!1,description:"<p>When provided, this will render the passed in component. This is useful when\nintegrating with React Router&#39;s <code>&lt;Link&gt;</code> or using your own custom component.</p>\n"},disabled:{type:{name:"bool"},required:!1,description:""},href:{type:{name:"string"},required:!1,description:"<p>When provided the root component will render as an <code>&lt;a&gt;</code> element\nrather than <code>button</code>.</p>\n"},inverse:{type:{name:"bool"},required:!1,description:"<p>Applies the inverse theme styling</p>\n"},onClick:{type:{name:"func"},required:!1,description:'<p>Returns the <a href="https://facebook.github.io/react/docs/events.html"><code>SyntheticEvent</code></a>.\nNot called when the button is disabled.</p>\n'},size:{type:{name:"enum",value:[{value:"'small'",computed:!1},{value:"'big'",computed:!1}]},required:!1,description:""},type:{type:{name:"enum",value:[{value:"'button'",computed:!1},{value:"'submit'",computed:!1}]},required:!1,description:'<p>Button <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type"><code>type</code></a> attribute</p>\n',defaultValue:{value:"'button'",computed:!1}},variation:{type:{name:"enum",value:[{value:"'primary'",computed:!1},{value:"'danger'",computed:!1},{value:"'success'",computed:!1},{value:"'transparent'",computed:!1}]},required:!1,description:""}}}],"core/src/components/ChoiceList/Choice.jsx":[{description:"<p>A <code>Choice</code> component can be used to render a checkbox or radio button.</p>\n<p>Any <em>undocumented</em> props that you pass to this component will be passed\nto the <code>input</code> element, so you can use this to set additional attributes if\nnecessary.</p>\n",methods:[],props:{children:{type:{name:"node"},required:!0,description:"<p>Label text or HTML.</p>\n"},checked:{type:{name:"bool"},required:!1,description:"<p>Setting this prop will render a read-only field and require an <code>onChange</code>\nevent handler if you&#39;d want to check its checked stated. Use <code>defaultChecked</code>\nif you want the field to be mutable.</p>\n"},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root <code>div</code> element.</p>\n"},defaultChecked:{type:{name:"bool"},required:!1,description:"<p>Sets the initial checked state and allows the user to check/uncheck the\nfield without also requiring an <code>onChange</code> event handler.</p>\n"},id:{type:{name:"string"},required:!1,description:"<p>A unique ID to be used for the input field, as well as the label&#39;s\n<code>for</code> attribute. A unique ID will be generated if one isn&#39;t provided.</p>\n"},inversed:{type:{name:"bool"},required:!1,description:"<p>Applies the &quot;inverse&quot; UI theme</p>\n"},name:{type:{name:"string"},required:!0,description:"<p>The <code>input</code> <code>name</code> attribute</p>\n"},onBlur:{type:{name:"func"},required:!1,description:""},onChange:{type:{name:"func"},required:!1,description:""},type:{type:{name:"enum",value:[{value:"'checkbox'",computed:!1},{value:"'radio'",computed:!1}]},required:!1,description:"",defaultValue:{value:"'checkbox'",computed:!1}},value:{type:{name:"union",value:[{name:"number"},{name:"string"}]},required:!0,description:"<p>The <code>input</code> <code>value</code> attribute</p>\n"}}}],"core/src/components/ChoiceList/ChoiceList.jsx":[{description:"<p>A <code>ChoiceList</code> component can be used to render a <code>select</code> menu, radio\nbutton group, or checkbox group.</p>\n<p>You can manually pass in the <code>type</code> prop, but the real power of this component\nis unleashed when you let it determine the type of fields for you. It takes\ninto account accessibility and usability best practices, so you can pass in\nan array of choices and let it determine what type of field would be best for\nthe user.</p>\n",methods:[{name:"field",docblock:"Creates the field component(s) based on the type of field we've determined\nit should be.",modifiers:[],params:[],returns:null,description:"Creates the field component(s) based on the type of field we've determined\nit should be."},{name:"id",docblock:"If this is a <select> element, then we need to generate the ID here\nso it can be shared between the FormLabel and Select component",modifiers:[],params:[],returns:null,description:"If this is a <select> element, then we need to generate the ID here\nso it can be shared between the FormLabel and Select component"},{name:"select",docblock:"@param {object} selectProps\n@param {array} options - <option> components",modifiers:[],params:[{name:"selectProps",description:null,type:{name:"object"}},{name:"options",description:"<option> components",type:{name:"array"}}],returns:null,description:null},{name:"type",docblock:"Determines the type of field(s) we should render based on a few factors",modifiers:[],params:[],returns:null,description:"Determines the type of field(s) we should render based on a few factors"}],props:{choices:{type:{name:"arrayOf",value:{name:"shape",value:{checked:{name:"custom",raw:"Choice.propTypes.checked",required:!1},defaultChecked:{name:"custom",raw:"Choice.propTypes.defaultChecked",required:!1},disabled:{name:"custom",raw:"Choice.propTypes.disabled",required:!1},label:{name:"custom",raw:"Choice.propTypes.children",required:!1},value:{name:"custom",raw:"Choice.propTypes.value",required:!1}}}},required:!0,description:"<p>The list of choices to be rendered. The number of choices you pass in may\naffect the type of field(s) rendered. See <code>type</code> for more info.</p>\n"},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root element.</p>\n"},disabled:{type:{name:"bool"},required:!1,description:"<p>Disables the entire field.</p>\n"},errorMessage:{type:{name:"string"},required:!1,description:""},hint:{type:{name:"node"},required:!1,description:"<p>Hint text</p>\n"},inversed:{type:{name:"bool"},required:!1,description:"<p>Applies the &quot;inverse&quot; UI theme</p>\n"},label:{type:{name:"node"},required:!0,description:"<p>The label for the entire list of choices</p>\n"},labelClassName:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the <code>FormLabel</code>.</p>\n"},multiple:{type:{name:"bool"},required:!1,description:"<p>Allows the user to select multiple choices. Setting this to <code>true</code> results\nin a list of checkbox fields to be rendered.</p>\n"},name:{type:{name:"string"},required:!0,description:""},onBlur:{type:{name:"func"},required:!1,description:""},onChange:{type:{name:"func"},required:!1,description:""},type:{type:{name:"enum",value:[{value:"'checkbox'",computed:!1},{value:"'radio'",computed:!1},{value:"'select'",computed:!1}]},required:!1,description:"<p>You can manually set the <code>type</code> if you prefer things to be less magical.\nOtherwise, the type will be inferred by the other <code>props</code>, based\non what&#39;s best for accessibility and usability. If <code>multiple</code> is <code>true</code>, then\n<code>checkbox</code> fields will be rendered. If less than 10 choices are passed in,\nthen <code>radio</code> buttons will be rendered.</p>\n"}}}],"core/src/components/ChoiceList/Select.jsx":[{description:"<p>A <code>Select</code> component can be used to render an HTML <code>select</code> menu.\nAny <em>undocumented</em> props that you pass to this component will be passed\nto the <code>select</code> element, so you can use this to set additional attributes if\nnecessary.</p>\n",methods:[],props:{children:{type:{name:"node"},required:!0,description:""},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root <code>select</code> element.</p>\n"},defaultValue:{type:{name:"string"},required:!1,description:"<p>Sets the initial <code>selected</code> state and allows the user to select a different\noption without also requiring an <code>onChange</code> event handler.</p>\n"},disabled:{type:{name:"bool"},required:!1,description:""},id:{type:{name:"string"},required:!1,description:"<p>A unique ID to be used for the select field. A unique ID will be generated\nif one isn&#39;t provided.</p>\n"},inversed:{type:{name:"bool"},required:!1,description:"<p>Applies the &quot;inverse&quot; UI theme</p>\n"},multiple:{type:{name:"custom",raw:"function(props, propName, componentName) {\n  if (props[propName]) {\n    /* eslint-disable quotes */\n    return new Error(\n      `'${propName}' supplied to '${componentName}'. [A11Y]: Users often don’t` +\n      ` understand how to select multiple items from dropdowns. Use checkboxes instead.`\n    );\n    /* eslint-enable */\n  }\n}"},required:!1,description:"<p>Setting this prop to <code>true</code> will result in an error message due to\naccessibility concerns. See the usability guidelines for more info.</p>\n"},name:{type:{name:"string"},required:!0,description:""},onBlur:{type:{name:"func"},required:!1,description:""},onChange:{type:{name:"func"},required:!1,description:""},value:{type:{name:"string"},required:!1,description:"<p>Setting this prop will render a read-only field and require an <code>onChange</code>\nevent handler if you&#39;d want to change its <code>selected</code> stated. Use\n<code>defaultValue</code> if you want the field to be mutable.</p>\n"}}}],"core/src/components/FormLabel/FormLabel.jsx":[{description:"<p>The FormLabel component provides the label/legend for a field, along with any\nassociated hint text and error messaging.</p>\n<p>TODO(sawyer): Show this in the documentation</p>\n",methods:[{name:"errorMessage",docblock:null,modifiers:[],params:[],returns:null},{name:"hint",docblock:null,modifiers:[],params:[],returns:null}],props:{children:{type:{name:"node"},required:!0,description:""},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root element.</p>\n"},component:{type:{name:"enum",value:[{value:"'label'",computed:!1},{value:"'legend'",computed:!1}]},required:!1,description:"<p>The root HTML element used to render the label</p>\n",defaultValue:{value:"'label'",computed:!1}},errorMessage:{type:{name:"string"},required:!1,description:"<p>Enable the error state by providing an error message.</p>\n"},fieldId:{type:{name:"string"},required:!1,description:"<p>The ID of the field this label is for. This is used for the label&#39;s <code>for</code>\nattribute and any related ARIA attributes, such as for the error message.</p>\n"},hint:{type:{name:"node"},required:!1,description:"<p>Hint text</p>\n"},inversed:{type:{name:"bool"},required:!1,description:"<p>Set to <code>true</code> to apply the &quot;inverse&quot; theme</p>\n"}}}],"core/src/components/Tabs/Tab.jsx":[{description:"",methods:[{name:"handleClick",docblock:null,modifiers:[],params:[{name:"evt",type:null}],returns:null}],props:{children:{type:{name:"node"},required:!0,description:""},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root tab element.</p>\n"},id:{type:{name:"string"},required:!0,description:"<p>A unique <code>id</code>, to be used on the rendered tab element.</p>\n"},href:{type:{name:"string"},required:!1,description:"<p>You can optionally set the <code>href</code> attribute used for the tab. This can be\nuseful if you want to use relative links rather than a URL hash (the default)</p>\n"},onClick:{type:{name:"func"},required:!1,description:'<p>Called when the tab is clicked, with the following arguments:\n<a href="https://facebook.github.io/react/docs/events.html"><code>SyntheticEvent</code></a>,\n<code>id</code>, <code>panelId</code></p>\n'},panelId:{type:{name:"string"},required:!0,description:"<p>The <code>id</code> of the associated <code>TabPanel</code>. Used for the <code>aria-controls</code> attribute</p>\n"},selected:{type:{name:"bool"},required:!1,description:"",defaultValue:{value:"false",computed:!1}}}}],"core/src/components/Tabs/TabPanel.jsx":[{description:"",methods:[],props:{children:{type:{name:"node"},required:!0,description:""},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root element.</p>\n"},id:{type:{name:"string"},required:!0,description:"<p>A unique <code>id</code>, to be used on the rendered panel element.</p>\n"},selected:{type:{name:"bool"},required:!1,description:"",defaultValue:{value:"false",computed:!1}},tab:{type:{name:"string"},required:!1,description:"<p>The associated tab&#39;s label. Only applicable when the panel is a\nchild of <code>Tabs</code>.</p>\n"},tabClassName:{type:{name:"string"},required:!1,description:"<p>Additional classes for the associated tab. Only applicable when the panel\nis a child of <code>Tabs</code>.</p>\n"},tabHref:{type:{name:"string"},required:!1,description:"<p>The associated tab&#39;s <code>href</code>. Only applicable when the panel is a\nchild of <code>Tabs</code>.</p>\n"},tabId:{type:{name:"string"},required:!1,description:"<p>The <code>id</code> of the associated <code>Tab</code>. Used for the <code>aria-labelledby</code> attribute</p>\n"}}}],"core/src/components/Tabs/Tabs.jsx":[{description:"<p>A container component that manages the state of your tabs for you. For most\ncases, you&#39;ll want to use this component rather than the presentational\ncomponents (<code>Tab</code>, <code>TabPanel</code>) on their own.</p>\n",methods:[{name:"handleTabClick",docblock:null,modifiers:[],params:[{name:"evt",type:null},{name:"panelId",type:null},{name:"tabId",type:null},{name:"href",type:null}],returns:null},{name:"panelChildren",docblock:null,modifiers:[],params:[],returns:null},{name:"renderChildren",docblock:null,modifiers:[],params:[],returns:null},{name:"renderTabs",docblock:null,modifiers:[],params:[],returns:null},{name:"replaceState",docblock:"Update the URL in the browser without adding a new entry to the history.\n@param {String} url - Absolute or relative URL",modifiers:[],params:[{name:"url",description:"Absolute or relative URL",type:{name:"String"}}],returns:null,description:"Update the URL in the browser without adding a new entry to the history."}],props:{children:{type:{name:"node"},required:!0,description:""},defaultSelectedId:{type:{name:"string"},required:!1,description:"<p>Default selected <code>TabPanel</code>&#39;s <code>id</code>. If this isn&#39;t set, the first <code>TabPanel</code>\nwill be selected.</p>\n"},onChange:{type:{name:"func"},required:!1,description:"<p>A callback function that&#39;s invoked when the selected tab is changed.\n<code>(selectedId, prevSelectedId) =&gt; void</code></p>\n"},tablistClassName:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the component wrapping the tabs</p>\n"}}}],"core/src/components/TextField/TextField.jsx":[{description:"<p>The <code>TextField</code> component affords a user to type text into a form.\nBy default it renders a field for capturing a single line of text,\nbut can be configured to support multiline text.</p>\n",methods:[],props:{className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root element</p>\n"},defaultValue:{type:{name:"string"},required:!1,description:"<p>Default value of the text field, if any. Use this for an uncontrolled\ncomponent; otherwise, use the <code>value</code> property</p>\n"},disabled:{type:{name:"bool"},required:!1,description:""},errorMessage:{type:{name:"string"},required:!1,description:""},fieldClassName:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the field element</p>\n"},hint:{type:{name:"node"},required:!1,description:"<p>Hint text</p>\n"},inversed:{type:{name:"bool"},required:!1,description:"<p>Applies the &quot;inverse&quot; UI theme</p>\n"},label:{type:{name:"node"},required:!0,description:"<p>The label for the entire list of choices</p>\n"},labelClassName:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the <code>FormLabel</code></p>\n"},multiline:{type:{name:"bool"},required:!1,description:"<p>Whether or not the textfield is a multiline textfield</p>\n"},name:{type:{name:"string"},required:!0,description:""},onBlur:{type:{name:"func"},required:!1,description:""},onChange:{type:{name:"func"},required:!1,description:""},rows:{type:{name:"union",value:[{name:"number"},{name:"string"}]},required:!1,description:"<p>Optionally specify the number of visible text lines for the control. Only\napplicable if this is a multiline field</p>\n"},type:{type:{name:"string"},required:!1,description:'<p>Any valid <code>input</code> <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input">type</a>.</p>\n',defaultValue:{value:"'text'",computed:!1}},value:{type:{name:"string"},required:!1,description:"<p>Current value of the text field. Use this for a controlled component where\nyou are maintaining its current state; otherwise, use the <code>defaultValue</code> property</p>\n"}}}],"core/src/components/VerticalNav/VerticalNav.jsx":[{description:"<p>The <code>VerticalNav</code> React component accepts list items as a JSON object and\nincludes additional functionality like collapsible nested menus.</p>\n",methods:[{name:"renderItems",docblock:null,modifiers:[],params:[],returns:null}],props:{className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root element</p>\n"},collapsed:{type:{name:"bool"},required:!1,description:"<p>Whether or not the menu is in a collapsed state</p>\n",defaultValue:{value:"false",computed:!1}},selectedId:{type:{name:"string"},required:!1,description:"<p>The <code>id</code> of the selected <code>VerticalNavItem</code>. This will also set the\n<code>selected</code> prop on the item&#39;s parents.</p>\n"},id:{type:{name:"string"},required:!1,description:""},items:{type:{name:"arrayOf",value:{name:"object"}},required:!0,description:"<p>An array of <code>VerticalNavItem</code> data objects</p>\n"},nested:{type:{name:"bool"},required:!1,description:"<p>Indicates this list is nested within another nav item.</p>\n"},onLinkClick:{type:{name:"func"},required:!1,description:'<p>Called when one of the nav links is clicked, with the following arguments:\n<a href="https://facebook.github.io/react/docs/events.html"><code>SyntheticEvent</code></a>,\n<code>id</code>, <code>url</code></p>\n'}}}],"core/src/components/VerticalNav/VerticalNavItem.jsx":[{description:"",methods:[{name:"handleLinkClick",docblock:null,modifiers:[],params:[{name:"evt",type:null}],returns:null},{name:"handleToggleClick",docblock:null,modifiers:[],params:[],returns:null},{name:"hasSubnav",docblock:null,modifiers:[],params:[],returns:null},{name:"isSelected",docblock:"Check if this item is selected or if it is a parent of a selected item",modifiers:[],params:[],returns:null,description:"Check if this item is selected or if it is a parent of a selected item"},{name:"childIsSelected",docblock:"Checks if a descendant is selected\n@param {Array} children - The nested items",modifiers:[],params:[{name:"children",description:"The nested items",type:{name:"Array"}}],returns:null,description:"Checks if a descendant is selected"},{name:"renderSubnavToggle",docblock:null,modifiers:[],params:[],returns:null},{name:"renderSubnav",docblock:null,modifiers:[],params:[],returns:null}],props:{_selectedId:{type:{name:"string"},required:!1,description:""},ariaCollapsedStateButtonLabel:{type:{name:"string"},required:!1,description:"<p>Aria label for the toggle button when the sub-navigation is collapsed</p>\n",defaultValue:{value:"'Expand sub-navigation'",computed:!1}},ariaExpandedStateButtonLabel:{type:{name:"string"},required:!1,description:"<p>Aria label for the toggle button when the sub-navigation is expanded</p>\n",defaultValue:{value:"'Collapse sub-navigation'",computed:!1}},className:{type:{name:"string"},required:!1,description:"<p>Additional classes to be added to the root element</p>\n"},defaultCollapsed:{type:{name:"bool"},required:!1,description:"<p>Whether or not the item&#39;s sub-navigation is in a collapsed state by default</p>\n",defaultValue:{value:"false",computed:!1}},onClick:{type:{name:"func"},required:!1,description:'<p>Called when the item is clicked, with the following arguments:\n<a href="https://facebook.github.io/react/docs/events.html"><code>SyntheticEvent</code></a>,\n<code>id</code>, <code>url</code>.</p>\n<p>This takes precedence over the <code>VerticalNav</code> <code>onLinkClick</code> prop</p>\n'},onSubnavToggle:{type:{name:"func"},required:!1,description:"<p>Called when this item&#39;s subnav is collapsed or expanded, with the\nfollowing arguments: <code>id</code>, <code>collapsed</code></p>\n"},id:{type:{name:"string"},required:!1,description:"<p>Optional identifier. This can be handy if you&#39;re passing in an\n<code>onClick</code> handler. A unique ID will be generated if one isn&#39;t provided.</p>\n"},items:{type:{name:"arrayOf",value:{name:"shape",value:"VerticalNavItem.propTypes",computed:!0}},required:!1,description:"<p>An array of nested <code>VerticalNavItem</code> data objects to be rendered in a\nsub-navigation list.</p>\n"},label:{type:{name:"node"},required:!0,description:"<p>Text to render for this nav item</p>\n"},url:{type:{name:"string"},required:!1,description:"<p>A URL to navigate to if this item is a link</p>\n"},selected:{type:{name:"bool"},required:!1,description:"<p>If this item is currently selected</p>\n"}}}]}},function(module,exports,__webpack_require__){module.exports=__webpack_require__(129)}]);
\ No newline at end of file
diff --git a/docs/public/styles/docs.css b/docs/public/styles/docs.css
index 842b15f9e3..cb8dcd47a0 100644
--- a/docs/public/styles/docs.css
+++ b/docs/public/styles/docs.css
@@ -1 +1 @@
-/*! Design System - Core v{{version}} */@font-face{font-family:Bitter;font-style:normal;font-weight:400;src:url(/design-system/public/fonts/Bitter-Regular.eot);src:url(/design-system/public/fonts/Bitter-Regular.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/Bitter-Regular.woff2) format("woff2"),url(/design-system/public/fonts/Bitter-Regular.woff) format("woff"),url(/design-system/public/fonts/Bitter-Regular.ttf) format("truetype")}@font-face{font-family:Bitter;font-style:normal;font-weight:700;src:url(/design-system/public/fonts/Bitter-Bold.eot);src:url(/design-system/public/fonts/Bitter-Bold.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/Bitter-Bold.woff2) format("woff2"),url(/design-system/public/fonts/Bitter-Bold.woff) format("woff"),url(/design-system/public/fonts/Bitter-Bold.ttf) format("truetype")}@font-face{font-family:Bitter;font-style:italic;font-weight:400;src:url(/design-system/public/fonts/Bitter-Italic.eot);src:url(/design-system/public/fonts/Bitter-Italic.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/Bitter-Italic.woff2) format("woff2"),url(/design-system/public/fonts/Bitter-Italic.woff) format("woff"),url(/design-system/public/fonts/Bitter-Italic.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;src:url(/design-system/public/fonts/OpenSans-Regular-webfont.eot);src:url(/design-system/public/fonts/OpenSans-Regular-webfont.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/OpenSans-Regular-webfont.woff2) format("woff2"),url(/design-system/public/fonts/OpenSans-Regular-webfont.woff) format("woff"),url(/design-system/public/fonts/OpenSans-Regular-webfont.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:italic;font-weight:400;src:url(/design-system/public/fonts/OpenSans-Italic-webfont.eot);src:url(/design-system/public/fonts/OpenSans-Italic-webfont.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/OpenSans-Italic-webfont.woff2) format("woff2"),url(/design-system/public/fonts/OpenSans-Italic-webfont.woff) format("woff"),url(/design-system/public/fonts/OpenSans-Italic-webfont.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:normal;font-weight:600;src:url(/design-system/public/fonts/OpenSans-Semibold-webfont.eot);src:url(/design-system/public/fonts/OpenSans-Semibold-webfont.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/OpenSans-Semibold-webfont.woff2) format("woff2"),url(/design-system/public/fonts/OpenSans-Semibold-webfont.woff) format("woff"),url(/design-system/public/fonts/OpenSans-Semibold-webfont.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:normal;font-weight:700;src:url(/design-system/public/fonts/OpenSans-Bold-webfont.eot);src:url(/design-system/public/fonts/OpenSans-Bold-webfont.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/OpenSans-Bold-webfont.woff2) format("woff2"),url(/design-system/public/fonts/OpenSans-Bold-webfont.woff) format("woff"),url(/design-system/public/fonts/OpenSans-Bold-webfont.ttf) format("truetype")}.ds-base{color:#212121}.ds-base,.ds-base--inverse{font-family:Open Sans,Helvetica,sans-serif;font-size:16px;line-height:1.5}.ds-base--inverse{background-color:#112e51;color:#fff}.c-details h1:not([class]),.c-details h2:not([class]),.c-details h3:not([class]),.c-details h4:not([class]),.c-details h5:not([class]),.c-details h6:not([class]),.ds-display,.ds-h1,.ds-h2,.ds-h3,.ds-h4,.ds-h5,.ds-h6,.ds-title{line-height:1.3;margin:0}.c-details h1:not([class]),.c-details h2:not([class]),.c-details h3:not([class]),.c-details h4:not([class]),.ds-display,.ds-h1,.ds-h2,.ds-h3,.ds-h4{font-weight:700}.c-details h1:not([class]),.c-details h2:not([class]),.c-details h3:not([class]),.c-details h4:not([class]),.c-details h5:not([class]),.c-details h6:not([class]),.ds-h1,.ds-h2,.ds-h3,.ds-h4,.ds-h5,.ds-h6{margin-bottom:.5em;margin-top:1.5em}.c-details h1:first-child:not([class]),.c-details h2:first-child:not([class]),.c-details h3:first-child:not([class]),.c-details h4:first-child:not([class]),.c-details h5:first-child:not([class]),.c-details h6:first-child:not([class]),.ds-h1:first-child,.ds-h2:first-child,.ds-h3:first-child,.ds-h4:first-child,.ds-h5:first-child,.ds-h6:first-child{margin-top:0}.c-details h1:last-child:not([class]),.c-details h2:last-child:not([class]),.c-details h3:last-child:not([class]),.c-details h4:last-child:not([class]),.c-details h5:last-child:not([class]),.c-details h6:last-child:not([class]),.ds-h1:last-child,.ds-h2:last-child,.ds-h3:last-child,.ds-h4:last-child,.ds-h5:last-child,.ds-h6:last-child{margin-bottom:0}.ds-display{font-size:60px}.ds-title{font-size:48px;font-weight:400}.c-details h1:not([class]),.ds-h1{font-size:36px}.c-details h2:not([class]),.ds-h2{font-size:24px}.c-details h3:not([class]),.ds-h3{font-size:21px}.c-details h4:not([class]),.ds-h4{font-size:18px}.c-details h5:not([class]),.ds-h5{font-size:16px;font-weight:400;text-transform:uppercase}.c-details h6:not([class]),.ds-h6{color:#757575;font-size:14px;font-weight:400;letter-spacing:1px;text-transform:uppercase}.c-details .ds-base--inverse h6:not([class]),.ds-base--inverse .c-details h6:not([class]),.ds-base--inverse .ds-h6{color:#bac5cf}.c-details p:not([class]),.ds-text,.ds-text--lead{line-height:1.5;margin-bottom:1em;margin-top:1em}.c-details p:first-child:not([class]),.ds-text--lead:first-child,.ds-text:first-child{margin-top:0}.c-details p:last-child:not([class]),.ds-text--lead:last-child,.ds-text:last-child{margin-bottom:0}.c-details p:not([class]),.ds-text{font-size:16px}.ds-text--lead{font-size:18px}.ds-c-alert{background-color:#e1f3f8;background-image:url(/design-system/public/images/info.png);background-image:url(/design-system/public/images/info.svg);background-position:8px 15.2px;background-repeat:no-repeat;background-size:40px;border:1px solid #9bdaf1;-webkit-box-sizing:border-box;box-sizing:border-box;color:#212121;min-height:56px;padding:16px}.ds-c-alert a{color:#205493}.ds-c-alert a:focus,.ds-c-alert a:hover{color:#112e51}.ds-c-alert ul:last-child{margin-bottom:0}.ds-c-alert ul:first-child{margin-top:0}.ds-c-alert__body{padding-left:40px}.ds-c-alert__heading{font-size:18px;font-weight:700;margin-bottom:4px;margin-top:0}.ds-c-alert__text{margin-bottom:0;margin-top:0}.ds-c-alert--error{background-color:#f9dede;background-image:url(/design-system/public/images/error.png);background-image:url(/design-system/public/images/error.svg);border-color:#e59393}.ds-c-alert--warn{background-color:#fff1d2;background-image:url(/design-system/public/images/warning.png);background-image:url(/design-system/public/images/warning.svg);border-color:#f9c642}.ds-c-alert--success{background-color:#e7f4e4;background-image:url(/design-system/public/images/success.png);background-image:url(/design-system/public/images/success.svg);border-color:#94bfa2}.ds-c-badge{background-color:#02bfe7;border-radius:3px;color:#fff;display:inline-block;font-size:14px;line-height:1.3;margin-right:5px;padding:3px 6px}.ds-c-badge:only-of-type{margin-right:0}.ds-c-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:1px solid #0071bc;border-radius:3px;color:#0071bc;cursor:pointer;display:inline-block;font-family:Open Sans,Helvetica,sans-serif;font-size:16px;font-weight:700;line-height:1.3;padding:12px;text-align:center;text-decoration:none}.ds-c-button:focus,.ds-c-button:hover{border-color:#205493;color:#205493}.ds-c-button:active{border-color:#112e51;color:#112e51}.ds-c-button--big{font-size:21px;padding-left:24px;padding-right:24px}.ds-c-button--small{font-size:14px;font-weight:400;padding:8px}.ds-c-button--primary{background-color:#0071bc;color:#fff}.ds-c-button--primary:focus,.ds-c-button--primary:hover{background-color:#205493;color:#fff}.ds-c-button--primary:active{background-color:#112e51}.ds-c-button--transparent,.ds-c-button--transparent-inverse,.ds-c-button--transparent-inverse:active,.ds-c-button--transparent-inverse:focus,.ds-c-button--transparent-inverse:hover,.ds-c-button--transparent:active,.ds-c-button--transparent:focus,.ds-c-button--transparent:hover{border-color:transparent}.ds-c-button--danger{background-color:#e31c3d;border-color:#e31c3d;color:#fff}.ds-c-button--danger:focus,.ds-c-button--danger:hover{background-color:#cd2026;border-color:#cd2026;color:#fff}.ds-c-button--danger:active{background-color:#981b1e;border-color:#981b1e}.ds-c-button--success{background-color:#2e8540;border-color:#2e8540;color:#fff}.ds-c-button--success:focus,.ds-c-button--success:hover{background-color:#2a7a3b;border-color:#2a7a3b;color:#fff}.ds-c-button--success:active{background-color:#266e35;border-color:#266e35}.ds-c-button--disabled,.ds-c-button:disabled{pointer-events:none}.ds-c-button--disabled,.ds-c-button--disabled:active,.ds-c-button--disabled:focus,.ds-c-button--disabled:hover,.ds-c-button:disabled,.ds-c-button:disabled:active,.ds-c-button:disabled:focus,.ds-c-button:disabled:hover{background-color:#d6d7d9;border-color:#d6d7d9;color:#323a45}.ds-c-button--inverse,.ds-c-button--inverse:active,.ds-c-button--inverse:focus,.ds-c-button--inverse:hover{border-color:#fff}.ds-c-button--inverse,.ds-c-button--transparent-inverse{color:#fff}.ds-c-button--inverse:active,.ds-c-button--inverse:focus,.ds-c-button--inverse:hover,.ds-c-button--transparent-inverse:active,.ds-c-button--transparent-inverse:focus,.ds-c-button--transparent-inverse:hover{color:#fff;opacity:.8}.ds-c-button--inverse:active,.ds-c-button--transparent-inverse:active{opacity:.6}.ds-c-button--disabled-inverse,.ds-c-button--disabled-inverse:disabled{background-color:#081627;border-color:#081627;color:#bac5cf;pointer-events:none}.ds-c-button--disabled-inverse:active,.ds-c-button--disabled-inverse:disabled:active,.ds-c-button--disabled-inverse:disabled:focus,.ds-c-button--disabled-inverse:disabled:hover,.ds-c-button--disabled-inverse:focus,.ds-c-button--disabled-inverse:hover{background-color:#112e51;border-color:#112e51;color:#bac5cf}.ds-c-button>svg{fill:currentColor;height:1em;margin-bottom:-.1em;margin-top:-.1em;position:relative;top:-.1em;vertical-align:middle;width:1em}.ds-c-fieldset{border:0;margin:24px 0 0;min-width:0;padding:0}.ds-c-choice{margin-left:-100%;opacity:0;position:absolute}.ds-c-choice+label{cursor:pointer;display:block;font-weight:400;margin:8px 0;max-width:31em;min-height:32px;padding-left:40px;padding-top:4px;position:relative}.ds-c-choice+label:before{background-color:#fff;border:2px solid #212121;-webkit-box-sizing:border-box;box-sizing:border-box;content:"\a0";height:32px;left:0;line-height:32px;position:absolute;text-indent:.15em;top:0;width:32px}.ds-c-choice--inverse+label:before{background-color:#112e51;border-color:#fff}.ds-c-choice:focus+label:before{-webkit-box-shadow:0 0 0 2px #fff,0 0 2px 4px #3e94cf;box-shadow:0 0 0 2px #fff,0 0 2px 4px #3e94cf}.ds-c-choice--inverse:focus+label:before{-webkit-box-shadow:0 0 0 2px #112e51,0 0 2px 4px #59bcff;box-shadow:0 0 0 2px #112e51,0 0 2px 4px #59bcff}.ds-c-choice:checked+label:before{background-color:#0071bc;background-image:url(/design-system/public/images/checkmark-white.png);background-image:url(/design-system/public/images/checkmark-white.svg);background-position:50%;background-repeat:no-repeat;background-size:24px;border-color:#0071bc}.ds-c-choice:disabled+label{color:#757575}.ds-c-choice:disabled+label:before{background-color:#d6d7d9;border:1px solid #aeb0b5;cursor:not-allowed}.ds-c-choice--inverse:disabled+label{color:#bac5cf}.ds-c-choice--inverse:disabled+label:before{background-color:rgba(186,197,207,.15);-webkit-box-shadow:0 0 0 1px #bac5cf;box-shadow:0 0 0 1px #bac5cf}.ds-c-choice[type=radio]+label:before{border-radius:100%}.ds-c-field--select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;background-image:url(/design-system/public/images/arrow-down.png);background-image:url(/design-system/public/images/arrow-down.svg);background-position:right 14px center;background-repeat:no-repeat;background-size:14px}.ds-c-field--select[multiple]{background-image:none}.ds-c-label{display:block;font-size:16px;font-weight:400;margin-bottom:0;margin-top:24px;max-width:460px;padding:0}.ds-c-fieldset>.ds-c-label:first-child{margin-top:0}.ds-c-field__hint{color:#757575;display:block}.ds-c-field__hint--inverse{color:#bac5cf}.c-details ol:not([class]),.c-details ul:not([class]),.ds-c-list{margin-bottom:1em;margin-top:1em;padding-left:1.94em}.c-details ol:not([class]) li,.c-details ul:not([class]) li,.ds-c-list li{line-height:1.5;margin-bottom:.5em}.c-details ol:not([class]) li:last-child,.c-details ul:not([class]) li:last-child,.ds-c-list li:last-child{margin-bottom:0}.ds-c-list--bare{list-style:none;margin:0;padding:0}.ds-c-table{border-collapse:collapse;border-spacing:0;margin:0;min-width:100%}.ds-c-table thead td,.ds-c-table thead th{background-color:#f1f1f1}.ds-c-table th{text-align:left}.ds-c-table tbody th{font-weight:400}.ds-c-table td,.ds-c-table th{background-color:#fff;border:1px solid #5b616b;padding:1.5rem}.ds-c-table--borderless thead tr{background-color:transparent}.ds-c-table--borderless thead th{border-top:0}.ds-c-table--borderless td,.ds-c-table--borderless th{border-left:0;border-right:0}.ds-c-tabs{display:-webkit-box;display:-ms-flexbox;display:flex}.ds-c-tabs,.ds-c-tabs__panel{border-bottom:1px solid #d6d7d9}.ds-c-tabs__panel{background-color:#fff;border-left:1px solid #d6d7d9;border-right:1px solid #d6d7d9;padding:24px}.ds-c-tabs__panel[aria-hidden=true]{display:none!important}.ds-c-tabs__item{background-color:#fff;border-bottom:1px solid #d6d7d9;border-left:1px solid #d6d7d9;border-top:1px solid #d6d7d9;color:#212121;cursor:pointer;display:inline-block;font-size:14px;font-weight:700;line-height:1;margin-bottom:-1px;padding:16px 8px;position:relative;text-decoration:none;-webkit-transition:border-bottom-color .3s cubic-bezier(1,0,0,1);transition:border-bottom-color .3s cubic-bezier(1,0,0,1)}@media (min-width:544px){.ds-c-tabs__item{padding-left:16px;padding-right:16px}}@media (min-width:768px){.ds-c-tabs__item{font-size:16px;padding-left:24px;padding-right:24px}}.ds-c-tabs__item:last-child{border-right:1px solid #d6d7d9}.ds-c-tabs__item:after{background-color:#0071bc;content:"";height:4px;left:-1px;opacity:0;position:absolute;right:-1px;top:-1px;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transition:opacity .3s cubic-bezier(1,0,0,1),-webkit-transform .3s cubic-bezier(1,0,0,1);transition:opacity .3s cubic-bezier(1,0,0,1),-webkit-transform .3s cubic-bezier(1,0,0,1);transition:opacity .3s cubic-bezier(1,0,0,1),transform .3s cubic-bezier(1,0,0,1);transition:opacity .3s cubic-bezier(1,0,0,1),transform .3s cubic-bezier(1,0,0,1),-webkit-transform .3s cubic-bezier(1,0,0,1)}.ds-c-tabs__item[aria-selected=true]{border-bottom-color:#fff;color:#0071bc;pointer-events:none}.ds-c-tabs__item[aria-selected=true]:after{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}.ds-c-tabs__item:focus,.ds-c-tabs__item:hover{color:#0071bc}.ds-c-tabs__item:active{color:#205493}.ds-c-tabs__item>svg{fill:currentColor;height:1em;margin-bottom:-.1em;margin-top:-.1em;position:relative;top:-.1em;vertical-align:middle;width:1em}.ds-c-field{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid #212121;border-radius:3px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#212121;display:block;font-size:16px;line-height:1.3;margin:4px 0;max-width:460px;outline:none;padding:12px;width:100%}.ds-c-field:disabled{background-color:#d6d7d9;border-width:0}.ds-c-field:focus{-webkit-box-shadow:0 0 3px #3e94cf,0 0 7px #3e94cf;box-shadow:0 0 3px #3e94cf,0 0 7px #3e94cf}.ds-c-field--inverse{border-color:#000}.ds-c-field--inverse:focus{-webkit-box-shadow:0 0 3px #59bcff,0 0 7px #59bcff;box-shadow:0 0 3px #59bcff,0 0 7px #59bcff}.ds-c-field--error{border:3px solid #e31c3d}.ds-c-field--success{border:3px solid #4aa564}.ds-c-vertical-nav{list-style:none;margin:0;padding:0}.ds-c-vertical-nav>.ds-c-vertical-nav__item{background-color:transparent;border-top:1px solid #5b616b}.ds-c-vertical-nav>.ds-c-vertical-nav__item:first-child{border-top:0}.ds-c-vertical-nav__item{position:relative}.ds-c-vertical-nav__link{border-left:4px solid transparent;color:#212121;display:block;line-height:1.3;padding:8px 16px;text-decoration:none}.ds-c-vertical-nav__link--current{border-left-color:#0071bc;color:#0071bc;font-weight:700}.ds-c-vertical-nav__link--parent{margin-right:40px}a.ds-c-vertical-nav__link:hover{background-color:#f1f1f1;color:#0071bc;text-decoration:none}.ds-c-vertical-nav__subnav{list-style:none;margin:0;padding:0}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__item{font-size:14px}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__link{line-height:1.3;padding-left:24px}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__link--current{border-color:transparent}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__subnav .ds-c-vertical-nav__link{padding-left:32px}.ds-c-vertical-nav__subnav-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;background-image:url(/design-system/public/images/arrow-down.png);background-image:url(/design-system/public/images/arrow-down.svg);background-position:50%;background-repeat:no-repeat;background-size:14px;border:0;cursor:pointer;font-size:inherit;line-height:1.3;padding-bottom:8px;padding-top:8px;position:absolute;right:0;text-indent:-9999px;top:0;width:40px}.ds-c-vertical-nav__subnav-toggle:hover{background-color:#f1f1f1}.ds-c-vertical-nav__subnav-toggle[aria-expanded=true]{background-image:url(/design-system/public/images/arrow-up.png);background-image:url(/design-system/public/images/arrow-up.svg)}.ds-u-fill--primary{background-color:#0071bc!important}.ds-u-fill--primary-darker{background-color:#205493!important}.ds-u-fill--primary-darkest{background-color:#112e51!important}.ds-u-fill--primary-alt{background-color:#02bfe7!important}.ds-u-fill--primary-alt-dark{background-color:#00a6d2!important}.ds-u-fill--primary-alt-darkest{background-color:#046b99!important}.ds-u-fill--primary-alt-light{background-color:#9bdaf1!important}.ds-u-fill--primary-alt-lightest{background-color:#e1f3f8!important}.ds-u-fill--secondary{background-color:#e31c3d!important}.ds-u-fill--secondary-dark{background-color:#cd2026!important}.ds-u-fill--secondary-darkest{background-color:#981b1e!important}.ds-u-fill--secondary-light{background-color:#e59393!important}.ds-u-fill--secondary-lightest{background-color:#f9dede!important}.ds-u-fill--gray{background-color:#5b616b!important}.ds-u-fill--gray-dark{background-color:#323a45!important}.ds-u-fill--gray-light{background-color:#aeb0b5!important}.ds-u-fill--gray-lighter{background-color:#d6d7d9!important}.ds-u-fill--gray-lightest{background-color:#f1f1f1!important}.ds-u-fill--gold{background-color:#fdb81e!important}.ds-u-fill--gold-light{background-color:#f9c642!important}.ds-u-fill--gold-lighter{background-color:#fad980!important}.ds-u-fill--gold-lightest{background-color:#fff1d2!important}.ds-u-fill--green{background-color:#2e8540!important}.ds-u-fill--green-light{background-color:#4aa564!important}.ds-u-fill--green-lighter{background-color:#94bfa2!important}.ds-u-fill--green-lightest{background-color:#e7f4e4!important}.ds-u-fill--error{background-color:#e31c3d!important}.ds-u-fill--error-dark{background-color:#cd2026!important}.ds-u-fill--error-darkest{background-color:#981b1e!important}.ds-u-fill--error-light{background-color:#e59393!important}.ds-u-fill--error-lighter{background-color:#efb9b9!important}.ds-u-fill--error-lightest{background-color:#f9dede!important}.ds-u-fill--warn{background-color:#fdb81e!important}.ds-u-fill--warn-light{background-color:#f9c642!important}.ds-u-fill--warn-lighter{background-color:#fad980!important}.ds-u-fill--warn-lightest{background-color:#fff1d2!important}.ds-u-fill--success{background-color:#2e8540!important}.ds-u-fill--success-light{background-color:#4aa564!important}.ds-u-fill--success-lighter{background-color:#94bfa2!important}.ds-u-fill--success-lightest{background-color:#e7f4e4!important}.ds-u-fill--base{background-color:#212121!important}.ds-u-fill--background,.ds-u-fill--white{background-color:#fff!important}.ds-u-fill--background-inverse{background-color:#112e51!important}.ds-u-fill--transparent{background-color:transparent!important}.ds-u-border--1{border:1px solid #d6d7d9!important}.ds-u-border-top--1{border-top:1px solid #d6d7d9!important}.ds-u-border-right--1{border-right:1px solid #d6d7d9!important}.ds-u-border-bottom--1{border-bottom:1px solid #d6d7d9!important}.ds-u-border-left--1,.ds-u-border-x--1{border-left:1px solid #d6d7d9!important}.ds-u-border-x--1{border-right:1px solid #d6d7d9!important}.ds-u-border-y--1{border-bottom:1px solid #d6d7d9!important;border-top:1px solid #d6d7d9!important}.ds-u-border--2{border:2px solid #d6d7d9!important}.ds-u-border-top--2{border-top:2px solid #d6d7d9!important}.ds-u-border-right--2{border-right:2px solid #d6d7d9!important}.ds-u-border-bottom--2{border-bottom:2px solid #d6d7d9!important}.ds-u-border-left--2,.ds-u-border-x--2{border-left:2px solid #d6d7d9!important}.ds-u-border-x--2{border-right:2px solid #d6d7d9!important}.ds-u-border-y--2{border-bottom:2px solid #d6d7d9!important;border-top:2px solid #d6d7d9!important}.ds-u-border--0{border:0!important}.ds-u-border-top--0{border-top:0!important}.ds-u-border-right--0{border-right:0!important}.ds-u-border-bottom--0{border-bottom:0!important}.ds-u-border-left--0,.ds-u-border-x--0{border-left:0!important}.ds-u-border-x--0{border-right:0!important}.ds-u-border-y--0{border-bottom:0!important;border-top:0!important}.ds-u-border--inverse{border-color:#fff!important}.ds-u-border--error{border-color:#e31c3d!important}.ds-u-border--error-light{border-color:#e59393!important}.ds-u-border--error-lighter{border-color:#efb9b9!important}.ds-u-border--warn{border-color:#fdb81e!important}.ds-u-border--warn-light{border-color:#f9c642!important}.ds-u-border--warn-lighter{border-color:#fad980!important}.ds-u-border--success{border-color:#2e8540!important}.ds-u-border--success-light{border-color:#4aa564!important}.ds-u-border--success-lighter{border-color:#94bfa2!important}.ds-u-radius{border-radius:3px}.ds-u-radius--pill{border-radius:9999px}.ds-u-radius--circle{border-radius:100%}.ds-u-color--primary{color:#0071bc!important}.ds-u-color--primary-darker{color:#205493!important}.ds-u-color--primary-darkest{color:#112e51!important}.ds-u-color--gray{color:#5b616b!important}.ds-u-color--muted{color:#757575!important}.ds-u-color--error{color:#e31c3d!important}.ds-u-color--error-dark{color:#cd2026!important}.ds-u-color--error-light{color:#e59393!important}.ds-u-color--success{color:#2e8540!important}.ds-u-color--base{color:#212121!important}.ds-u-color--base-inverse{color:#fff!important}.ds-u-color--muted-inverse{color:#bac5cf!important}.ds-u-color--black{color:#000!important}.ds-u-color--white{color:#fff!important}.ds-u-display--block{display:block!important}.ds-u-display--inline-block{display:inline-block!important}.ds-u-display--none{display:none!important}.ds-u-visibility--hidden{visibility:hidden!important}.ds-u-visibility--visible{visibility:visible!important}.ds-u-visibility--screen-reader{border:0;clip:rect(0,0,0,0);height:1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal}@media (min-width:544px){.ds-u-sm-display--block{display:block!important}.ds-u-sm-display--inline-block{display:inline-block!important}.ds-u-sm-display--none{display:none!important}.ds-u-sm-visibility--hidden{visibility:hidden!important}.ds-u-sm-visibility--visible{visibility:visible!important}}@media (min-width:768px){.ds-u-md-display--block{display:block!important}.ds-u-md-display--inline-block{display:inline-block!important}.ds-u-md-display--none{display:none!important}.ds-u-md-visibility--hidden{visibility:hidden!important}.ds-u-md-visibility--visible{visibility:visible!important}}@media (min-width:1024px){.ds-u-lg-display--block{display:block!important}.ds-u-lg-display--inline-block{display:inline-block!important}.ds-u-lg-display--none{display:none!important}.ds-u-lg-visibility--hidden{visibility:hidden!important}.ds-u-lg-visibility--visible{visibility:visible!important}}@media (min-width:1280px){.ds-u-xl-display--block{display:block!important}.ds-u-xl-display--inline-block{display:inline-block!important}.ds-u-xl-display--none{display:none!important}.ds-u-xl-visibility--hidden{visibility:hidden!important}.ds-u-xl-visibility--visible{visibility:visible!important}}.ds-u-float--left{float:left!important}.ds-u-float--right{float:right!important}.ds-u-float--none{float:none!important}@media (min-width:544px){.ds-u-sm-float--left{float:left!important}.ds-u-sm-float--right{float:right!important}.ds-u-sm-float--none{float:none!important}}@media (min-width:768px){.ds-u-md-float--left{float:left!important}.ds-u-md-float--right{float:right!important}.ds-u-md-float--none{float:none!important}}@media (min-width:1024px){.ds-u-lg-float--left{float:left!important}.ds-u-lg-float--right{float:right!important}.ds-u-lg-float--none{float:none!important}}@media (min-width:1280px){.ds-u-xl-float--left{float:left!important}.ds-u-xl-float--right{float:right!important}.ds-u-xl-float--none{float:none!important}}.ds-u-sans{font-family:Open Sans,Helvetica,sans-serif!important}.ds-u-serif{font-family:Bitter,Georgia,serif!important}.ds-u-font-size--small{font-size:14px!important}.ds-u-font-size--base{font-size:16px!important}.ds-u-font-size--lead{font-size:18px!important}.ds-u-font-size--display{font-size:60px!important}.ds-u-font-size--title{font-size:48px!important}.ds-u-font-size--h1{font-size:36px!important}.ds-u-font-size--h2{font-size:24px!important}.ds-u-font-size--h3{font-size:21px!important}.ds-u-font-size--h4{font-size:18px!important}@media (min-width:544px){.ds-u-sm-font-size--small{font-size:14px!important}.ds-u-sm-font-size--base{font-size:16px!important}.ds-u-sm-font-size--lead{font-size:18px!important}.ds-u-sm-font-size--display{font-size:60px!important}.ds-u-sm-font-size--title{font-size:48px!important}.ds-u-sm-font-size--h1{font-size:36px!important}.ds-u-sm-font-size--h2{font-size:24px!important}.ds-u-sm-font-size--h3{font-size:21px!important}.ds-u-sm-font-size--h4{font-size:18px!important}}@media (min-width:768px){.ds-u-md-font-size--small{font-size:14px!important}.ds-u-md-font-size--base{font-size:16px!important}.ds-u-md-font-size--lead{font-size:18px!important}.ds-u-md-font-size--display{font-size:60px!important}.ds-u-md-font-size--title{font-size:48px!important}.ds-u-md-font-size--h1{font-size:36px!important}.ds-u-md-font-size--h2{font-size:24px!important}.ds-u-md-font-size--h3{font-size:21px!important}.ds-u-md-font-size--h4{font-size:18px!important}}@media (min-width:1024px){.ds-u-lg-font-size--small{font-size:14px!important}.ds-u-lg-font-size--base{font-size:16px!important}.ds-u-lg-font-size--lead{font-size:18px!important}.ds-u-lg-font-size--display{font-size:60px!important}.ds-u-lg-font-size--title{font-size:48px!important}.ds-u-lg-font-size--h1{font-size:36px!important}.ds-u-lg-font-size--h2{font-size:24px!important}.ds-u-lg-font-size--h3{font-size:21px!important}.ds-u-lg-font-size--h4{font-size:18px!important}}@media (min-width:1280px){.ds-u-xl-font-size--small{font-size:14px!important}.ds-u-xl-font-size--base{font-size:16px!important}.ds-u-xl-font-size--lead{font-size:18px!important}.ds-u-xl-font-size--display{font-size:60px!important}.ds-u-xl-font-size--title{font-size:48px!important}.ds-u-xl-font-size--h1{font-size:36px!important}.ds-u-xl-font-size--h2{font-size:24px!important}.ds-u-xl-font-size--h3{font-size:21px!important}.ds-u-xl-font-size--h4{font-size:18px!important}}.ds-u-font-style--normal{font-style:normal!important}.ds-u-font-style--italic{font-style:italic!important}.ds-u-font-weight--normal{font-weight:400!important}.ds-u-font-weight--semibold{font-weight:600!important}.ds-u-font-weight--bold{font-weight:700!important}.ds-u-leading--base{line-height:1.5!important}.ds-u-leading--lead{line-height:1.7!important}.ds-u-leading--heading{line-height:1.3!important}.ds-u-leading--reset{line-height:1!important}.ds-u-margin--0{margin:0!important}.ds-u-margin-top--0{margin-top:0!important}.ds-u-margin-right--0{margin-right:0!important}.ds-u-margin-bottom--0{margin-bottom:0!important}.ds-u-margin-left--0,.ds-u-margin-x--0{margin-left:0!important}.ds-u-margin-x--0{margin-right:0!important}.ds-u-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-margin--1{margin:8px!important}.ds-u-margin-top--1{margin-top:8px!important}.ds-u-margin-right--1{margin-right:8px!important}.ds-u-margin-bottom--1{margin-bottom:8px!important}.ds-u-margin-left--1,.ds-u-margin-x--1{margin-left:8px!important}.ds-u-margin-x--1{margin-right:8px!important}.ds-u-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-margin--2{margin:16px!important}.ds-u-margin-top--2{margin-top:16px!important}.ds-u-margin-right--2{margin-right:16px!important}.ds-u-margin-bottom--2{margin-bottom:16px!important}.ds-u-margin-left--2,.ds-u-margin-x--2{margin-left:16px!important}.ds-u-margin-x--2{margin-right:16px!important}.ds-u-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-margin--3{margin:24px!important}.ds-u-margin-top--3{margin-top:24px!important}.ds-u-margin-right--3{margin-right:24px!important}.ds-u-margin-bottom--3{margin-bottom:24px!important}.ds-u-margin-left--3,.ds-u-margin-x--3{margin-left:24px!important}.ds-u-margin-x--3{margin-right:24px!important}.ds-u-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-margin--4{margin:32px!important}.ds-u-margin-top--4{margin-top:32px!important}.ds-u-margin-right--4{margin-right:32px!important}.ds-u-margin-bottom--4{margin-bottom:32px!important}.ds-u-margin-left--4,.ds-u-margin-x--4{margin-left:32px!important}.ds-u-margin-x--4{margin-right:32px!important}.ds-u-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-margin--5{margin:40px!important}.ds-u-margin-top--5{margin-top:40px!important}.ds-u-margin-right--5{margin-right:40px!important}.ds-u-margin-bottom--5{margin-bottom:40px!important}.ds-u-margin-left--5,.ds-u-margin-x--5{margin-left:40px!important}.ds-u-margin-x--5{margin-right:40px!important}.ds-u-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-margin--6{margin:48px!important}.ds-u-margin-top--6{margin-top:48px!important}.ds-u-margin-right--6{margin-right:48px!important}.ds-u-margin-bottom--6{margin-bottom:48px!important}.ds-u-margin-left--6,.ds-u-margin-x--6{margin-left:48px!important}.ds-u-margin-x--6{margin-right:48px!important}.ds-u-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-margin--7{margin:56px!important}.ds-u-margin-top--7{margin-top:56px!important}.ds-u-margin-right--7{margin-right:56px!important}.ds-u-margin-bottom--7{margin-bottom:56px!important}.ds-u-margin-left--7,.ds-u-margin-x--7{margin-left:56px!important}.ds-u-margin-x--7{margin-right:56px!important}.ds-u-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}@media (min-width:544px){.ds-u-sm-margin--0{margin:0!important}.ds-u-sm-margin-top--0{margin-top:0!important}.ds-u-sm-margin-right--0{margin-right:0!important}.ds-u-sm-margin-bottom--0{margin-bottom:0!important}.ds-u-sm-margin-left--0,.ds-u-sm-margin-x--0{margin-left:0!important}.ds-u-sm-margin-x--0{margin-right:0!important}.ds-u-sm-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-sm-margin--1{margin:8px!important}.ds-u-sm-margin-top--1{margin-top:8px!important}.ds-u-sm-margin-right--1{margin-right:8px!important}.ds-u-sm-margin-bottom--1{margin-bottom:8px!important}.ds-u-sm-margin-left--1,.ds-u-sm-margin-x--1{margin-left:8px!important}.ds-u-sm-margin-x--1{margin-right:8px!important}.ds-u-sm-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-sm-margin--2{margin:16px!important}.ds-u-sm-margin-top--2{margin-top:16px!important}.ds-u-sm-margin-right--2{margin-right:16px!important}.ds-u-sm-margin-bottom--2{margin-bottom:16px!important}.ds-u-sm-margin-left--2,.ds-u-sm-margin-x--2{margin-left:16px!important}.ds-u-sm-margin-x--2{margin-right:16px!important}.ds-u-sm-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-sm-margin--3{margin:24px!important}.ds-u-sm-margin-top--3{margin-top:24px!important}.ds-u-sm-margin-right--3{margin-right:24px!important}.ds-u-sm-margin-bottom--3{margin-bottom:24px!important}.ds-u-sm-margin-left--3,.ds-u-sm-margin-x--3{margin-left:24px!important}.ds-u-sm-margin-x--3{margin-right:24px!important}.ds-u-sm-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-sm-margin--4{margin:32px!important}.ds-u-sm-margin-top--4{margin-top:32px!important}.ds-u-sm-margin-right--4{margin-right:32px!important}.ds-u-sm-margin-bottom--4{margin-bottom:32px!important}.ds-u-sm-margin-left--4,.ds-u-sm-margin-x--4{margin-left:32px!important}.ds-u-sm-margin-x--4{margin-right:32px!important}.ds-u-sm-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-sm-margin--5{margin:40px!important}.ds-u-sm-margin-top--5{margin-top:40px!important}.ds-u-sm-margin-right--5{margin-right:40px!important}.ds-u-sm-margin-bottom--5{margin-bottom:40px!important}.ds-u-sm-margin-left--5,.ds-u-sm-margin-x--5{margin-left:40px!important}.ds-u-sm-margin-x--5{margin-right:40px!important}.ds-u-sm-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-sm-margin--6{margin:48px!important}.ds-u-sm-margin-top--6{margin-top:48px!important}.ds-u-sm-margin-right--6{margin-right:48px!important}.ds-u-sm-margin-bottom--6{margin-bottom:48px!important}.ds-u-sm-margin-left--6,.ds-u-sm-margin-x--6{margin-left:48px!important}.ds-u-sm-margin-x--6{margin-right:48px!important}.ds-u-sm-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-sm-margin--7{margin:56px!important}.ds-u-sm-margin-top--7{margin-top:56px!important}.ds-u-sm-margin-right--7{margin-right:56px!important}.ds-u-sm-margin-bottom--7{margin-bottom:56px!important}.ds-u-sm-margin-left--7,.ds-u-sm-margin-x--7{margin-left:56px!important}.ds-u-sm-margin-x--7{margin-right:56px!important}.ds-u-sm-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}@media (min-width:768px){.ds-u-md-margin--0{margin:0!important}.ds-u-md-margin-top--0{margin-top:0!important}.ds-u-md-margin-right--0{margin-right:0!important}.ds-u-md-margin-bottom--0{margin-bottom:0!important}.ds-u-md-margin-left--0,.ds-u-md-margin-x--0{margin-left:0!important}.ds-u-md-margin-x--0{margin-right:0!important}.ds-u-md-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-md-margin--1{margin:8px!important}.ds-u-md-margin-top--1{margin-top:8px!important}.ds-u-md-margin-right--1{margin-right:8px!important}.ds-u-md-margin-bottom--1{margin-bottom:8px!important}.ds-u-md-margin-left--1,.ds-u-md-margin-x--1{margin-left:8px!important}.ds-u-md-margin-x--1{margin-right:8px!important}.ds-u-md-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-md-margin--2{margin:16px!important}.ds-u-md-margin-top--2{margin-top:16px!important}.ds-u-md-margin-right--2{margin-right:16px!important}.ds-u-md-margin-bottom--2{margin-bottom:16px!important}.ds-u-md-margin-left--2,.ds-u-md-margin-x--2{margin-left:16px!important}.ds-u-md-margin-x--2{margin-right:16px!important}.ds-u-md-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-md-margin--3{margin:24px!important}.ds-u-md-margin-top--3{margin-top:24px!important}.ds-u-md-margin-right--3{margin-right:24px!important}.ds-u-md-margin-bottom--3{margin-bottom:24px!important}.ds-u-md-margin-left--3,.ds-u-md-margin-x--3{margin-left:24px!important}.ds-u-md-margin-x--3{margin-right:24px!important}.ds-u-md-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-md-margin--4{margin:32px!important}.ds-u-md-margin-top--4{margin-top:32px!important}.ds-u-md-margin-right--4{margin-right:32px!important}.ds-u-md-margin-bottom--4{margin-bottom:32px!important}.ds-u-md-margin-left--4,.ds-u-md-margin-x--4{margin-left:32px!important}.ds-u-md-margin-x--4{margin-right:32px!important}.ds-u-md-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-md-margin--5{margin:40px!important}.ds-u-md-margin-top--5{margin-top:40px!important}.ds-u-md-margin-right--5{margin-right:40px!important}.ds-u-md-margin-bottom--5{margin-bottom:40px!important}.ds-u-md-margin-left--5,.ds-u-md-margin-x--5{margin-left:40px!important}.ds-u-md-margin-x--5{margin-right:40px!important}.ds-u-md-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-md-margin--6{margin:48px!important}.ds-u-md-margin-top--6{margin-top:48px!important}.ds-u-md-margin-right--6{margin-right:48px!important}.ds-u-md-margin-bottom--6{margin-bottom:48px!important}.ds-u-md-margin-left--6,.ds-u-md-margin-x--6{margin-left:48px!important}.ds-u-md-margin-x--6{margin-right:48px!important}.ds-u-md-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-md-margin--7{margin:56px!important}.ds-u-md-margin-top--7{margin-top:56px!important}.ds-u-md-margin-right--7{margin-right:56px!important}.ds-u-md-margin-bottom--7{margin-bottom:56px!important}.ds-u-md-margin-left--7,.ds-u-md-margin-x--7{margin-left:56px!important}.ds-u-md-margin-x--7{margin-right:56px!important}.ds-u-md-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}@media (min-width:1024px){.ds-u-lg-margin--0{margin:0!important}.ds-u-lg-margin-top--0{margin-top:0!important}.ds-u-lg-margin-right--0{margin-right:0!important}.ds-u-lg-margin-bottom--0{margin-bottom:0!important}.ds-u-lg-margin-left--0,.ds-u-lg-margin-x--0{margin-left:0!important}.ds-u-lg-margin-x--0{margin-right:0!important}.ds-u-lg-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-lg-margin--1{margin:8px!important}.ds-u-lg-margin-top--1{margin-top:8px!important}.ds-u-lg-margin-right--1{margin-right:8px!important}.ds-u-lg-margin-bottom--1{margin-bottom:8px!important}.ds-u-lg-margin-left--1,.ds-u-lg-margin-x--1{margin-left:8px!important}.ds-u-lg-margin-x--1{margin-right:8px!important}.ds-u-lg-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-lg-margin--2{margin:16px!important}.ds-u-lg-margin-top--2{margin-top:16px!important}.ds-u-lg-margin-right--2{margin-right:16px!important}.ds-u-lg-margin-bottom--2{margin-bottom:16px!important}.ds-u-lg-margin-left--2,.ds-u-lg-margin-x--2{margin-left:16px!important}.ds-u-lg-margin-x--2{margin-right:16px!important}.ds-u-lg-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-lg-margin--3{margin:24px!important}.ds-u-lg-margin-top--3{margin-top:24px!important}.ds-u-lg-margin-right--3{margin-right:24px!important}.ds-u-lg-margin-bottom--3{margin-bottom:24px!important}.ds-u-lg-margin-left--3,.ds-u-lg-margin-x--3{margin-left:24px!important}.ds-u-lg-margin-x--3{margin-right:24px!important}.ds-u-lg-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-lg-margin--4{margin:32px!important}.ds-u-lg-margin-top--4{margin-top:32px!important}.ds-u-lg-margin-right--4{margin-right:32px!important}.ds-u-lg-margin-bottom--4{margin-bottom:32px!important}.ds-u-lg-margin-left--4,.ds-u-lg-margin-x--4{margin-left:32px!important}.ds-u-lg-margin-x--4{margin-right:32px!important}.ds-u-lg-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-lg-margin--5{margin:40px!important}.ds-u-lg-margin-top--5{margin-top:40px!important}.ds-u-lg-margin-right--5{margin-right:40px!important}.ds-u-lg-margin-bottom--5{margin-bottom:40px!important}.ds-u-lg-margin-left--5,.ds-u-lg-margin-x--5{margin-left:40px!important}.ds-u-lg-margin-x--5{margin-right:40px!important}.ds-u-lg-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-lg-margin--6{margin:48px!important}.ds-u-lg-margin-top--6{margin-top:48px!important}.ds-u-lg-margin-right--6{margin-right:48px!important}.ds-u-lg-margin-bottom--6{margin-bottom:48px!important}.ds-u-lg-margin-left--6,.ds-u-lg-margin-x--6{margin-left:48px!important}.ds-u-lg-margin-x--6{margin-right:48px!important}.ds-u-lg-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-lg-margin--7{margin:56px!important}.ds-u-lg-margin-top--7{margin-top:56px!important}.ds-u-lg-margin-right--7{margin-right:56px!important}.ds-u-lg-margin-bottom--7{margin-bottom:56px!important}.ds-u-lg-margin-left--7,.ds-u-lg-margin-x--7{margin-left:56px!important}.ds-u-lg-margin-x--7{margin-right:56px!important}.ds-u-lg-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}@media (min-width:1280px){.ds-u-xl-margin--0{margin:0!important}.ds-u-xl-margin-top--0{margin-top:0!important}.ds-u-xl-margin-right--0{margin-right:0!important}.ds-u-xl-margin-bottom--0{margin-bottom:0!important}.ds-u-xl-margin-left--0,.ds-u-xl-margin-x--0{margin-left:0!important}.ds-u-xl-margin-x--0{margin-right:0!important}.ds-u-xl-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-xl-margin--1{margin:8px!important}.ds-u-xl-margin-top--1{margin-top:8px!important}.ds-u-xl-margin-right--1{margin-right:8px!important}.ds-u-xl-margin-bottom--1{margin-bottom:8px!important}.ds-u-xl-margin-left--1,.ds-u-xl-margin-x--1{margin-left:8px!important}.ds-u-xl-margin-x--1{margin-right:8px!important}.ds-u-xl-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-xl-margin--2{margin:16px!important}.ds-u-xl-margin-top--2{margin-top:16px!important}.ds-u-xl-margin-right--2{margin-right:16px!important}.ds-u-xl-margin-bottom--2{margin-bottom:16px!important}.ds-u-xl-margin-left--2,.ds-u-xl-margin-x--2{margin-left:16px!important}.ds-u-xl-margin-x--2{margin-right:16px!important}.ds-u-xl-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-xl-margin--3{margin:24px!important}.ds-u-xl-margin-top--3{margin-top:24px!important}.ds-u-xl-margin-right--3{margin-right:24px!important}.ds-u-xl-margin-bottom--3{margin-bottom:24px!important}.ds-u-xl-margin-left--3,.ds-u-xl-margin-x--3{margin-left:24px!important}.ds-u-xl-margin-x--3{margin-right:24px!important}.ds-u-xl-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-xl-margin--4{margin:32px!important}.ds-u-xl-margin-top--4{margin-top:32px!important}.ds-u-xl-margin-right--4{margin-right:32px!important}.ds-u-xl-margin-bottom--4{margin-bottom:32px!important}.ds-u-xl-margin-left--4,.ds-u-xl-margin-x--4{margin-left:32px!important}.ds-u-xl-margin-x--4{margin-right:32px!important}.ds-u-xl-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-xl-margin--5{margin:40px!important}.ds-u-xl-margin-top--5{margin-top:40px!important}.ds-u-xl-margin-right--5{margin-right:40px!important}.ds-u-xl-margin-bottom--5{margin-bottom:40px!important}.ds-u-xl-margin-left--5,.ds-u-xl-margin-x--5{margin-left:40px!important}.ds-u-xl-margin-x--5{margin-right:40px!important}.ds-u-xl-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-xl-margin--6{margin:48px!important}.ds-u-xl-margin-top--6{margin-top:48px!important}.ds-u-xl-margin-right--6{margin-right:48px!important}.ds-u-xl-margin-bottom--6{margin-bottom:48px!important}.ds-u-xl-margin-left--6,.ds-u-xl-margin-x--6{margin-left:48px!important}.ds-u-xl-margin-x--6{margin-right:48px!important}.ds-u-xl-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-xl-margin--7{margin:56px!important}.ds-u-xl-margin-top--7{margin-top:56px!important}.ds-u-xl-margin-right--7{margin-right:56px!important}.ds-u-xl-margin-bottom--7{margin-bottom:56px!important}.ds-u-xl-margin-left--7,.ds-u-xl-margin-x--7{margin-left:56px!important}.ds-u-xl-margin-x--7{margin-right:56px!important}.ds-u-xl-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}.ds-u-measure--narrow{max-width:21em!important}.ds-u-measure--base{max-width:31em!important}.ds-u-measure--wide{max-width:41em!important}.ds-u-overflow--hidden{overflow:hidden!important}.ds-u-overflow--scroll{overflow:scroll!important}.ds-u-overflow--auto{overflow:auto!important}.ds-u-clearfix:after,.ds-u-clearfix:before{content:"";display:table}.ds-u-clearfix:after{clear:both}.ds-u-padding--0{padding:0!important}.ds-u-padding-top--0{padding-top:0!important}.ds-u-padding-right--0{padding-right:0!important}.ds-u-padding-bottom--0{padding-bottom:0!important}.ds-u-padding-left--0,.ds-u-padding-x--0{padding-left:0!important}.ds-u-padding-x--0{padding-right:0!important}.ds-u-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-padding--1{padding:8px!important}.ds-u-padding-top--1{padding-top:8px!important}.ds-u-padding-right--1{padding-right:8px!important}.ds-u-padding-bottom--1{padding-bottom:8px!important}.ds-u-padding-left--1,.ds-u-padding-x--1{padding-left:8px!important}.ds-u-padding-x--1{padding-right:8px!important}.ds-u-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-padding--2{padding:16px!important}.ds-u-padding-top--2{padding-top:16px!important}.ds-u-padding-right--2{padding-right:16px!important}.ds-u-padding-bottom--2{padding-bottom:16px!important}.ds-u-padding-left--2,.ds-u-padding-x--2{padding-left:16px!important}.ds-u-padding-x--2{padding-right:16px!important}.ds-u-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-padding--3{padding:24px!important}.ds-u-padding-top--3{padding-top:24px!important}.ds-u-padding-right--3{padding-right:24px!important}.ds-u-padding-bottom--3{padding-bottom:24px!important}.ds-u-padding-left--3,.ds-u-padding-x--3{padding-left:24px!important}.ds-u-padding-x--3{padding-right:24px!important}.ds-u-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-padding--4{padding:32px!important}.ds-u-padding-top--4{padding-top:32px!important}.ds-u-padding-right--4{padding-right:32px!important}.ds-u-padding-bottom--4{padding-bottom:32px!important}.ds-u-padding-left--4,.ds-u-padding-x--4{padding-left:32px!important}.ds-u-padding-x--4{padding-right:32px!important}.ds-u-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-padding--5{padding:40px!important}.ds-u-padding-top--5{padding-top:40px!important}.ds-u-padding-right--5{padding-right:40px!important}.ds-u-padding-bottom--5{padding-bottom:40px!important}.ds-u-padding-left--5,.ds-u-padding-x--5{padding-left:40px!important}.ds-u-padding-x--5{padding-right:40px!important}.ds-u-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-padding--6{padding:48px!important}.ds-u-padding-top--6{padding-top:48px!important}.ds-u-padding-right--6{padding-right:48px!important}.ds-u-padding-bottom--6{padding-bottom:48px!important}.ds-u-padding-left--6,.ds-u-padding-x--6{padding-left:48px!important}.ds-u-padding-x--6{padding-right:48px!important}.ds-u-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-padding--7{padding:56px!important}.ds-u-padding-top--7{padding-top:56px!important}.ds-u-padding-right--7{padding-right:56px!important}.ds-u-padding-bottom--7{padding-bottom:56px!important}.ds-u-padding-left--7,.ds-u-padding-x--7{padding-left:56px!important}.ds-u-padding-x--7{padding-right:56px!important}.ds-u-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}@media (min-width:544px){.ds-u-sm-padding--0{padding:0!important}.ds-u-sm-padding-top--0{padding-top:0!important}.ds-u-sm-padding-right--0{padding-right:0!important}.ds-u-sm-padding-bottom--0{padding-bottom:0!important}.ds-u-sm-padding-left--0,.ds-u-sm-padding-x--0{padding-left:0!important}.ds-u-sm-padding-x--0{padding-right:0!important}.ds-u-sm-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-sm-padding--1{padding:8px!important}.ds-u-sm-padding-top--1{padding-top:8px!important}.ds-u-sm-padding-right--1{padding-right:8px!important}.ds-u-sm-padding-bottom--1{padding-bottom:8px!important}.ds-u-sm-padding-left--1,.ds-u-sm-padding-x--1{padding-left:8px!important}.ds-u-sm-padding-x--1{padding-right:8px!important}.ds-u-sm-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-sm-padding--2{padding:16px!important}.ds-u-sm-padding-top--2{padding-top:16px!important}.ds-u-sm-padding-right--2{padding-right:16px!important}.ds-u-sm-padding-bottom--2{padding-bottom:16px!important}.ds-u-sm-padding-left--2,.ds-u-sm-padding-x--2{padding-left:16px!important}.ds-u-sm-padding-x--2{padding-right:16px!important}.ds-u-sm-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-sm-padding--3{padding:24px!important}.ds-u-sm-padding-top--3{padding-top:24px!important}.ds-u-sm-padding-right--3{padding-right:24px!important}.ds-u-sm-padding-bottom--3{padding-bottom:24px!important}.ds-u-sm-padding-left--3,.ds-u-sm-padding-x--3{padding-left:24px!important}.ds-u-sm-padding-x--3{padding-right:24px!important}.ds-u-sm-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-sm-padding--4{padding:32px!important}.ds-u-sm-padding-top--4{padding-top:32px!important}.ds-u-sm-padding-right--4{padding-right:32px!important}.ds-u-sm-padding-bottom--4{padding-bottom:32px!important}.ds-u-sm-padding-left--4,.ds-u-sm-padding-x--4{padding-left:32px!important}.ds-u-sm-padding-x--4{padding-right:32px!important}.ds-u-sm-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-sm-padding--5{padding:40px!important}.ds-u-sm-padding-top--5{padding-top:40px!important}.ds-u-sm-padding-right--5{padding-right:40px!important}.ds-u-sm-padding-bottom--5{padding-bottom:40px!important}.ds-u-sm-padding-left--5,.ds-u-sm-padding-x--5{padding-left:40px!important}.ds-u-sm-padding-x--5{padding-right:40px!important}.ds-u-sm-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-sm-padding--6{padding:48px!important}.ds-u-sm-padding-top--6{padding-top:48px!important}.ds-u-sm-padding-right--6{padding-right:48px!important}.ds-u-sm-padding-bottom--6{padding-bottom:48px!important}.ds-u-sm-padding-left--6,.ds-u-sm-padding-x--6{padding-left:48px!important}.ds-u-sm-padding-x--6{padding-right:48px!important}.ds-u-sm-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-sm-padding--7{padding:56px!important}.ds-u-sm-padding-top--7{padding-top:56px!important}.ds-u-sm-padding-right--7{padding-right:56px!important}.ds-u-sm-padding-bottom--7{padding-bottom:56px!important}.ds-u-sm-padding-left--7,.ds-u-sm-padding-x--7{padding-left:56px!important}.ds-u-sm-padding-x--7{padding-right:56px!important}.ds-u-sm-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}@media (min-width:768px){.ds-u-md-padding--0{padding:0!important}.ds-u-md-padding-top--0{padding-top:0!important}.ds-u-md-padding-right--0{padding-right:0!important}.ds-u-md-padding-bottom--0{padding-bottom:0!important}.ds-u-md-padding-left--0,.ds-u-md-padding-x--0{padding-left:0!important}.ds-u-md-padding-x--0{padding-right:0!important}.ds-u-md-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-md-padding--1{padding:8px!important}.ds-u-md-padding-top--1{padding-top:8px!important}.ds-u-md-padding-right--1{padding-right:8px!important}.ds-u-md-padding-bottom--1{padding-bottom:8px!important}.ds-u-md-padding-left--1,.ds-u-md-padding-x--1{padding-left:8px!important}.ds-u-md-padding-x--1{padding-right:8px!important}.ds-u-md-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-md-padding--2{padding:16px!important}.ds-u-md-padding-top--2{padding-top:16px!important}.ds-u-md-padding-right--2{padding-right:16px!important}.ds-u-md-padding-bottom--2{padding-bottom:16px!important}.ds-u-md-padding-left--2,.ds-u-md-padding-x--2{padding-left:16px!important}.ds-u-md-padding-x--2{padding-right:16px!important}.ds-u-md-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-md-padding--3{padding:24px!important}.ds-u-md-padding-top--3{padding-top:24px!important}.ds-u-md-padding-right--3{padding-right:24px!important}.ds-u-md-padding-bottom--3{padding-bottom:24px!important}.ds-u-md-padding-left--3,.ds-u-md-padding-x--3{padding-left:24px!important}.ds-u-md-padding-x--3{padding-right:24px!important}.ds-u-md-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-md-padding--4{padding:32px!important}.ds-u-md-padding-top--4{padding-top:32px!important}.ds-u-md-padding-right--4{padding-right:32px!important}.ds-u-md-padding-bottom--4{padding-bottom:32px!important}.ds-u-md-padding-left--4,.ds-u-md-padding-x--4{padding-left:32px!important}.ds-u-md-padding-x--4{padding-right:32px!important}.ds-u-md-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-md-padding--5{padding:40px!important}.ds-u-md-padding-top--5{padding-top:40px!important}.ds-u-md-padding-right--5{padding-right:40px!important}.ds-u-md-padding-bottom--5{padding-bottom:40px!important}.ds-u-md-padding-left--5,.ds-u-md-padding-x--5{padding-left:40px!important}.ds-u-md-padding-x--5{padding-right:40px!important}.ds-u-md-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-md-padding--6{padding:48px!important}.ds-u-md-padding-top--6{padding-top:48px!important}.ds-u-md-padding-right--6{padding-right:48px!important}.ds-u-md-padding-bottom--6{padding-bottom:48px!important}.ds-u-md-padding-left--6,.ds-u-md-padding-x--6{padding-left:48px!important}.ds-u-md-padding-x--6{padding-right:48px!important}.ds-u-md-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-md-padding--7{padding:56px!important}.ds-u-md-padding-top--7{padding-top:56px!important}.ds-u-md-padding-right--7{padding-right:56px!important}.ds-u-md-padding-bottom--7{padding-bottom:56px!important}.ds-u-md-padding-left--7,.ds-u-md-padding-x--7{padding-left:56px!important}.ds-u-md-padding-x--7{padding-right:56px!important}.ds-u-md-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}@media (min-width:1024px){.ds-u-lg-padding--0{padding:0!important}.ds-u-lg-padding-top--0{padding-top:0!important}.ds-u-lg-padding-right--0{padding-right:0!important}.ds-u-lg-padding-bottom--0{padding-bottom:0!important}.ds-u-lg-padding-left--0,.ds-u-lg-padding-x--0{padding-left:0!important}.ds-u-lg-padding-x--0{padding-right:0!important}.ds-u-lg-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-lg-padding--1{padding:8px!important}.ds-u-lg-padding-top--1{padding-top:8px!important}.ds-u-lg-padding-right--1{padding-right:8px!important}.ds-u-lg-padding-bottom--1{padding-bottom:8px!important}.ds-u-lg-padding-left--1,.ds-u-lg-padding-x--1{padding-left:8px!important}.ds-u-lg-padding-x--1{padding-right:8px!important}.ds-u-lg-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-lg-padding--2{padding:16px!important}.ds-u-lg-padding-top--2{padding-top:16px!important}.ds-u-lg-padding-right--2{padding-right:16px!important}.ds-u-lg-padding-bottom--2{padding-bottom:16px!important}.ds-u-lg-padding-left--2,.ds-u-lg-padding-x--2{padding-left:16px!important}.ds-u-lg-padding-x--2{padding-right:16px!important}.ds-u-lg-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-lg-padding--3{padding:24px!important}.ds-u-lg-padding-top--3{padding-top:24px!important}.ds-u-lg-padding-right--3{padding-right:24px!important}.ds-u-lg-padding-bottom--3{padding-bottom:24px!important}.ds-u-lg-padding-left--3,.ds-u-lg-padding-x--3{padding-left:24px!important}.ds-u-lg-padding-x--3{padding-right:24px!important}.ds-u-lg-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-lg-padding--4{padding:32px!important}.ds-u-lg-padding-top--4{padding-top:32px!important}.ds-u-lg-padding-right--4{padding-right:32px!important}.ds-u-lg-padding-bottom--4{padding-bottom:32px!important}.ds-u-lg-padding-left--4,.ds-u-lg-padding-x--4{padding-left:32px!important}.ds-u-lg-padding-x--4{padding-right:32px!important}.ds-u-lg-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-lg-padding--5{padding:40px!important}.ds-u-lg-padding-top--5{padding-top:40px!important}.ds-u-lg-padding-right--5{padding-right:40px!important}.ds-u-lg-padding-bottom--5{padding-bottom:40px!important}.ds-u-lg-padding-left--5,.ds-u-lg-padding-x--5{padding-left:40px!important}.ds-u-lg-padding-x--5{padding-right:40px!important}.ds-u-lg-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-lg-padding--6{padding:48px!important}.ds-u-lg-padding-top--6{padding-top:48px!important}.ds-u-lg-padding-right--6{padding-right:48px!important}.ds-u-lg-padding-bottom--6{padding-bottom:48px!important}.ds-u-lg-padding-left--6,.ds-u-lg-padding-x--6{padding-left:48px!important}.ds-u-lg-padding-x--6{padding-right:48px!important}.ds-u-lg-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-lg-padding--7{padding:56px!important}.ds-u-lg-padding-top--7{padding-top:56px!important}.ds-u-lg-padding-right--7{padding-right:56px!important}.ds-u-lg-padding-bottom--7{padding-bottom:56px!important}.ds-u-lg-padding-left--7,.ds-u-lg-padding-x--7{padding-left:56px!important}.ds-u-lg-padding-x--7{padding-right:56px!important}.ds-u-lg-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}@media (min-width:1280px){.ds-u-xl-padding--0{padding:0!important}.ds-u-xl-padding-top--0{padding-top:0!important}.ds-u-xl-padding-right--0{padding-right:0!important}.ds-u-xl-padding-bottom--0{padding-bottom:0!important}.ds-u-xl-padding-left--0,.ds-u-xl-padding-x--0{padding-left:0!important}.ds-u-xl-padding-x--0{padding-right:0!important}.ds-u-xl-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-xl-padding--1{padding:8px!important}.ds-u-xl-padding-top--1{padding-top:8px!important}.ds-u-xl-padding-right--1{padding-right:8px!important}.ds-u-xl-padding-bottom--1{padding-bottom:8px!important}.ds-u-xl-padding-left--1,.ds-u-xl-padding-x--1{padding-left:8px!important}.ds-u-xl-padding-x--1{padding-right:8px!important}.ds-u-xl-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-xl-padding--2{padding:16px!important}.ds-u-xl-padding-top--2{padding-top:16px!important}.ds-u-xl-padding-right--2{padding-right:16px!important}.ds-u-xl-padding-bottom--2{padding-bottom:16px!important}.ds-u-xl-padding-left--2,.ds-u-xl-padding-x--2{padding-left:16px!important}.ds-u-xl-padding-x--2{padding-right:16px!important}.ds-u-xl-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-xl-padding--3{padding:24px!important}.ds-u-xl-padding-top--3{padding-top:24px!important}.ds-u-xl-padding-right--3{padding-right:24px!important}.ds-u-xl-padding-bottom--3{padding-bottom:24px!important}.ds-u-xl-padding-left--3,.ds-u-xl-padding-x--3{padding-left:24px!important}.ds-u-xl-padding-x--3{padding-right:24px!important}.ds-u-xl-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-xl-padding--4{padding:32px!important}.ds-u-xl-padding-top--4{padding-top:32px!important}.ds-u-xl-padding-right--4{padding-right:32px!important}.ds-u-xl-padding-bottom--4{padding-bottom:32px!important}.ds-u-xl-padding-left--4,.ds-u-xl-padding-x--4{padding-left:32px!important}.ds-u-xl-padding-x--4{padding-right:32px!important}.ds-u-xl-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-xl-padding--5{padding:40px!important}.ds-u-xl-padding-top--5{padding-top:40px!important}.ds-u-xl-padding-right--5{padding-right:40px!important}.ds-u-xl-padding-bottom--5{padding-bottom:40px!important}.ds-u-xl-padding-left--5,.ds-u-xl-padding-x--5{padding-left:40px!important}.ds-u-xl-padding-x--5{padding-right:40px!important}.ds-u-xl-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-xl-padding--6{padding:48px!important}.ds-u-xl-padding-top--6{padding-top:48px!important}.ds-u-xl-padding-right--6{padding-right:48px!important}.ds-u-xl-padding-bottom--6{padding-bottom:48px!important}.ds-u-xl-padding-left--6,.ds-u-xl-padding-x--6{padding-left:48px!important}.ds-u-xl-padding-x--6{padding-right:48px!important}.ds-u-xl-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-xl-padding--7{padding:56px!important}.ds-u-xl-padding-top--7{padding-top:56px!important}.ds-u-xl-padding-right--7{padding-right:56px!important}.ds-u-xl-padding-bottom--7{padding-bottom:56px!important}.ds-u-xl-padding-left--7,.ds-u-xl-padding-x--7{padding-left:56px!important}.ds-u-xl-padding-x--7{padding-right:56px!important}.ds-u-xl-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}.ds-u-text-align--center{text-align:center!important}.ds-u-text-align--left{text-align:left!important}.ds-u-text-align--right{text-align:right!important}@media (min-width:544px){.ds-u-sm-text-align--center{text-align:center!important}.ds-u-sm-text-align--left{text-align:left!important}.ds-u-sm-text-align--right{text-align:right!important}}@media (min-width:768px){.ds-u-md-text-align--center{text-align:center!important}.ds-u-md-text-align--left{text-align:left!important}.ds-u-md-text-align--right{text-align:right!important}}@media (min-width:1024px){.ds-u-lg-text-align--center{text-align:center!important}.ds-u-lg-text-align--left{text-align:left!important}.ds-u-lg-text-align--right{text-align:right!important}}@media (min-width:1280px){.ds-u-xl-text-align--center{text-align:center!important}.ds-u-xl-text-align--left{text-align:left!important}.ds-u-xl-text-align--right{text-align:right!important}}.ds-u-text-decoration--underline{text-decoration:underline!important}.ds-u-text-decoration--none{text-decoration:none!important}.ds-u-text-transform--uppercase{text-transform:uppercase!important}.ds-u-text-transform--lowercase{text-transform:lowercase!important}.ds-u-text-transform--capitalize{text-transform:capitalize!important}.ds-u-truncate{max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.ds-u-valign--top{vertical-align:top!important}.ds-u-valign--middle{vertical-align:middle!important}.ds-u-valign--bottom{vertical-align:bottom!important}body{margin:0;padding:0}img,video{max-width:100%}code[class*=language-],pre[class*=language-]{direction:ltr;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{overflow:auto}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#998;font-style:italic}.token.namespace{opacity:.7}.token.attr-value,.token.string{color:#e3116c}.token.operator,.token.punctuation{color:#393a34}.token.boolean,.token.constant,.token.entity,.token.inserted,.token.number,.token.property,.token.regex,.token.symbol,.token.url,.token.variable{color:#36acaa}.language-autohotkey .token.selector,.token.atrule,.token.attr-name,.token.keyword{color:#00a4db}.language-autohotkey .token.tag,.token.deleted,.token.function{color:#9a050f}.language-autohotkey .token.keyword,.token.selector,.token.tag{color:#00009f}.token.bold,.token.function,.token.important{font-weight:700}.token.italic{font-style:italic}code,pre{background-color:#f1f1f1}code{color:#323a45;display:inline-block;font-family:Roboto Mono,Consolas,Bitstream Vera Sans Mono,Courier New;font-size:.9em;margin-left:1px;margin-right:1px;padding:2px}a code{text-decoration:underline}pre{line-height:1.4;margin:0;padding:16px}pre code{background-color:transparent;color:#323a45;font-size:12px;margin-left:0;margin-right:0;padding:0}a{color:#0071bc}a:focus,a:hover{color:#205493}a:active{color:#112e51}blockquote{background:#e1f3f8;border-left:2px solid #9bdaf1;margin-left:0;padding:16px}blockquote p:first-child{margin-top:0}blockquote p:last-child{margin-bottom:0}.l-content{max-width:1100px}.l-grid{display:-webkit-box;display:-ms-flexbox;display:flex}.l-col-grow{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.l-col-1,.l-col-2,.l-col-3,.l-col-4,.l-col-5,.l-col-6,.l-col-7,.l-col-8,.l-col-9,.l-col-10,.l-col-11,.l-col-12{-webkit-box-sizing:border-box;box-sizing:border-box}.l-col-1{width:8.33333%}.l-col-2{width:16.66667%}.l-col-3{width:25%}.l-col-4{width:33.33333%}.l-col-5{width:41.66667%}.l-col-6{width:50%}.l-col-7{width:58.33333%}.l-col-8{width:66.66667%}.l-col-9{width:75%}.l-col-10{width:83.33333%}.l-col-11{width:91.66667%}.l-col-12{width:100%}.l-sidebar{max-width:250px}.c-swatch{float:left;font-size:12px;width:33%}.c-swatch__preview{-webkit-box-shadow:inset 0 0 1px rgba(0,0,0,.2);box-shadow:inset 0 0 1px rgba(0,0,0,.2);padding-top:33%}.c-swatch__label{font-size:.9em}.u-fill--tile{background:url(/design-system/static/images/bg-transparent.png) 0 0 repeat}
\ No newline at end of file
+/*! Design System - Core v{{version}} */@font-face{font-family:Bitter;font-style:normal;font-weight:400;src:url(/design-system/public/fonts/Bitter-Regular.eot);src:url(/design-system/public/fonts/Bitter-Regular.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/Bitter-Regular.woff2) format("woff2"),url(/design-system/public/fonts/Bitter-Regular.woff) format("woff"),url(/design-system/public/fonts/Bitter-Regular.ttf) format("truetype")}@font-face{font-family:Bitter;font-style:normal;font-weight:700;src:url(/design-system/public/fonts/Bitter-Bold.eot);src:url(/design-system/public/fonts/Bitter-Bold.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/Bitter-Bold.woff2) format("woff2"),url(/design-system/public/fonts/Bitter-Bold.woff) format("woff"),url(/design-system/public/fonts/Bitter-Bold.ttf) format("truetype")}@font-face{font-family:Bitter;font-style:italic;font-weight:400;src:url(/design-system/public/fonts/Bitter-Italic.eot);src:url(/design-system/public/fonts/Bitter-Italic.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/Bitter-Italic.woff2) format("woff2"),url(/design-system/public/fonts/Bitter-Italic.woff) format("woff"),url(/design-system/public/fonts/Bitter-Italic.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;src:url(/design-system/public/fonts/OpenSans-Regular-webfont.eot);src:url(/design-system/public/fonts/OpenSans-Regular-webfont.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/OpenSans-Regular-webfont.woff2) format("woff2"),url(/design-system/public/fonts/OpenSans-Regular-webfont.woff) format("woff"),url(/design-system/public/fonts/OpenSans-Regular-webfont.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:italic;font-weight:400;src:url(/design-system/public/fonts/OpenSans-Italic-webfont.eot);src:url(/design-system/public/fonts/OpenSans-Italic-webfont.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/OpenSans-Italic-webfont.woff2) format("woff2"),url(/design-system/public/fonts/OpenSans-Italic-webfont.woff) format("woff"),url(/design-system/public/fonts/OpenSans-Italic-webfont.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:normal;font-weight:600;src:url(/design-system/public/fonts/OpenSans-Semibold-webfont.eot);src:url(/design-system/public/fonts/OpenSans-Semibold-webfont.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/OpenSans-Semibold-webfont.woff2) format("woff2"),url(/design-system/public/fonts/OpenSans-Semibold-webfont.woff) format("woff"),url(/design-system/public/fonts/OpenSans-Semibold-webfont.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:normal;font-weight:700;src:url(/design-system/public/fonts/OpenSans-Bold-webfont.eot);src:url(/design-system/public/fonts/OpenSans-Bold-webfont.eot?#iefix) format("embedded-opentype"),url(/design-system/public/fonts/OpenSans-Bold-webfont.woff2) format("woff2"),url(/design-system/public/fonts/OpenSans-Bold-webfont.woff) format("woff"),url(/design-system/public/fonts/OpenSans-Bold-webfont.ttf) format("truetype")}.ds-base{color:#212121}.ds-base,.ds-base--inverse{font-family:Open Sans,Helvetica,sans-serif;font-size:16px;line-height:1.5}.ds-base--inverse{background-color:#112e51;color:#fff}.c-details h1:not([class]),.c-details h2:not([class]),.c-details h3:not([class]),.c-details h4:not([class]),.c-details h5:not([class]),.c-details h6:not([class]),.ds-display,.ds-h1,.ds-h2,.ds-h3,.ds-h4,.ds-h5,.ds-h6,.ds-title{line-height:1.3;margin:0}.c-details h1:not([class]),.c-details h2:not([class]),.c-details h3:not([class]),.c-details h4:not([class]),.ds-display,.ds-h1,.ds-h2,.ds-h3,.ds-h4{font-weight:700}.c-details h1:not([class]),.c-details h2:not([class]),.c-details h3:not([class]),.c-details h4:not([class]),.c-details h5:not([class]),.c-details h6:not([class]),.ds-h1,.ds-h2,.ds-h3,.ds-h4,.ds-h5,.ds-h6{margin-bottom:.5em;margin-top:1.5em}.c-details h1:first-child:not([class]),.c-details h2:first-child:not([class]),.c-details h3:first-child:not([class]),.c-details h4:first-child:not([class]),.c-details h5:first-child:not([class]),.c-details h6:first-child:not([class]),.ds-h1:first-child,.ds-h2:first-child,.ds-h3:first-child,.ds-h4:first-child,.ds-h5:first-child,.ds-h6:first-child{margin-top:0}.c-details h1:last-child:not([class]),.c-details h2:last-child:not([class]),.c-details h3:last-child:not([class]),.c-details h4:last-child:not([class]),.c-details h5:last-child:not([class]),.c-details h6:last-child:not([class]),.ds-h1:last-child,.ds-h2:last-child,.ds-h3:last-child,.ds-h4:last-child,.ds-h5:last-child,.ds-h6:last-child{margin-bottom:0}.ds-display{font-size:60px}.ds-title{font-size:48px;font-weight:400}.c-details h1:not([class]),.ds-h1{font-size:36px}.c-details h2:not([class]),.ds-h2{font-size:24px}.c-details h3:not([class]),.ds-h3{font-size:21px}.c-details h4:not([class]),.ds-h4{font-size:18px}.c-details h5:not([class]),.ds-h5{font-size:16px;font-weight:400;text-transform:uppercase}.c-details h6:not([class]),.ds-h6{color:#757575;font-size:14px;font-weight:400;letter-spacing:1px;text-transform:uppercase}.c-details .ds-base--inverse h6:not([class]),.ds-base--inverse .c-details h6:not([class]),.ds-base--inverse .ds-h6{color:#bac5cf}.c-details p:not([class]),.ds-text,.ds-text--lead{line-height:1.5;margin-bottom:1em;margin-top:1em}.c-details p:first-child:not([class]),.ds-text--lead:first-child,.ds-text:first-child{margin-top:0}.c-details p:last-child:not([class]),.ds-text--lead:last-child,.ds-text:last-child{margin-bottom:0}.c-details p:not([class]),.ds-text{font-size:16px}.ds-text--lead{font-size:18px}.ds-c-alert{background-color:#e1f3f8;background-image:url(/design-system/public/images/info.png);background-image:url(/design-system/public/images/info.svg);background-position:8px 15.2px;background-repeat:no-repeat;background-size:40px;border:1px solid #9bdaf1;-webkit-box-sizing:border-box;box-sizing:border-box;color:#212121;min-height:56px;padding:16px}.ds-c-alert a{color:#205493}.ds-c-alert a:focus,.ds-c-alert a:hover{color:#112e51}.ds-c-alert ul:last-child{margin-bottom:0}.ds-c-alert ul:first-child{margin-top:0}.ds-c-alert__body{padding-left:40px}.ds-c-alert__heading{font-size:18px;font-weight:700;margin-bottom:4px;margin-top:0}.ds-c-alert__text{margin-bottom:0;margin-top:0}.ds-c-alert--error{background-color:#f9dede;background-image:url(/design-system/public/images/error.png);background-image:url(/design-system/public/images/error.svg);border-color:#e59393}.ds-c-alert--warn{background-color:#fff1d2;background-image:url(/design-system/public/images/warning.png);background-image:url(/design-system/public/images/warning.svg);border-color:#f9c642}.ds-c-alert--success{background-color:#e7f4e4;background-image:url(/design-system/public/images/success.png);background-image:url(/design-system/public/images/success.svg);border-color:#94bfa2}.ds-c-badge{background-color:#5b616b;border-radius:9999px;color:#fff;display:inline-block;font-size:14px;line-height:1.3;margin-right:4px;padding:4px 8px}.ds-c-badge:only-of-type{margin-right:0}.ds-c-badge--info{background-color:#0071bc}.ds-c-badge--success{background-color:#2e8540}.ds-c-badge--warn{background-color:#fdb81e;color:#212121}.ds-c-badge--alert{background-color:#e31c3d}.ds-c-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:1px solid #0071bc;border-radius:3px;color:#0071bc;cursor:pointer;display:inline-block;font-family:Open Sans,Helvetica,sans-serif;font-size:16px;font-weight:700;line-height:1.3;padding:12px;text-align:center;text-decoration:none}.ds-c-button:focus,.ds-c-button:hover{border-color:#205493;color:#205493}.ds-c-button:active{border-color:#112e51;color:#112e51}.ds-c-button--big{font-size:21px;padding-left:24px;padding-right:24px}.ds-c-button--small{font-size:14px;font-weight:400;padding:8px}.ds-c-button--primary{background-color:#0071bc;color:#fff}.ds-c-button--primary:focus,.ds-c-button--primary:hover{background-color:#205493;color:#fff}.ds-c-button--primary:active{background-color:#112e51}.ds-c-button--transparent,.ds-c-button--transparent-inverse,.ds-c-button--transparent-inverse:active,.ds-c-button--transparent-inverse:focus,.ds-c-button--transparent-inverse:hover,.ds-c-button--transparent:active,.ds-c-button--transparent:focus,.ds-c-button--transparent:hover{border-color:transparent}.ds-c-button--danger{background-color:#e31c3d;border-color:#e31c3d;color:#fff}.ds-c-button--danger:focus,.ds-c-button--danger:hover{background-color:#cd2026;border-color:#cd2026;color:#fff}.ds-c-button--danger:active{background-color:#981b1e;border-color:#981b1e}.ds-c-button--success{background-color:#2e8540;border-color:#2e8540;color:#fff}.ds-c-button--success:focus,.ds-c-button--success:hover{background-color:#2a7a3b;border-color:#2a7a3b;color:#fff}.ds-c-button--success:active{background-color:#266e35;border-color:#266e35}.ds-c-button--disabled,.ds-c-button:disabled{pointer-events:none}.ds-c-button--disabled,.ds-c-button--disabled:active,.ds-c-button--disabled:focus,.ds-c-button--disabled:hover,.ds-c-button:disabled,.ds-c-button:disabled:active,.ds-c-button:disabled:focus,.ds-c-button:disabled:hover{background-color:#d6d7d9;border-color:#d6d7d9;color:#323a45}.ds-c-button--inverse,.ds-c-button--inverse:active,.ds-c-button--inverse:focus,.ds-c-button--inverse:hover{border-color:#fff}.ds-c-button--inverse,.ds-c-button--transparent-inverse{color:#fff}.ds-c-button--inverse:active,.ds-c-button--inverse:focus,.ds-c-button--inverse:hover,.ds-c-button--transparent-inverse:active,.ds-c-button--transparent-inverse:focus,.ds-c-button--transparent-inverse:hover{color:#fff;opacity:.8}.ds-c-button--inverse:active,.ds-c-button--transparent-inverse:active{opacity:.6}.ds-c-button--disabled-inverse,.ds-c-button--disabled-inverse:disabled{background-color:#081627;border-color:#081627;color:#bac5cf;pointer-events:none}.ds-c-button--disabled-inverse:active,.ds-c-button--disabled-inverse:disabled:active,.ds-c-button--disabled-inverse:disabled:focus,.ds-c-button--disabled-inverse:disabled:hover,.ds-c-button--disabled-inverse:focus,.ds-c-button--disabled-inverse:hover{background-color:#112e51;border-color:#112e51;color:#bac5cf}.ds-c-button>svg{fill:currentColor;height:1em;margin-bottom:-.1em;margin-top:-.1em;position:relative;top:-.1em;vertical-align:middle;width:1em}.ds-c-fieldset{border:0;margin:24px 0 0;min-width:0;padding:0}.ds-c-choice{margin-left:-100%;opacity:0;position:absolute}.ds-c-choice+label{cursor:pointer;display:block;font-weight:400;margin:8px 0;max-width:31em;min-height:32px;padding-left:40px;padding-top:4px;position:relative}.ds-c-choice+label:before{background-color:#fff;border:2px solid #212121;-webkit-box-sizing:border-box;box-sizing:border-box;content:"\a0";height:32px;left:0;line-height:32px;position:absolute;text-indent:.15em;top:0;width:32px}.ds-c-choice--inverse+label:before{background-color:#112e51;border-color:#fff}.ds-c-choice:focus+label:before{-webkit-box-shadow:0 0 0 2px #fff,0 0 2px 4px #3e94cf;box-shadow:0 0 0 2px #fff,0 0 2px 4px #3e94cf}.ds-c-choice--inverse:focus+label:before{-webkit-box-shadow:0 0 0 2px #112e51,0 0 2px 4px #59bcff;box-shadow:0 0 0 2px #112e51,0 0 2px 4px #59bcff}.ds-c-choice:checked+label:before{background-color:#0071bc;background-image:url(/design-system/public/images/checkmark-white.png);background-image:url(/design-system/public/images/checkmark-white.svg);background-position:50%;background-repeat:no-repeat;background-size:24px;border-color:#0071bc}.ds-c-choice:disabled+label{color:#757575}.ds-c-choice:disabled+label:before{background-color:#d6d7d9;border:1px solid #aeb0b5;cursor:not-allowed}.ds-c-choice--inverse:disabled+label{color:#bac5cf}.ds-c-choice--inverse:disabled+label:before{background-color:rgba(186,197,207,.15);-webkit-box-shadow:0 0 0 1px #bac5cf;box-shadow:0 0 0 1px #bac5cf}.ds-c-choice[type=radio]+label:before{border-radius:100%}.ds-c-field--select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;background-image:url(/design-system/public/images/arrow-down.png);background-image:url(/design-system/public/images/arrow-down.svg);background-position:right 14px center;background-repeat:no-repeat;background-size:14px}.ds-c-field--select[multiple]{background-image:none}.ds-c-label{display:block;font-size:16px;font-weight:400;margin-bottom:0;margin-top:24px;max-width:460px;padding:0}.ds-c-fieldset>.ds-c-label:first-child{margin-top:0}.ds-c-field__hint{color:#757575;display:block}.ds-c-field__hint--inverse{color:#bac5cf}.c-details ol:not([class]),.c-details ul:not([class]),.ds-c-list{margin-bottom:16px;margin-top:16px;padding-left:32px}.c-details ol:not([class]) li,.c-details ul:not([class]) li,.ds-c-list li{line-height:1.5;margin-bottom:8px}.c-details ol:not([class]) li:last-child,.c-details ul:not([class]) li:last-child,.ds-c-list li:last-child{margin-bottom:0}.ds-c-list--bare{list-style:none;margin:0;padding:0}.ds-c-table{border-collapse:collapse;border-spacing:0;margin:0;min-width:100%}.ds-c-table td{background-color:#fff}.ds-c-table th,.ds-c-table thead td{background-color:#f1f1f1;text-align:left}.ds-c-table tbody th{font-weight:400}.ds-c-table td,.ds-c-table th{border:1px solid #5b616b;padding:1.5rem}.ds-c-table--borderless thead tr{background-color:transparent}.ds-c-table--borderless thead th{border-top:0}.ds-c-table--borderless td,.ds-c-table--borderless th{border-left:0;border-right:0}.ds-c-table__caption{font-weight:700;margin-bottom:8px;text-align:left}.ds-c-tabs{display:-webkit-box;display:-ms-flexbox;display:flex}.ds-c-tabs,.ds-c-tabs__panel{border-bottom:1px solid #d6d7d9}.ds-c-tabs__panel{background-color:#fff;border-left:1px solid #d6d7d9;border-right:1px solid #d6d7d9;padding:24px}.ds-c-tabs__panel[aria-hidden=true]{display:none!important}.ds-c-tabs__item{background-color:#fff;border-bottom:1px solid #d6d7d9;border-left:1px solid #d6d7d9;border-top:1px solid #d6d7d9;color:#212121;cursor:pointer;display:inline-block;font-size:14px;font-weight:700;line-height:1;margin-bottom:-1px;padding:16px 8px;position:relative;text-decoration:none;-webkit-transition:border-bottom-color .3s cubic-bezier(1,0,0,1);transition:border-bottom-color .3s cubic-bezier(1,0,0,1)}@media (min-width:544px){.ds-c-tabs__item{padding-left:16px;padding-right:16px}}@media (min-width:768px){.ds-c-tabs__item{font-size:16px;padding-left:24px;padding-right:24px}}.ds-c-tabs__item:last-child{border-right:1px solid #d6d7d9}.ds-c-tabs__item:after{background-color:#0071bc;content:"";height:4px;left:-1px;opacity:0;position:absolute;right:-1px;top:-1px;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transition:opacity .3s cubic-bezier(1,0,0,1),-webkit-transform .3s cubic-bezier(1,0,0,1);transition:opacity .3s cubic-bezier(1,0,0,1),-webkit-transform .3s cubic-bezier(1,0,0,1);transition:opacity .3s cubic-bezier(1,0,0,1),transform .3s cubic-bezier(1,0,0,1);transition:opacity .3s cubic-bezier(1,0,0,1),transform .3s cubic-bezier(1,0,0,1),-webkit-transform .3s cubic-bezier(1,0,0,1)}.ds-c-tabs__item[aria-selected=true]{border-bottom-color:#fff;color:#0071bc;pointer-events:none}.ds-c-tabs__item[aria-selected=true]:after{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}.ds-c-tabs__item:focus,.ds-c-tabs__item:hover{color:#0071bc}.ds-c-tabs__item:active{color:#205493}.ds-c-tabs__item>svg{fill:currentColor;height:1em;margin-bottom:-.1em;margin-top:-.1em;position:relative;top:-.1em;vertical-align:middle;width:1em}.ds-c-field{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid #212121;border-radius:3px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#212121;display:block;font-size:16px;line-height:1.3;margin:4px 0;max-width:460px;outline:none;padding:12px;width:100%}.ds-c-field:disabled{background-color:#d6d7d9;border-width:0}.ds-c-field:focus{-webkit-box-shadow:0 0 3px #3e94cf,0 0 7px #3e94cf;box-shadow:0 0 3px #3e94cf,0 0 7px #3e94cf}.ds-c-field--inverse{border-color:#000}.ds-c-field--inverse:focus{-webkit-box-shadow:0 0 3px #59bcff,0 0 7px #59bcff;box-shadow:0 0 3px #59bcff,0 0 7px #59bcff}.ds-c-field--error{border:3px solid #e31c3d}.ds-c-field--success{border:3px solid #4aa564}.ds-c-vertical-nav{list-style:none;margin:0;padding:0}.ds-c-vertical-nav>.ds-c-vertical-nav__item{background-color:transparent;border-top:1px solid #5b616b}.ds-c-vertical-nav>.ds-c-vertical-nav__item:first-child{border-top:0}.ds-c-vertical-nav__item{position:relative}.ds-c-vertical-nav__link{border-left:4px solid transparent;color:#212121;display:block;line-height:1.3;padding:8px 16px;text-decoration:none}.ds-c-vertical-nav__link--current{border-left-color:#0071bc;color:#0071bc;font-weight:700}.ds-c-vertical-nav__link--parent{margin-right:40px}a.ds-c-vertical-nav__link:hover{background-color:#f1f1f1;color:#0071bc;text-decoration:none}.ds-c-vertical-nav__subnav{list-style:none;margin:0;padding:0}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__item{font-size:14px}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__link{line-height:1.3;padding-left:24px}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__link--current{border-color:transparent}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__subnav .ds-c-vertical-nav__link{padding-left:32px}.ds-c-vertical-nav__subnav-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;background-image:url(/design-system/public/images/arrow-down.png);background-image:url(/design-system/public/images/arrow-down.svg);background-position:50%;background-repeat:no-repeat;background-size:14px;border:0;cursor:pointer;font-size:inherit;line-height:1.3;padding-bottom:8px;padding-top:8px;position:absolute;right:0;text-indent:-9999px;top:0;width:40px}.ds-c-vertical-nav__subnav-toggle:hover{background-color:#f1f1f1}.ds-c-vertical-nav__subnav-toggle[aria-expanded=true]{background-image:url(/design-system/public/images/arrow-up.png);background-image:url(/design-system/public/images/arrow-up.svg)}.ds-u-fill--primary{background-color:#0071bc!important}.ds-u-fill--primary-darker{background-color:#205493!important}.ds-u-fill--primary-darkest{background-color:#112e51!important}.ds-u-fill--primary-alt{background-color:#02bfe7!important}.ds-u-fill--primary-alt-dark{background-color:#00a6d2!important}.ds-u-fill--primary-alt-darkest{background-color:#046b99!important}.ds-u-fill--primary-alt-light{background-color:#9bdaf1!important}.ds-u-fill--primary-alt-lightest{background-color:#e1f3f8!important}.ds-u-fill--secondary{background-color:#e31c3d!important}.ds-u-fill--secondary-dark{background-color:#cd2026!important}.ds-u-fill--secondary-darkest{background-color:#981b1e!important}.ds-u-fill--secondary-light{background-color:#e59393!important}.ds-u-fill--secondary-lightest{background-color:#f9dede!important}.ds-u-fill--gray{background-color:#5b616b!important}.ds-u-fill--gray-dark{background-color:#323a45!important}.ds-u-fill--gray-light{background-color:#aeb0b5!important}.ds-u-fill--gray-lighter{background-color:#d6d7d9!important}.ds-u-fill--gray-lightest{background-color:#f1f1f1!important}.ds-u-fill--gold{background-color:#fdb81e!important}.ds-u-fill--gold-light{background-color:#f9c642!important}.ds-u-fill--gold-lighter{background-color:#fad980!important}.ds-u-fill--gold-lightest{background-color:#fff1d2!important}.ds-u-fill--green{background-color:#2e8540!important}.ds-u-fill--green-light{background-color:#4aa564!important}.ds-u-fill--green-lighter{background-color:#94bfa2!important}.ds-u-fill--green-lightest{background-color:#e7f4e4!important}.ds-u-fill--error{background-color:#e31c3d!important}.ds-u-fill--error-dark{background-color:#cd2026!important}.ds-u-fill--error-darkest{background-color:#981b1e!important}.ds-u-fill--error-light{background-color:#e59393!important}.ds-u-fill--error-lighter{background-color:#efb9b9!important}.ds-u-fill--error-lightest{background-color:#f9dede!important}.ds-u-fill--warn{background-color:#fdb81e!important}.ds-u-fill--warn-light{background-color:#f9c642!important}.ds-u-fill--warn-lighter{background-color:#fad980!important}.ds-u-fill--warn-lightest{background-color:#fff1d2!important}.ds-u-fill--success{background-color:#2e8540!important}.ds-u-fill--success-light{background-color:#4aa564!important}.ds-u-fill--success-lighter{background-color:#94bfa2!important}.ds-u-fill--success-lightest{background-color:#e7f4e4!important}.ds-u-fill--base{background-color:#212121!important}.ds-u-fill--background,.ds-u-fill--white{background-color:#fff!important}.ds-u-fill--background-inverse{background-color:#112e51!important}.ds-u-fill--transparent{background-color:transparent!important}.ds-u-border--1{border:1px solid #d6d7d9!important}.ds-u-border-top--1{border-top:1px solid #d6d7d9!important}.ds-u-border-right--1{border-right:1px solid #d6d7d9!important}.ds-u-border-bottom--1{border-bottom:1px solid #d6d7d9!important}.ds-u-border-left--1,.ds-u-border-x--1{border-left:1px solid #d6d7d9!important}.ds-u-border-x--1{border-right:1px solid #d6d7d9!important}.ds-u-border-y--1{border-bottom:1px solid #d6d7d9!important;border-top:1px solid #d6d7d9!important}.ds-u-border--2{border:2px solid #d6d7d9!important}.ds-u-border-top--2{border-top:2px solid #d6d7d9!important}.ds-u-border-right--2{border-right:2px solid #d6d7d9!important}.ds-u-border-bottom--2{border-bottom:2px solid #d6d7d9!important}.ds-u-border-left--2,.ds-u-border-x--2{border-left:2px solid #d6d7d9!important}.ds-u-border-x--2{border-right:2px solid #d6d7d9!important}.ds-u-border-y--2{border-bottom:2px solid #d6d7d9!important;border-top:2px solid #d6d7d9!important}.ds-u-border--0{border:0!important}.ds-u-border-top--0{border-top:0!important}.ds-u-border-right--0{border-right:0!important}.ds-u-border-bottom--0{border-bottom:0!important}.ds-u-border-left--0,.ds-u-border-x--0{border-left:0!important}.ds-u-border-x--0{border-right:0!important}.ds-u-border-y--0{border-bottom:0!important;border-top:0!important}.ds-u-border--inverse{border-color:#fff!important}.ds-u-border--error{border-color:#e31c3d!important}.ds-u-border--error-light{border-color:#e59393!important}.ds-u-border--error-lighter{border-color:#efb9b9!important}.ds-u-border--warn{border-color:#fdb81e!important}.ds-u-border--warn-light{border-color:#f9c642!important}.ds-u-border--warn-lighter{border-color:#fad980!important}.ds-u-border--success{border-color:#2e8540!important}.ds-u-border--success-light{border-color:#4aa564!important}.ds-u-border--success-lighter{border-color:#94bfa2!important}.ds-u-radius{border-radius:3px}.ds-u-radius--pill{border-radius:9999px}.ds-u-radius--circle{border-radius:100%}.ds-u-color--primary{color:#0071bc!important}.ds-u-color--primary-darker{color:#205493!important}.ds-u-color--primary-darkest{color:#112e51!important}.ds-u-color--gray{color:#5b616b!important}.ds-u-color--muted{color:#757575!important}.ds-u-color--error{color:#e31c3d!important}.ds-u-color--error-dark{color:#cd2026!important}.ds-u-color--error-light{color:#e59393!important}.ds-u-color--success{color:#2e8540!important}.ds-u-color--base{color:#212121!important}.ds-u-color--base-inverse{color:#fff!important}.ds-u-color--muted-inverse{color:#bac5cf!important}.ds-u-color--black{color:#000!important}.ds-u-color--white{color:#fff!important}.ds-u-display--block{display:block!important}.ds-u-display--inline-block{display:inline-block!important}.ds-u-display--none{display:none!important}.ds-u-visibility--hidden{visibility:hidden!important}.ds-u-visibility--visible{visibility:visible!important}.ds-u-visibility--screen-reader{border:0;clip:rect(0,0,0,0);height:1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal}@media (min-width:544px){.ds-u-sm-display--block{display:block!important}.ds-u-sm-display--inline-block{display:inline-block!important}.ds-u-sm-display--none{display:none!important}.ds-u-sm-visibility--hidden{visibility:hidden!important}.ds-u-sm-visibility--visible{visibility:visible!important}}@media (min-width:768px){.ds-u-md-display--block{display:block!important}.ds-u-md-display--inline-block{display:inline-block!important}.ds-u-md-display--none{display:none!important}.ds-u-md-visibility--hidden{visibility:hidden!important}.ds-u-md-visibility--visible{visibility:visible!important}}@media (min-width:1024px){.ds-u-lg-display--block{display:block!important}.ds-u-lg-display--inline-block{display:inline-block!important}.ds-u-lg-display--none{display:none!important}.ds-u-lg-visibility--hidden{visibility:hidden!important}.ds-u-lg-visibility--visible{visibility:visible!important}}@media (min-width:1280px){.ds-u-xl-display--block{display:block!important}.ds-u-xl-display--inline-block{display:inline-block!important}.ds-u-xl-display--none{display:none!important}.ds-u-xl-visibility--hidden{visibility:hidden!important}.ds-u-xl-visibility--visible{visibility:visible!important}}.ds-u-float--left{float:left!important}.ds-u-float--right{float:right!important}.ds-u-float--none{float:none!important}@media (min-width:544px){.ds-u-sm-float--left{float:left!important}.ds-u-sm-float--right{float:right!important}.ds-u-sm-float--none{float:none!important}}@media (min-width:768px){.ds-u-md-float--left{float:left!important}.ds-u-md-float--right{float:right!important}.ds-u-md-float--none{float:none!important}}@media (min-width:1024px){.ds-u-lg-float--left{float:left!important}.ds-u-lg-float--right{float:right!important}.ds-u-lg-float--none{float:none!important}}@media (min-width:1280px){.ds-u-xl-float--left{float:left!important}.ds-u-xl-float--right{float:right!important}.ds-u-xl-float--none{float:none!important}}.ds-u-sans{font-family:Open Sans,Helvetica,sans-serif!important}.ds-u-serif{font-family:Bitter,Georgia,serif!important}.ds-u-font-size--small{font-size:14px!important}.ds-u-font-size--base{font-size:16px!important}.ds-u-font-size--lead{font-size:18px!important}.ds-u-font-size--display{font-size:60px!important}.ds-u-font-size--title{font-size:48px!important}.ds-u-font-size--h1{font-size:36px!important}.ds-u-font-size--h2{font-size:24px!important}.ds-u-font-size--h3{font-size:21px!important}.ds-u-font-size--h4{font-size:18px!important}@media (min-width:544px){.ds-u-sm-font-size--small{font-size:14px!important}.ds-u-sm-font-size--base{font-size:16px!important}.ds-u-sm-font-size--lead{font-size:18px!important}.ds-u-sm-font-size--display{font-size:60px!important}.ds-u-sm-font-size--title{font-size:48px!important}.ds-u-sm-font-size--h1{font-size:36px!important}.ds-u-sm-font-size--h2{font-size:24px!important}.ds-u-sm-font-size--h3{font-size:21px!important}.ds-u-sm-font-size--h4{font-size:18px!important}}@media (min-width:768px){.ds-u-md-font-size--small{font-size:14px!important}.ds-u-md-font-size--base{font-size:16px!important}.ds-u-md-font-size--lead{font-size:18px!important}.ds-u-md-font-size--display{font-size:60px!important}.ds-u-md-font-size--title{font-size:48px!important}.ds-u-md-font-size--h1{font-size:36px!important}.ds-u-md-font-size--h2{font-size:24px!important}.ds-u-md-font-size--h3{font-size:21px!important}.ds-u-md-font-size--h4{font-size:18px!important}}@media (min-width:1024px){.ds-u-lg-font-size--small{font-size:14px!important}.ds-u-lg-font-size--base{font-size:16px!important}.ds-u-lg-font-size--lead{font-size:18px!important}.ds-u-lg-font-size--display{font-size:60px!important}.ds-u-lg-font-size--title{font-size:48px!important}.ds-u-lg-font-size--h1{font-size:36px!important}.ds-u-lg-font-size--h2{font-size:24px!important}.ds-u-lg-font-size--h3{font-size:21px!important}.ds-u-lg-font-size--h4{font-size:18px!important}}@media (min-width:1280px){.ds-u-xl-font-size--small{font-size:14px!important}.ds-u-xl-font-size--base{font-size:16px!important}.ds-u-xl-font-size--lead{font-size:18px!important}.ds-u-xl-font-size--display{font-size:60px!important}.ds-u-xl-font-size--title{font-size:48px!important}.ds-u-xl-font-size--h1{font-size:36px!important}.ds-u-xl-font-size--h2{font-size:24px!important}.ds-u-xl-font-size--h3{font-size:21px!important}.ds-u-xl-font-size--h4{font-size:18px!important}}.ds-u-font-style--normal{font-style:normal!important}.ds-u-font-style--italic{font-style:italic!important}.ds-u-font-weight--normal{font-weight:400!important}.ds-u-font-weight--semibold{font-weight:600!important}.ds-u-font-weight--bold{font-weight:700!important}.ds-u-leading--base{line-height:1.5!important}.ds-u-leading--lead{line-height:1.7!important}.ds-u-leading--heading{line-height:1.3!important}.ds-u-leading--reset{line-height:1!important}.ds-u-margin--0{margin:0!important}.ds-u-margin-top--0{margin-top:0!important}.ds-u-margin-right--0{margin-right:0!important}.ds-u-margin-bottom--0{margin-bottom:0!important}.ds-u-margin-left--0,.ds-u-margin-x--0{margin-left:0!important}.ds-u-margin-x--0{margin-right:0!important}.ds-u-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-margin--1{margin:8px!important}.ds-u-margin-top--1{margin-top:8px!important}.ds-u-margin-right--1{margin-right:8px!important}.ds-u-margin-bottom--1{margin-bottom:8px!important}.ds-u-margin-left--1,.ds-u-margin-x--1{margin-left:8px!important}.ds-u-margin-x--1{margin-right:8px!important}.ds-u-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-margin--2{margin:16px!important}.ds-u-margin-top--2{margin-top:16px!important}.ds-u-margin-right--2{margin-right:16px!important}.ds-u-margin-bottom--2{margin-bottom:16px!important}.ds-u-margin-left--2,.ds-u-margin-x--2{margin-left:16px!important}.ds-u-margin-x--2{margin-right:16px!important}.ds-u-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-margin--3{margin:24px!important}.ds-u-margin-top--3{margin-top:24px!important}.ds-u-margin-right--3{margin-right:24px!important}.ds-u-margin-bottom--3{margin-bottom:24px!important}.ds-u-margin-left--3,.ds-u-margin-x--3{margin-left:24px!important}.ds-u-margin-x--3{margin-right:24px!important}.ds-u-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-margin--4{margin:32px!important}.ds-u-margin-top--4{margin-top:32px!important}.ds-u-margin-right--4{margin-right:32px!important}.ds-u-margin-bottom--4{margin-bottom:32px!important}.ds-u-margin-left--4,.ds-u-margin-x--4{margin-left:32px!important}.ds-u-margin-x--4{margin-right:32px!important}.ds-u-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-margin--5{margin:40px!important}.ds-u-margin-top--5{margin-top:40px!important}.ds-u-margin-right--5{margin-right:40px!important}.ds-u-margin-bottom--5{margin-bottom:40px!important}.ds-u-margin-left--5,.ds-u-margin-x--5{margin-left:40px!important}.ds-u-margin-x--5{margin-right:40px!important}.ds-u-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-margin--6{margin:48px!important}.ds-u-margin-top--6{margin-top:48px!important}.ds-u-margin-right--6{margin-right:48px!important}.ds-u-margin-bottom--6{margin-bottom:48px!important}.ds-u-margin-left--6,.ds-u-margin-x--6{margin-left:48px!important}.ds-u-margin-x--6{margin-right:48px!important}.ds-u-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-margin--7{margin:56px!important}.ds-u-margin-top--7{margin-top:56px!important}.ds-u-margin-right--7{margin-right:56px!important}.ds-u-margin-bottom--7{margin-bottom:56px!important}.ds-u-margin-left--7,.ds-u-margin-x--7{margin-left:56px!important}.ds-u-margin-x--7{margin-right:56px!important}.ds-u-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}@media (min-width:544px){.ds-u-sm-margin--0{margin:0!important}.ds-u-sm-margin-top--0{margin-top:0!important}.ds-u-sm-margin-right--0{margin-right:0!important}.ds-u-sm-margin-bottom--0{margin-bottom:0!important}.ds-u-sm-margin-left--0,.ds-u-sm-margin-x--0{margin-left:0!important}.ds-u-sm-margin-x--0{margin-right:0!important}.ds-u-sm-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-sm-margin--1{margin:8px!important}.ds-u-sm-margin-top--1{margin-top:8px!important}.ds-u-sm-margin-right--1{margin-right:8px!important}.ds-u-sm-margin-bottom--1{margin-bottom:8px!important}.ds-u-sm-margin-left--1,.ds-u-sm-margin-x--1{margin-left:8px!important}.ds-u-sm-margin-x--1{margin-right:8px!important}.ds-u-sm-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-sm-margin--2{margin:16px!important}.ds-u-sm-margin-top--2{margin-top:16px!important}.ds-u-sm-margin-right--2{margin-right:16px!important}.ds-u-sm-margin-bottom--2{margin-bottom:16px!important}.ds-u-sm-margin-left--2,.ds-u-sm-margin-x--2{margin-left:16px!important}.ds-u-sm-margin-x--2{margin-right:16px!important}.ds-u-sm-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-sm-margin--3{margin:24px!important}.ds-u-sm-margin-top--3{margin-top:24px!important}.ds-u-sm-margin-right--3{margin-right:24px!important}.ds-u-sm-margin-bottom--3{margin-bottom:24px!important}.ds-u-sm-margin-left--3,.ds-u-sm-margin-x--3{margin-left:24px!important}.ds-u-sm-margin-x--3{margin-right:24px!important}.ds-u-sm-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-sm-margin--4{margin:32px!important}.ds-u-sm-margin-top--4{margin-top:32px!important}.ds-u-sm-margin-right--4{margin-right:32px!important}.ds-u-sm-margin-bottom--4{margin-bottom:32px!important}.ds-u-sm-margin-left--4,.ds-u-sm-margin-x--4{margin-left:32px!important}.ds-u-sm-margin-x--4{margin-right:32px!important}.ds-u-sm-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-sm-margin--5{margin:40px!important}.ds-u-sm-margin-top--5{margin-top:40px!important}.ds-u-sm-margin-right--5{margin-right:40px!important}.ds-u-sm-margin-bottom--5{margin-bottom:40px!important}.ds-u-sm-margin-left--5,.ds-u-sm-margin-x--5{margin-left:40px!important}.ds-u-sm-margin-x--5{margin-right:40px!important}.ds-u-sm-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-sm-margin--6{margin:48px!important}.ds-u-sm-margin-top--6{margin-top:48px!important}.ds-u-sm-margin-right--6{margin-right:48px!important}.ds-u-sm-margin-bottom--6{margin-bottom:48px!important}.ds-u-sm-margin-left--6,.ds-u-sm-margin-x--6{margin-left:48px!important}.ds-u-sm-margin-x--6{margin-right:48px!important}.ds-u-sm-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-sm-margin--7{margin:56px!important}.ds-u-sm-margin-top--7{margin-top:56px!important}.ds-u-sm-margin-right--7{margin-right:56px!important}.ds-u-sm-margin-bottom--7{margin-bottom:56px!important}.ds-u-sm-margin-left--7,.ds-u-sm-margin-x--7{margin-left:56px!important}.ds-u-sm-margin-x--7{margin-right:56px!important}.ds-u-sm-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}@media (min-width:768px){.ds-u-md-margin--0{margin:0!important}.ds-u-md-margin-top--0{margin-top:0!important}.ds-u-md-margin-right--0{margin-right:0!important}.ds-u-md-margin-bottom--0{margin-bottom:0!important}.ds-u-md-margin-left--0,.ds-u-md-margin-x--0{margin-left:0!important}.ds-u-md-margin-x--0{margin-right:0!important}.ds-u-md-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-md-margin--1{margin:8px!important}.ds-u-md-margin-top--1{margin-top:8px!important}.ds-u-md-margin-right--1{margin-right:8px!important}.ds-u-md-margin-bottom--1{margin-bottom:8px!important}.ds-u-md-margin-left--1,.ds-u-md-margin-x--1{margin-left:8px!important}.ds-u-md-margin-x--1{margin-right:8px!important}.ds-u-md-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-md-margin--2{margin:16px!important}.ds-u-md-margin-top--2{margin-top:16px!important}.ds-u-md-margin-right--2{margin-right:16px!important}.ds-u-md-margin-bottom--2{margin-bottom:16px!important}.ds-u-md-margin-left--2,.ds-u-md-margin-x--2{margin-left:16px!important}.ds-u-md-margin-x--2{margin-right:16px!important}.ds-u-md-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-md-margin--3{margin:24px!important}.ds-u-md-margin-top--3{margin-top:24px!important}.ds-u-md-margin-right--3{margin-right:24px!important}.ds-u-md-margin-bottom--3{margin-bottom:24px!important}.ds-u-md-margin-left--3,.ds-u-md-margin-x--3{margin-left:24px!important}.ds-u-md-margin-x--3{margin-right:24px!important}.ds-u-md-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-md-margin--4{margin:32px!important}.ds-u-md-margin-top--4{margin-top:32px!important}.ds-u-md-margin-right--4{margin-right:32px!important}.ds-u-md-margin-bottom--4{margin-bottom:32px!important}.ds-u-md-margin-left--4,.ds-u-md-margin-x--4{margin-left:32px!important}.ds-u-md-margin-x--4{margin-right:32px!important}.ds-u-md-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-md-margin--5{margin:40px!important}.ds-u-md-margin-top--5{margin-top:40px!important}.ds-u-md-margin-right--5{margin-right:40px!important}.ds-u-md-margin-bottom--5{margin-bottom:40px!important}.ds-u-md-margin-left--5,.ds-u-md-margin-x--5{margin-left:40px!important}.ds-u-md-margin-x--5{margin-right:40px!important}.ds-u-md-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-md-margin--6{margin:48px!important}.ds-u-md-margin-top--6{margin-top:48px!important}.ds-u-md-margin-right--6{margin-right:48px!important}.ds-u-md-margin-bottom--6{margin-bottom:48px!important}.ds-u-md-margin-left--6,.ds-u-md-margin-x--6{margin-left:48px!important}.ds-u-md-margin-x--6{margin-right:48px!important}.ds-u-md-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-md-margin--7{margin:56px!important}.ds-u-md-margin-top--7{margin-top:56px!important}.ds-u-md-margin-right--7{margin-right:56px!important}.ds-u-md-margin-bottom--7{margin-bottom:56px!important}.ds-u-md-margin-left--7,.ds-u-md-margin-x--7{margin-left:56px!important}.ds-u-md-margin-x--7{margin-right:56px!important}.ds-u-md-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}@media (min-width:1024px){.ds-u-lg-margin--0{margin:0!important}.ds-u-lg-margin-top--0{margin-top:0!important}.ds-u-lg-margin-right--0{margin-right:0!important}.ds-u-lg-margin-bottom--0{margin-bottom:0!important}.ds-u-lg-margin-left--0,.ds-u-lg-margin-x--0{margin-left:0!important}.ds-u-lg-margin-x--0{margin-right:0!important}.ds-u-lg-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-lg-margin--1{margin:8px!important}.ds-u-lg-margin-top--1{margin-top:8px!important}.ds-u-lg-margin-right--1{margin-right:8px!important}.ds-u-lg-margin-bottom--1{margin-bottom:8px!important}.ds-u-lg-margin-left--1,.ds-u-lg-margin-x--1{margin-left:8px!important}.ds-u-lg-margin-x--1{margin-right:8px!important}.ds-u-lg-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-lg-margin--2{margin:16px!important}.ds-u-lg-margin-top--2{margin-top:16px!important}.ds-u-lg-margin-right--2{margin-right:16px!important}.ds-u-lg-margin-bottom--2{margin-bottom:16px!important}.ds-u-lg-margin-left--2,.ds-u-lg-margin-x--2{margin-left:16px!important}.ds-u-lg-margin-x--2{margin-right:16px!important}.ds-u-lg-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-lg-margin--3{margin:24px!important}.ds-u-lg-margin-top--3{margin-top:24px!important}.ds-u-lg-margin-right--3{margin-right:24px!important}.ds-u-lg-margin-bottom--3{margin-bottom:24px!important}.ds-u-lg-margin-left--3,.ds-u-lg-margin-x--3{margin-left:24px!important}.ds-u-lg-margin-x--3{margin-right:24px!important}.ds-u-lg-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-lg-margin--4{margin:32px!important}.ds-u-lg-margin-top--4{margin-top:32px!important}.ds-u-lg-margin-right--4{margin-right:32px!important}.ds-u-lg-margin-bottom--4{margin-bottom:32px!important}.ds-u-lg-margin-left--4,.ds-u-lg-margin-x--4{margin-left:32px!important}.ds-u-lg-margin-x--4{margin-right:32px!important}.ds-u-lg-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-lg-margin--5{margin:40px!important}.ds-u-lg-margin-top--5{margin-top:40px!important}.ds-u-lg-margin-right--5{margin-right:40px!important}.ds-u-lg-margin-bottom--5{margin-bottom:40px!important}.ds-u-lg-margin-left--5,.ds-u-lg-margin-x--5{margin-left:40px!important}.ds-u-lg-margin-x--5{margin-right:40px!important}.ds-u-lg-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-lg-margin--6{margin:48px!important}.ds-u-lg-margin-top--6{margin-top:48px!important}.ds-u-lg-margin-right--6{margin-right:48px!important}.ds-u-lg-margin-bottom--6{margin-bottom:48px!important}.ds-u-lg-margin-left--6,.ds-u-lg-margin-x--6{margin-left:48px!important}.ds-u-lg-margin-x--6{margin-right:48px!important}.ds-u-lg-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-lg-margin--7{margin:56px!important}.ds-u-lg-margin-top--7{margin-top:56px!important}.ds-u-lg-margin-right--7{margin-right:56px!important}.ds-u-lg-margin-bottom--7{margin-bottom:56px!important}.ds-u-lg-margin-left--7,.ds-u-lg-margin-x--7{margin-left:56px!important}.ds-u-lg-margin-x--7{margin-right:56px!important}.ds-u-lg-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}@media (min-width:1280px){.ds-u-xl-margin--0{margin:0!important}.ds-u-xl-margin-top--0{margin-top:0!important}.ds-u-xl-margin-right--0{margin-right:0!important}.ds-u-xl-margin-bottom--0{margin-bottom:0!important}.ds-u-xl-margin-left--0,.ds-u-xl-margin-x--0{margin-left:0!important}.ds-u-xl-margin-x--0{margin-right:0!important}.ds-u-xl-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-xl-margin--1{margin:8px!important}.ds-u-xl-margin-top--1{margin-top:8px!important}.ds-u-xl-margin-right--1{margin-right:8px!important}.ds-u-xl-margin-bottom--1{margin-bottom:8px!important}.ds-u-xl-margin-left--1,.ds-u-xl-margin-x--1{margin-left:8px!important}.ds-u-xl-margin-x--1{margin-right:8px!important}.ds-u-xl-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-xl-margin--2{margin:16px!important}.ds-u-xl-margin-top--2{margin-top:16px!important}.ds-u-xl-margin-right--2{margin-right:16px!important}.ds-u-xl-margin-bottom--2{margin-bottom:16px!important}.ds-u-xl-margin-left--2,.ds-u-xl-margin-x--2{margin-left:16px!important}.ds-u-xl-margin-x--2{margin-right:16px!important}.ds-u-xl-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-xl-margin--3{margin:24px!important}.ds-u-xl-margin-top--3{margin-top:24px!important}.ds-u-xl-margin-right--3{margin-right:24px!important}.ds-u-xl-margin-bottom--3{margin-bottom:24px!important}.ds-u-xl-margin-left--3,.ds-u-xl-margin-x--3{margin-left:24px!important}.ds-u-xl-margin-x--3{margin-right:24px!important}.ds-u-xl-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-xl-margin--4{margin:32px!important}.ds-u-xl-margin-top--4{margin-top:32px!important}.ds-u-xl-margin-right--4{margin-right:32px!important}.ds-u-xl-margin-bottom--4{margin-bottom:32px!important}.ds-u-xl-margin-left--4,.ds-u-xl-margin-x--4{margin-left:32px!important}.ds-u-xl-margin-x--4{margin-right:32px!important}.ds-u-xl-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-xl-margin--5{margin:40px!important}.ds-u-xl-margin-top--5{margin-top:40px!important}.ds-u-xl-margin-right--5{margin-right:40px!important}.ds-u-xl-margin-bottom--5{margin-bottom:40px!important}.ds-u-xl-margin-left--5,.ds-u-xl-margin-x--5{margin-left:40px!important}.ds-u-xl-margin-x--5{margin-right:40px!important}.ds-u-xl-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-xl-margin--6{margin:48px!important}.ds-u-xl-margin-top--6{margin-top:48px!important}.ds-u-xl-margin-right--6{margin-right:48px!important}.ds-u-xl-margin-bottom--6{margin-bottom:48px!important}.ds-u-xl-margin-left--6,.ds-u-xl-margin-x--6{margin-left:48px!important}.ds-u-xl-margin-x--6{margin-right:48px!important}.ds-u-xl-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-xl-margin--7{margin:56px!important}.ds-u-xl-margin-top--7{margin-top:56px!important}.ds-u-xl-margin-right--7{margin-right:56px!important}.ds-u-xl-margin-bottom--7{margin-bottom:56px!important}.ds-u-xl-margin-left--7,.ds-u-xl-margin-x--7{margin-left:56px!important}.ds-u-xl-margin-x--7{margin-right:56px!important}.ds-u-xl-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}.ds-u-measure--narrow{max-width:21em!important}.ds-u-measure--base{max-width:31em!important}.ds-u-measure--wide{max-width:41em!important}.ds-u-overflow--hidden{overflow:hidden!important}.ds-u-overflow--scroll{overflow:scroll!important}.ds-u-overflow--auto{overflow:auto!important}.ds-u-clearfix:after,.ds-u-clearfix:before{content:"";display:table}.ds-u-clearfix:after{clear:both}.ds-u-padding--0{padding:0!important}.ds-u-padding-top--0{padding-top:0!important}.ds-u-padding-right--0{padding-right:0!important}.ds-u-padding-bottom--0{padding-bottom:0!important}.ds-u-padding-left--0,.ds-u-padding-x--0{padding-left:0!important}.ds-u-padding-x--0{padding-right:0!important}.ds-u-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-padding--1{padding:8px!important}.ds-u-padding-top--1{padding-top:8px!important}.ds-u-padding-right--1{padding-right:8px!important}.ds-u-padding-bottom--1{padding-bottom:8px!important}.ds-u-padding-left--1,.ds-u-padding-x--1{padding-left:8px!important}.ds-u-padding-x--1{padding-right:8px!important}.ds-u-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-padding--2{padding:16px!important}.ds-u-padding-top--2{padding-top:16px!important}.ds-u-padding-right--2{padding-right:16px!important}.ds-u-padding-bottom--2{padding-bottom:16px!important}.ds-u-padding-left--2,.ds-u-padding-x--2{padding-left:16px!important}.ds-u-padding-x--2{padding-right:16px!important}.ds-u-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-padding--3{padding:24px!important}.ds-u-padding-top--3{padding-top:24px!important}.ds-u-padding-right--3{padding-right:24px!important}.ds-u-padding-bottom--3{padding-bottom:24px!important}.ds-u-padding-left--3,.ds-u-padding-x--3{padding-left:24px!important}.ds-u-padding-x--3{padding-right:24px!important}.ds-u-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-padding--4{padding:32px!important}.ds-u-padding-top--4{padding-top:32px!important}.ds-u-padding-right--4{padding-right:32px!important}.ds-u-padding-bottom--4{padding-bottom:32px!important}.ds-u-padding-left--4,.ds-u-padding-x--4{padding-left:32px!important}.ds-u-padding-x--4{padding-right:32px!important}.ds-u-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-padding--5{padding:40px!important}.ds-u-padding-top--5{padding-top:40px!important}.ds-u-padding-right--5{padding-right:40px!important}.ds-u-padding-bottom--5{padding-bottom:40px!important}.ds-u-padding-left--5,.ds-u-padding-x--5{padding-left:40px!important}.ds-u-padding-x--5{padding-right:40px!important}.ds-u-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-padding--6{padding:48px!important}.ds-u-padding-top--6{padding-top:48px!important}.ds-u-padding-right--6{padding-right:48px!important}.ds-u-padding-bottom--6{padding-bottom:48px!important}.ds-u-padding-left--6,.ds-u-padding-x--6{padding-left:48px!important}.ds-u-padding-x--6{padding-right:48px!important}.ds-u-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-padding--7{padding:56px!important}.ds-u-padding-top--7{padding-top:56px!important}.ds-u-padding-right--7{padding-right:56px!important}.ds-u-padding-bottom--7{padding-bottom:56px!important}.ds-u-padding-left--7,.ds-u-padding-x--7{padding-left:56px!important}.ds-u-padding-x--7{padding-right:56px!important}.ds-u-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}@media (min-width:544px){.ds-u-sm-padding--0{padding:0!important}.ds-u-sm-padding-top--0{padding-top:0!important}.ds-u-sm-padding-right--0{padding-right:0!important}.ds-u-sm-padding-bottom--0{padding-bottom:0!important}.ds-u-sm-padding-left--0,.ds-u-sm-padding-x--0{padding-left:0!important}.ds-u-sm-padding-x--0{padding-right:0!important}.ds-u-sm-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-sm-padding--1{padding:8px!important}.ds-u-sm-padding-top--1{padding-top:8px!important}.ds-u-sm-padding-right--1{padding-right:8px!important}.ds-u-sm-padding-bottom--1{padding-bottom:8px!important}.ds-u-sm-padding-left--1,.ds-u-sm-padding-x--1{padding-left:8px!important}.ds-u-sm-padding-x--1{padding-right:8px!important}.ds-u-sm-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-sm-padding--2{padding:16px!important}.ds-u-sm-padding-top--2{padding-top:16px!important}.ds-u-sm-padding-right--2{padding-right:16px!important}.ds-u-sm-padding-bottom--2{padding-bottom:16px!important}.ds-u-sm-padding-left--2,.ds-u-sm-padding-x--2{padding-left:16px!important}.ds-u-sm-padding-x--2{padding-right:16px!important}.ds-u-sm-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-sm-padding--3{padding:24px!important}.ds-u-sm-padding-top--3{padding-top:24px!important}.ds-u-sm-padding-right--3{padding-right:24px!important}.ds-u-sm-padding-bottom--3{padding-bottom:24px!important}.ds-u-sm-padding-left--3,.ds-u-sm-padding-x--3{padding-left:24px!important}.ds-u-sm-padding-x--3{padding-right:24px!important}.ds-u-sm-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-sm-padding--4{padding:32px!important}.ds-u-sm-padding-top--4{padding-top:32px!important}.ds-u-sm-padding-right--4{padding-right:32px!important}.ds-u-sm-padding-bottom--4{padding-bottom:32px!important}.ds-u-sm-padding-left--4,.ds-u-sm-padding-x--4{padding-left:32px!important}.ds-u-sm-padding-x--4{padding-right:32px!important}.ds-u-sm-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-sm-padding--5{padding:40px!important}.ds-u-sm-padding-top--5{padding-top:40px!important}.ds-u-sm-padding-right--5{padding-right:40px!important}.ds-u-sm-padding-bottom--5{padding-bottom:40px!important}.ds-u-sm-padding-left--5,.ds-u-sm-padding-x--5{padding-left:40px!important}.ds-u-sm-padding-x--5{padding-right:40px!important}.ds-u-sm-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-sm-padding--6{padding:48px!important}.ds-u-sm-padding-top--6{padding-top:48px!important}.ds-u-sm-padding-right--6{padding-right:48px!important}.ds-u-sm-padding-bottom--6{padding-bottom:48px!important}.ds-u-sm-padding-left--6,.ds-u-sm-padding-x--6{padding-left:48px!important}.ds-u-sm-padding-x--6{padding-right:48px!important}.ds-u-sm-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-sm-padding--7{padding:56px!important}.ds-u-sm-padding-top--7{padding-top:56px!important}.ds-u-sm-padding-right--7{padding-right:56px!important}.ds-u-sm-padding-bottom--7{padding-bottom:56px!important}.ds-u-sm-padding-left--7,.ds-u-sm-padding-x--7{padding-left:56px!important}.ds-u-sm-padding-x--7{padding-right:56px!important}.ds-u-sm-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}@media (min-width:768px){.ds-u-md-padding--0{padding:0!important}.ds-u-md-padding-top--0{padding-top:0!important}.ds-u-md-padding-right--0{padding-right:0!important}.ds-u-md-padding-bottom--0{padding-bottom:0!important}.ds-u-md-padding-left--0,.ds-u-md-padding-x--0{padding-left:0!important}.ds-u-md-padding-x--0{padding-right:0!important}.ds-u-md-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-md-padding--1{padding:8px!important}.ds-u-md-padding-top--1{padding-top:8px!important}.ds-u-md-padding-right--1{padding-right:8px!important}.ds-u-md-padding-bottom--1{padding-bottom:8px!important}.ds-u-md-padding-left--1,.ds-u-md-padding-x--1{padding-left:8px!important}.ds-u-md-padding-x--1{padding-right:8px!important}.ds-u-md-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-md-padding--2{padding:16px!important}.ds-u-md-padding-top--2{padding-top:16px!important}.ds-u-md-padding-right--2{padding-right:16px!important}.ds-u-md-padding-bottom--2{padding-bottom:16px!important}.ds-u-md-padding-left--2,.ds-u-md-padding-x--2{padding-left:16px!important}.ds-u-md-padding-x--2{padding-right:16px!important}.ds-u-md-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-md-padding--3{padding:24px!important}.ds-u-md-padding-top--3{padding-top:24px!important}.ds-u-md-padding-right--3{padding-right:24px!important}.ds-u-md-padding-bottom--3{padding-bottom:24px!important}.ds-u-md-padding-left--3,.ds-u-md-padding-x--3{padding-left:24px!important}.ds-u-md-padding-x--3{padding-right:24px!important}.ds-u-md-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-md-padding--4{padding:32px!important}.ds-u-md-padding-top--4{padding-top:32px!important}.ds-u-md-padding-right--4{padding-right:32px!important}.ds-u-md-padding-bottom--4{padding-bottom:32px!important}.ds-u-md-padding-left--4,.ds-u-md-padding-x--4{padding-left:32px!important}.ds-u-md-padding-x--4{padding-right:32px!important}.ds-u-md-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-md-padding--5{padding:40px!important}.ds-u-md-padding-top--5{padding-top:40px!important}.ds-u-md-padding-right--5{padding-right:40px!important}.ds-u-md-padding-bottom--5{padding-bottom:40px!important}.ds-u-md-padding-left--5,.ds-u-md-padding-x--5{padding-left:40px!important}.ds-u-md-padding-x--5{padding-right:40px!important}.ds-u-md-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-md-padding--6{padding:48px!important}.ds-u-md-padding-top--6{padding-top:48px!important}.ds-u-md-padding-right--6{padding-right:48px!important}.ds-u-md-padding-bottom--6{padding-bottom:48px!important}.ds-u-md-padding-left--6,.ds-u-md-padding-x--6{padding-left:48px!important}.ds-u-md-padding-x--6{padding-right:48px!important}.ds-u-md-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-md-padding--7{padding:56px!important}.ds-u-md-padding-top--7{padding-top:56px!important}.ds-u-md-padding-right--7{padding-right:56px!important}.ds-u-md-padding-bottom--7{padding-bottom:56px!important}.ds-u-md-padding-left--7,.ds-u-md-padding-x--7{padding-left:56px!important}.ds-u-md-padding-x--7{padding-right:56px!important}.ds-u-md-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}@media (min-width:1024px){.ds-u-lg-padding--0{padding:0!important}.ds-u-lg-padding-top--0{padding-top:0!important}.ds-u-lg-padding-right--0{padding-right:0!important}.ds-u-lg-padding-bottom--0{padding-bottom:0!important}.ds-u-lg-padding-left--0,.ds-u-lg-padding-x--0{padding-left:0!important}.ds-u-lg-padding-x--0{padding-right:0!important}.ds-u-lg-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-lg-padding--1{padding:8px!important}.ds-u-lg-padding-top--1{padding-top:8px!important}.ds-u-lg-padding-right--1{padding-right:8px!important}.ds-u-lg-padding-bottom--1{padding-bottom:8px!important}.ds-u-lg-padding-left--1,.ds-u-lg-padding-x--1{padding-left:8px!important}.ds-u-lg-padding-x--1{padding-right:8px!important}.ds-u-lg-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-lg-padding--2{padding:16px!important}.ds-u-lg-padding-top--2{padding-top:16px!important}.ds-u-lg-padding-right--2{padding-right:16px!important}.ds-u-lg-padding-bottom--2{padding-bottom:16px!important}.ds-u-lg-padding-left--2,.ds-u-lg-padding-x--2{padding-left:16px!important}.ds-u-lg-padding-x--2{padding-right:16px!important}.ds-u-lg-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-lg-padding--3{padding:24px!important}.ds-u-lg-padding-top--3{padding-top:24px!important}.ds-u-lg-padding-right--3{padding-right:24px!important}.ds-u-lg-padding-bottom--3{padding-bottom:24px!important}.ds-u-lg-padding-left--3,.ds-u-lg-padding-x--3{padding-left:24px!important}.ds-u-lg-padding-x--3{padding-right:24px!important}.ds-u-lg-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-lg-padding--4{padding:32px!important}.ds-u-lg-padding-top--4{padding-top:32px!important}.ds-u-lg-padding-right--4{padding-right:32px!important}.ds-u-lg-padding-bottom--4{padding-bottom:32px!important}.ds-u-lg-padding-left--4,.ds-u-lg-padding-x--4{padding-left:32px!important}.ds-u-lg-padding-x--4{padding-right:32px!important}.ds-u-lg-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-lg-padding--5{padding:40px!important}.ds-u-lg-padding-top--5{padding-top:40px!important}.ds-u-lg-padding-right--5{padding-right:40px!important}.ds-u-lg-padding-bottom--5{padding-bottom:40px!important}.ds-u-lg-padding-left--5,.ds-u-lg-padding-x--5{padding-left:40px!important}.ds-u-lg-padding-x--5{padding-right:40px!important}.ds-u-lg-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-lg-padding--6{padding:48px!important}.ds-u-lg-padding-top--6{padding-top:48px!important}.ds-u-lg-padding-right--6{padding-right:48px!important}.ds-u-lg-padding-bottom--6{padding-bottom:48px!important}.ds-u-lg-padding-left--6,.ds-u-lg-padding-x--6{padding-left:48px!important}.ds-u-lg-padding-x--6{padding-right:48px!important}.ds-u-lg-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-lg-padding--7{padding:56px!important}.ds-u-lg-padding-top--7{padding-top:56px!important}.ds-u-lg-padding-right--7{padding-right:56px!important}.ds-u-lg-padding-bottom--7{padding-bottom:56px!important}.ds-u-lg-padding-left--7,.ds-u-lg-padding-x--7{padding-left:56px!important}.ds-u-lg-padding-x--7{padding-right:56px!important}.ds-u-lg-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}@media (min-width:1280px){.ds-u-xl-padding--0{padding:0!important}.ds-u-xl-padding-top--0{padding-top:0!important}.ds-u-xl-padding-right--0{padding-right:0!important}.ds-u-xl-padding-bottom--0{padding-bottom:0!important}.ds-u-xl-padding-left--0,.ds-u-xl-padding-x--0{padding-left:0!important}.ds-u-xl-padding-x--0{padding-right:0!important}.ds-u-xl-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-xl-padding--1{padding:8px!important}.ds-u-xl-padding-top--1{padding-top:8px!important}.ds-u-xl-padding-right--1{padding-right:8px!important}.ds-u-xl-padding-bottom--1{padding-bottom:8px!important}.ds-u-xl-padding-left--1,.ds-u-xl-padding-x--1{padding-left:8px!important}.ds-u-xl-padding-x--1{padding-right:8px!important}.ds-u-xl-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-xl-padding--2{padding:16px!important}.ds-u-xl-padding-top--2{padding-top:16px!important}.ds-u-xl-padding-right--2{padding-right:16px!important}.ds-u-xl-padding-bottom--2{padding-bottom:16px!important}.ds-u-xl-padding-left--2,.ds-u-xl-padding-x--2{padding-left:16px!important}.ds-u-xl-padding-x--2{padding-right:16px!important}.ds-u-xl-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-xl-padding--3{padding:24px!important}.ds-u-xl-padding-top--3{padding-top:24px!important}.ds-u-xl-padding-right--3{padding-right:24px!important}.ds-u-xl-padding-bottom--3{padding-bottom:24px!important}.ds-u-xl-padding-left--3,.ds-u-xl-padding-x--3{padding-left:24px!important}.ds-u-xl-padding-x--3{padding-right:24px!important}.ds-u-xl-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-xl-padding--4{padding:32px!important}.ds-u-xl-padding-top--4{padding-top:32px!important}.ds-u-xl-padding-right--4{padding-right:32px!important}.ds-u-xl-padding-bottom--4{padding-bottom:32px!important}.ds-u-xl-padding-left--4,.ds-u-xl-padding-x--4{padding-left:32px!important}.ds-u-xl-padding-x--4{padding-right:32px!important}.ds-u-xl-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-xl-padding--5{padding:40px!important}.ds-u-xl-padding-top--5{padding-top:40px!important}.ds-u-xl-padding-right--5{padding-right:40px!important}.ds-u-xl-padding-bottom--5{padding-bottom:40px!important}.ds-u-xl-padding-left--5,.ds-u-xl-padding-x--5{padding-left:40px!important}.ds-u-xl-padding-x--5{padding-right:40px!important}.ds-u-xl-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-xl-padding--6{padding:48px!important}.ds-u-xl-padding-top--6{padding-top:48px!important}.ds-u-xl-padding-right--6{padding-right:48px!important}.ds-u-xl-padding-bottom--6{padding-bottom:48px!important}.ds-u-xl-padding-left--6,.ds-u-xl-padding-x--6{padding-left:48px!important}.ds-u-xl-padding-x--6{padding-right:48px!important}.ds-u-xl-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-xl-padding--7{padding:56px!important}.ds-u-xl-padding-top--7{padding-top:56px!important}.ds-u-xl-padding-right--7{padding-right:56px!important}.ds-u-xl-padding-bottom--7{padding-bottom:56px!important}.ds-u-xl-padding-left--7,.ds-u-xl-padding-x--7{padding-left:56px!important}.ds-u-xl-padding-x--7{padding-right:56px!important}.ds-u-xl-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}.ds-u-text-align--center{text-align:center!important}.ds-u-text-align--left{text-align:left!important}.ds-u-text-align--right{text-align:right!important}@media (min-width:544px){.ds-u-sm-text-align--center{text-align:center!important}.ds-u-sm-text-align--left{text-align:left!important}.ds-u-sm-text-align--right{text-align:right!important}}@media (min-width:768px){.ds-u-md-text-align--center{text-align:center!important}.ds-u-md-text-align--left{text-align:left!important}.ds-u-md-text-align--right{text-align:right!important}}@media (min-width:1024px){.ds-u-lg-text-align--center{text-align:center!important}.ds-u-lg-text-align--left{text-align:left!important}.ds-u-lg-text-align--right{text-align:right!important}}@media (min-width:1280px){.ds-u-xl-text-align--center{text-align:center!important}.ds-u-xl-text-align--left{text-align:left!important}.ds-u-xl-text-align--right{text-align:right!important}}.ds-u-text-decoration--underline{text-decoration:underline!important}.ds-u-text-decoration--none{text-decoration:none!important}.ds-u-text-transform--uppercase{text-transform:uppercase!important}.ds-u-text-transform--lowercase{text-transform:lowercase!important}.ds-u-text-transform--capitalize{text-transform:capitalize!important}.ds-u-truncate{max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.ds-u-valign--top{vertical-align:top!important}.ds-u-valign--middle{vertical-align:middle!important}.ds-u-valign--bottom{vertical-align:bottom!important}body{margin:0;padding:0}img,video{max-width:100%}code[class*=language-],pre[class*=language-]{direction:ltr;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{overflow:auto}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#998;font-style:italic}.token.namespace{opacity:.7}.token.attr-value,.token.string{color:#e3116c}.token.operator,.token.punctuation{color:#393a34}.token.boolean,.token.constant,.token.entity,.token.inserted,.token.number,.token.property,.token.regex,.token.symbol,.token.url,.token.variable{color:#36acaa}.language-autohotkey .token.selector,.token.atrule,.token.attr-name,.token.keyword{color:#00a4db}.language-autohotkey .token.tag,.token.deleted,.token.function{color:#9a050f}.language-autohotkey .token.keyword,.token.selector,.token.tag{color:#00009f}.token.bold,.token.function,.token.important{font-weight:700}.token.italic{font-style:italic}code,pre{background-color:#f1f1f1}code{color:#323a45;display:inline-block;font-family:Roboto Mono,Consolas,Bitstream Vera Sans Mono,Courier New;font-size:.9em;margin-left:1px;margin-right:1px;padding:2px}a code{text-decoration:underline}pre{line-height:1.4;margin:0;padding:16px}pre code{background-color:transparent;color:#323a45;font-size:12px;margin-left:0;margin-right:0;padding:0}a{color:#0071bc}a:focus,a:hover{color:#205493}a:active{color:#112e51}blockquote{background:#e1f3f8;border-left:2px solid #9bdaf1;margin-left:0;padding:16px}blockquote p:first-child{margin-top:0}blockquote p:last-child{margin-bottom:0}.l-content{max-width:1100px}.l-grid{display:-webkit-box;display:-ms-flexbox;display:flex}.l-col-grow{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.l-col-1,.l-col-2,.l-col-3,.l-col-4,.l-col-5,.l-col-6,.l-col-7,.l-col-8,.l-col-9,.l-col-10,.l-col-11,.l-col-12{-webkit-box-sizing:border-box;box-sizing:border-box}.l-col-1{width:8.33333%}.l-col-2{width:16.66667%}.l-col-3{width:25%}.l-col-4{width:33.33333%}.l-col-5{width:41.66667%}.l-col-6{width:50%}.l-col-7{width:58.33333%}.l-col-8{width:66.66667%}.l-col-9{width:75%}.l-col-10{width:83.33333%}.l-col-11{width:91.66667%}.l-col-12{width:100%}.l-sidebar{max-width:250px}.c-swatch{float:left;font-size:12px;width:33%}.c-swatch__preview{-webkit-box-shadow:inset 0 0 1px rgba(0,0,0,.2);box-shadow:inset 0 0 1px rgba(0,0,0,.2);padding-top:33%}.c-swatch__label{font-size:.9em}.u-fill--tile{background:url(/design-system/static/images/bg-transparent.png) 0 0 repeat}
\ No newline at end of file
diff --git a/docs/utilities/background-color/index.html b/docs/utilities/background-color/index.html
index f0fb48ef23..9a7bfe5aa5 100644
--- a/docs/utilities/background-color/index.html
+++ b/docs/utilities/background-color/index.html
@@ -2,14 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Background color - CMSgov Design System</title>
+  <title>Background color - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1610723991"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.background-color" data-reactid="12">Background color</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/background-color.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>Use the background color utility to change the default background color of an element. Each background color group may have a <code>dark</code>, <code>darker</code>, <code>darkest</code>, <code>light</code>, <code>lighter</code> and <code>lightest</code> shade modifier.</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1997694522"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.background-color" data-reactid="10">Background color</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/background-color.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>Use the background color utility to change the default background color of an element. Each background color group may have a <code>dark</code>, <code>darker</code>, <code>darkest</code>, <code>light</code>, <code>lighter</code> and <code>lightest</code> shade modifier.</p>
 <p>Color groups include:</p>
 <ul>
 <li><strong>primary</strong> - The dominant brand color, used for things like links and call-to-actions</li>
@@ -20,7 +20,7 @@
 </ul>
 <p><strong>Format</strong>: <code>ds-u-fill--[COLOR NAME]-[SHADE]</code></p>
 <h2 id="theming">Theming</h2>
-<p>Each background (and text color) utility class utilizes a Sass color variable which can be overridden. The swatches below include the utility class name as well as the Sass variable name.</p></div><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20"><div class="d-u-margin-bottom-2 ds-u-clearfix">
+<p>Each background (and text color) utility class utilizes a Sass color variable which can be overridden. The swatches below include the utility class name as well as the Sass variable name.</p></div><section class="ds-u-margin-top--3" data-reactid="16"><div class="markup markup--html" data-reactid="17"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="18"><div class="d-u-margin-bottom-2 ds-u-clearfix">
   <article class="c-swatch ds-u-margin-bottom--2">
     <div class="c-swatch__preview ds-u-fill--primary"></div>
     <code class="c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead">
@@ -359,7 +359,7 @@ <h2 id="theming">Theming</h2>
   </div>
   <script type="text/javascript">
     var page = {"header":"Background color","description":"<p>Use the background color utility to change the default background color of an element. Each background color group may have a <code>dark</code>, <code>darker</code>, <code>darkest</code>, <code>light</code>, <code>lighter</code> and <code>lightest</code> shade modifier.</p>\n<p>Color groups include:</p>\n<ul>\n<li><strong>primary</strong> - The dominant brand color, used for things like links and call-to-actions</li>\n<li><strong>primary-alt</strong> - A variation of the dominant brand color</li>\n<li><strong>secondary</strong> - A secondary brand color that can be used for accents and call-to-action variations.</li>\n<li><strong>tertiary</strong> - Complementary accent colors</li>\n<li><strong>state</strong> - State indicator accents (success, warning, error)</li>\n</ul>\n<p><strong>Format</strong>: <code>ds-u-fill--[COLOR NAME]-[SHADE]</code></p>\n<h2 id=\"theming\">Theming</h2>\n<p>Each background (and text color) utility class utilizes a Sass color variable which can be overridden. The swatches below include the utility class name as well as the Sass variable name.</p>","reference":"utilities.background-color","referenceNumber":"2.1","referenceURI":"design-system/utilities/background-color","weight":0,"markup":"<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary\n      <br />$color-primary\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-darker\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-darker\n      <br />$color-primary-darker\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-darkest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-darkest\n      <br />$color-primary-darkest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt\n      <br />$color-primary-alt\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt-dark\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt-dark\n      <br />$color-primary-alt-dark\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt-darkest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt-darkest\n      <br />$color-primary-alt-darkest\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt-light\n      <br />$color-primary-alt-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt-lightest\n      <br />$color-primary-alt-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary\n      <br />$color-secondary\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary-dark\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary-dark\n      <br />$color-secondary-dark\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary-darkest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary-darkest\n      <br />$color-secondary-darkest\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary-light\n      <br />$color-secondary-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary-lightest\n      <br />$color-secondary-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray\n      <br />$color-gray\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray-dark\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray-dark\n      <br />$color-gray-dark\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray-light\n      <br />$color-gray-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray-lighter\n      <br />$color-gray-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray-lightest\n      <br />$color-gray-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gold\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gold\n      <br />$color-gold\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gold-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gold-light\n      <br />$color-gold-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gold-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gold-lighter\n      <br />$color-gold-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gold-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gold-lightest\n      <br />$color-gold-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--warn\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--warn\n      <br />$color-warn\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--warn-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--warn-light\n      <br />$color-warn-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--warn-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--warn-lighter\n      <br />$color-warn-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--warn-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--warn-lightest\n      <br />$color-warn-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--green\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--green\n      <br />$color-green\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--green-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--green-light\n      <br />$color-green-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--green-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--green-lighter\n      <br />$color-green-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--green-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--green-lightest\n      <br />$color-green-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--success\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--success\n      <br />$color-success\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--success-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--success-light\n      <br />$color-success-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--success-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--success-lighter\n      <br />$color-success-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--success-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--success-lightest\n      <br />$color-success-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error\n      <br />$color-error\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-dark\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-dark\n      <br />$color-error-dark\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-darkest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-darkest\n      <br />$color-error-darkest\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-light\n      <br />$color-error-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-lighter\n      <br />$color-error-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-lightest\n      <br />$color-error-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--base\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--base\n      <br />$color-base\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--background\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--background\n      <br />$color-background\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--background-inverse\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--background-inverse\n      <br />$color-background-inverse\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--white\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--white\n      <br />$color-white\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--transparent\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--transparent\n      \n    </code>\n  </article>\n</div>\n","source":{"filename":"utilities/background-color.scss","path":"packages/core/src/utilities/background-color.scss"},"depth":2,"modifiers":[],"sections":[],"hideMarkup":true,"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/border-radius/index.html b/docs/utilities/border-radius/index.html
index 12d8f8c921..b46c8228a3 100644
--- a/docs/utilities/border-radius/index.html
+++ b/docs/utilities/border-radius/index.html
@@ -2,14 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Border radius - CMSgov Design System</title>
+  <title>Border radius - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="828942408"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.border-radius" data-reactid="12">Border radius</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/border-radius.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>Apply rounded corners to an element with the border radius utility.</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="2123127788"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.border-radius" data-reactid="10">Border radius</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/border-radius.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>Apply rounded corners to an element with the border radius utility.</p>
 <h4 id="available-border-radius-options-">Available <code>border-radius</code> options:</h4>
 <ul>
 <li><code>ds-u-radius</code> Applies the default <code>$border-radius</code> (3px)</li>
@@ -20,15 +20,15 @@ <h2 id="theming">Theming</h2>
 <p>The following Sass variables can be overridden to theme the border radius utility:</p>
 <ul>
 <li><code>$border-radius</code></li>
-</ul></div><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20"><p class="ds-u-radius ds-u-fill--green-lighter">Round</p>
+</ul></div><section class="ds-u-margin-top--3" data-reactid="16"><div class="markup markup--html" data-reactid="17"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="18"><p class="ds-u-radius ds-u-fill--green-lighter">Round</p>
 <p class="ds-u-radius--pill ds-u-fill--green-lighter">Pill</p>
-<p class="ds-u-radius--circle ds-u-fill--green-lighter ds-u-padding--3 ds-u-display--inline-block"></p></div><details class="ds-u-margin-bottom--2" data-reactid="21"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="22">Code snippet</summary><pre class="language-markup" data-reactid="23"><code data-reactid="24"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-radius ds-u-fill--green-lighter<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Round<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
+<p class="ds-u-radius--circle ds-u-fill--green-lighter ds-u-padding--3 ds-u-display--inline-block"></p></div><details class="ds-u-margin-bottom--2" data-reactid="19"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="20">Code snippet</summary><pre class="language-markup" data-reactid="21"><code data-reactid="22"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-radius ds-u-fill--green-lighter<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Round<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-radius--pill ds-u-fill--green-lighter<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Pill<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-radius--circle ds-u-fill--green-lighter ds-u-padding--3 ds-u-display--inline-block<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
     var page = {"header":"Border radius","description":"<p>Apply rounded corners to an element with the border radius utility.</p>\n<h4 id=\"available-border-radius-options-\">Available <code>border-radius</code> options:</h4>\n<ul>\n<li><code>ds-u-radius</code> Applies the default <code>$border-radius</code> (3px)</li>\n<li><code>ds-u-radius--pill</code></li>\n<li><code>ds-u-radius--circle</code> Can make a circle when combined with a fixed height and width.</li>\n</ul>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme the border radius utility:</p>\n<ul>\n<li><code>$border-radius</code></li>\n</ul>","reference":"utilities.border-radius","referenceNumber":"2.3","referenceURI":"design-system/utilities/border-radius","weight":0,"markup":"<p class=\"ds-u-radius ds-u-fill--green-lighter\">Round</p>\n<p class=\"ds-u-radius--pill ds-u-fill--green-lighter\">Pill</p>\n<p class=\"ds-u-radius--circle ds-u-fill--green-lighter ds-u-padding--3 ds-u-display--inline-block\"></p>","source":{"filename":"utilities/border-radius.scss","path":"packages/core/src/utilities/border-radius.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/border/index.html b/docs/utilities/border/index.html
index aa57155ce8..b243f625fd 100644
--- a/docs/utilities/border/index.html
+++ b/docs/utilities/border/index.html
@@ -2,14 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Border - CMSgov Design System</title>
+  <title>Border - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="72604884"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.border" data-reactid="12">Border</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/border.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><h4 id="border-size-">Border size:</h4>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-576876425"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.border" data-reactid="10">Border</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/border.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><h4 id="border-size-">Border size:</h4>
 <p>Choose between a border size of <code>0</code>, <code>1px</code> or <code>2px</code>.</p>
 <p><strong>Format</strong>: <code>ds-u-border-[x|y|bottom|left|right|top]--[SIZE]</code></p>
 <h4 id="border-color-">Border color:</h4>
@@ -19,7 +19,7 @@ <h2 id="theming">Theming</h2>
 <ul>
 <li><code>$border-color</code></li>
 <li><code>$border-color-inverse</code></li>
-</ul></div><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20">
+</ul></div><section class="ds-u-margin-top--3" data-reactid="16"><div class="markup markup--html" data-reactid="17"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="18">
 <div class="ds-u-border--0 ds-u-margin-y--1 ds-u-padding--1">
   <code class="ds-u-fill--background">ds-u-border--0</code>
 </div>
@@ -158,7 +158,7 @@ <h1 class="ds-u-font-size--lead ds-u-margin-y--2">Color</h1>
   </div>
   <script type="text/javascript">
     var page = {"header":"Border","description":"<h4 id=\"border-size-\">Border size:</h4>\n<p>Choose between a border size of <code>0</code>, <code>1px</code> or <code>2px</code>.</p>\n<p><strong>Format</strong>: <code>ds-u-border-[x|y|bottom|left|right|top]--[SIZE]</code></p>\n<h4 id=\"border-color-\">Border color:</h4>\n<p><strong>Format</strong>: <code>ds-u-border--[COLOR NAME]</code></p>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme the border utility:</p>\n<ul>\n<li><code>$border-color</code></li>\n<li><code>$border-color-inverse</code></li>\n</ul>","reference":"utilities.border","referenceNumber":"2.2","referenceURI":"design-system/utilities/border","weight":0,"markup":"\n<div class=\"ds-u-border--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border--0</code>\n</div>\n\n<div class=\"ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border--1</code>\n</div>\n\n<div class=\"ds-u-border--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border--2</code>\n</div>\n\n<div class=\"ds-u-border-x--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-x--0</code>\n</div>\n\n<div class=\"ds-u-border-x--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-x--1</code>\n</div>\n\n<div class=\"ds-u-border-x--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-x--2</code>\n</div>\n\n<div class=\"ds-u-border-y--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-y--0</code>\n</div>\n\n<div class=\"ds-u-border-y--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-y--1</code>\n</div>\n\n<div class=\"ds-u-border-y--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-y--2</code>\n</div>\n\n<div class=\"ds-u-border-bottom--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-bottom--0</code>\n</div>\n\n<div class=\"ds-u-border-bottom--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-bottom--1</code>\n</div>\n\n<div class=\"ds-u-border-bottom--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-bottom--2</code>\n</div>\n\n<div class=\"ds-u-border-left--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-left--0</code>\n</div>\n\n<div class=\"ds-u-border-left--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-left--1</code>\n</div>\n\n<div class=\"ds-u-border-left--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-left--2</code>\n</div>\n\n<div class=\"ds-u-border-right--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-right--0</code>\n</div>\n\n<div class=\"ds-u-border-right--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-right--1</code>\n</div>\n\n<div class=\"ds-u-border-right--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-right--2</code>\n</div>\n\n<div class=\"ds-u-border-top--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-top--0</code>\n</div>\n\n<div class=\"ds-u-border-top--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-top--1</code>\n</div>\n\n<div class=\"ds-u-border-top--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-top--2</code>\n</div>\n<h1 class=\"ds-u-font-size--lead ds-u-margin-y--2\">Color</h1>\n<div class=\"ds-u-fill--primary-darkest ds-u-padding--1\">\n  <div class=\"ds-u-border--inverse ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--inverse</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--error ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--error</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--error-light ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--error-light</code>\n  </div>\n</div>\n<div class=\"ds-u-fill--primary-darkest ds-u-padding--1\">\n  <div class=\"ds-u-border--error-lighter ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--error-lighter</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--warn ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--warn</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--warn-light ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--warn-light</code>\n  </div>\n</div>\n<div class=\"ds-u-fill--primary-darkest ds-u-padding--1\">\n  <div class=\"ds-u-border--warn-lighter ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--warn-lighter</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--success ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--success</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--success-light ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--success-light</code>\n  </div>\n</div>\n<div class=\"ds-u-fill--primary-darkest ds-u-padding--1\">\n  <div class=\"ds-u-border--success-lighter ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--success-lighter</code>\n  </div>\n</div>\n","source":{"filename":"utilities/border.scss","path":"packages/core/src/utilities/border.scss"},"depth":2,"modifiers":[],"sections":[],"hideMarkup":true,"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/clearfix/index.html b/docs/utilities/clearfix/index.html
index bbdbb4ad61..094d5cad30 100644
--- a/docs/utilities/clearfix/index.html
+++ b/docs/utilities/clearfix/index.html
@@ -2,19 +2,19 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Clearfix - CMSgov Design System</title>
+  <title>Clearfix - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1935398537"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.clearfix" data-reactid="12">Clearfix</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/overflow.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>The clearfix utility can be applied to an element to clear floats around the element.</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1010857431"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.clearfix" data-reactid="10">Clearfix</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/overflow.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>The clearfix utility can be applied to an element to clear floats around the element.</p>
 <p><strong>Format</strong>: <code>ds-u-clearfix</code></p></div></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
     var page = {"header":"Clearfix","description":"<p>The clearfix utility can be applied to an element to clear floats around the element.</p>\n<p><strong>Format</strong>: <code>ds-u-clearfix</code></p>","reference":"utilities.clearfix","referenceNumber":"2.4","referenceURI":"design-system/utilities/clearfix","weight":0,"markup":"","source":{"filename":"utilities/overflow.scss","path":"packages/core/src/utilities/overflow.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/color/index.html b/docs/utilities/color/index.html
index 36c138aa87..9fd44a8158 100644
--- a/docs/utilities/color/index.html
+++ b/docs/utilities/color/index.html
@@ -2,17 +2,17 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Color - CMSgov Design System</title>
+  <title>Color - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-750615317"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.color" data-reactid="12">Color</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/color.scss</code></heading><div data-reactid="15"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="16"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="17">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="18">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="19"><article class="ds-u-margin-y--6 l-content" data-reactid="20"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="21"><p>Use the color utility to change an element&#39;s text color.</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1111541623"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.color" data-reactid="10">Color</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/color.scss</code></heading><div data-reactid="13"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="14"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="15">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="16">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="17"><article class="ds-u-margin-y--6 l-content" data-reactid="18"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="19"><p>Use the color utility to change an element&#39;s text color.</p>
 <p><strong>Format</strong>: <code>ds-u-color--[COLOR NAME]-[SHADE]</code></p>
 <h2 id="theming">Theming</h2>
-<p>See the <a href="/utilities/background-color#theming">Background color</a> utility&#39;s theming instructions to learn how to override color values.</p></div><section class="ds-u-margin-top--3" data-reactid="22"><div class="markup markup--html" data-reactid="23"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="24">  <article class="ds-u-margin-bottom--2">
+<p>See the <a href="/utilities/background-color#theming">Background color</a> utility&#39;s theming instructions to learn how to override color values.</p></div><section class="ds-u-margin-top--3" data-reactid="20"><div class="markup markup--html" data-reactid="21"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="22">  <article class="ds-u-margin-bottom--2">
     <p class="ds-u-color--base ds-u-fill--white">
       <code class="ds-u-fill--transparent ds-u-color--base">.ds-u-color--base</code>
       on <code class="ds-u-fill--transparent ds-u-color--base">.ds-u-fill--white</code>
@@ -306,13 +306,13 @@ <h2 id="theming">Theming</h2>
       on <code class="ds-u-fill--transparent ds-u-color--base">.ds-u-fill--error-lightest</code>
     </p>
   </article>
-</div></div></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="25"><article class="ds-u-margin-y--6 l-content" data-reactid="26"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="27"><h2 id="accessibility">Accessibility</h2>
+</div></div></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="23"><article class="ds-u-margin-y--6 l-content" data-reactid="24"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="25"><h2 id="accessibility">Accessibility</h2>
 <p>WCAG (Web Content Accessibility Guidelines) ensure that content is accessible by everyone, regardless of disability or user device. To meet these standards, text and interactive elements should have a color contrast ratio of <a href="http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html">at least 4.5:1</a>. This ensures that viewers who cannot see the full color spectrum are able to read the text.</p>
 <p>The options below offer color palette combinations that fall within the range of Section 508 compliant foreground/background color contrast ratios. To ensure that text remains accessible, <strong>use only these permitted color combinations</strong>.</p></div></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
     var page = {"header":"Color","description":"<p>Use the color utility to change an element&#39;s text color.</p>\n<p><strong>Format</strong>: <code>ds-u-color--[COLOR NAME]-[SHADE]</code></p>\n<h2 id=\"theming\">Theming</h2>\n<p>See the <a href=\"/utilities/background-color#theming\">Background color</a> utility&#39;s theming instructions to learn how to override color values.</p>","reference":"utilities.color","referenceNumber":"2.5","referenceURI":"design-system/utilities/color","weight":0,"markup":"  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--muted ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--muted\">.ds-u-color--muted</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--muted\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--black ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--black\">.ds-u-color--black</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--black\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--primary ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--primary\">.ds-u-color--primary</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--primary\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--primary-darker ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--primary-darker\">.ds-u-color--primary-darker</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--primary-darker\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--primary-darkest ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--primary-darkest\">.ds-u-color--primary-darkest</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--primary-darkest\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--gray ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--gray\">.ds-u-color--gray</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--gray\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--error ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--error\">.ds-u-color--error</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--error\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--error-dark ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--error-dark\">.ds-u-color--error-dark</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--error-dark\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--success ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--success\">.ds-u-color--success</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--success\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base-inverse ds-u-fill--background-inverse\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base-inverse\">.ds-u-color--base-inverse</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base-inverse\">.ds-u-fill--background-inverse</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--muted-inverse ds-u-fill--background-inverse\">\n      <code class=\"ds-u-fill--transparent ds-u-color--muted-inverse\">.ds-u-color--muted-inverse</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--muted-inverse\">.ds-u-fill--background-inverse</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--error-light ds-u-fill--background-inverse\">\n      <code class=\"ds-u-fill--transparent ds-u-color--error-light\">.ds-u-color--error-light</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--error-light\">.ds-u-fill--background-inverse</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--base\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--base</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--gray-dark\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--gray-dark</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--gray\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--gray</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--primary-darkest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--primary-darkest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--primary-darker\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--primary-darker</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--primary\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--primary</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--primary-alt-darkest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--primary-alt-darkest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--primary-alt-dark\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--primary-alt-dark</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--primary-alt\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--primary-alt</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--green\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--green</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--success\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--success</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--green-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--green-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--success-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--success-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gold\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gold</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--warn\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--warn</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gold-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gold-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--warn-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--warn-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--secondary-darkest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--secondary-darkest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--error-darkest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--error-darkest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--secondary-dark\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--secondary-dark</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--error-dark\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--error-dark</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--secondary\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--secondary</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--error\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--error</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gray-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gray-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gray-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gray-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--primary-alt-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--primary-alt-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--green-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--green-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--success-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--success-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--green-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--green-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--success-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--success-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gold-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gold-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--warn-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--warn-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gold-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gold-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--warn-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--warn-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--secondary-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--secondary-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--error-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--error-lightest</code>\n    </p>\n  </article>\n","source":{"filename":"utilities/color.scss","path":"packages/core/src/utilities/color.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<p>WCAG (Web Content Accessibility Guidelines) ensure that content is accessible by everyone, regardless of disability or user device. To meet these standards, text and interactive elements should have a color contrast ratio of <a href=\"http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html\">at least 4.5:1</a>. This ensures that viewers who cannot see the full color spectrum are able to read the text.</p>\n<p>The options below offer color palette combinations that fall within the range of Section 508 compliant foreground/background color contrast ratios. To ensure that text remains accessible, <strong>use only these permitted color combinations</strong>.</p>","reference":"utilities.color.guidance","referenceNumber":"2.5.1","referenceURI":"design-system/utilities/color/guidance","weight":0,"markup":"","source":{"filename":"utilities/color.scss","path":"packages/core/src/utilities/color.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.color"}],"hideMarkup":true,"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/visibility/index.html b/docs/utilities/display-visibility/index.html
similarity index 56%
rename from docs/utilities/visibility/index.html
rename to docs/utilities/display-visibility/index.html
index e2f99d2b09..99936aa328 100644
--- a/docs/utilities/visibility/index.html
+++ b/docs/utilities/display-visibility/index.html
@@ -2,15 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Visibility - CMSgov Design System</title>
+  <title>Display/Visibility - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1013703247"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.visibility" data-reactid="12">Visibility</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/display-visibility.scss</code></heading><div data-reactid="15"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="16"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="17">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="18"><article class="ds-u-margin-y--6 l-content" data-reactid="19"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="20"><p>Use the <code>display</code> and <code>visibility</code> utility classes to show and hide elements.</p></div></article><article class="ds-u-margin-y--6 l-content" data-reactid="21"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="22"><h2 id="display">Display</h2>
-<blockquote>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="369767497"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.display-visibility" data-reactid="10">Display/Visibility</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/display-visibility.scss</code></heading><div data-reactid="13"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="14"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="15">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="16"><article class="ds-u-margin-y--6 l-content" data-reactid="17"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="18"><p>Use the <code>display</code> and <code>visibility</code> utility classes to show and hide elements.</p></div></article><article class="ds-u-margin-y--6 l-content" data-reactid="19"><div data-reactid="20"><h2 class="ds-h2" id="utilities.display-visibility.display" data-reactid="21">Display</h2></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="22"><blockquote>
 <p>The display CSS property specifies the type of rendering box used for an element. In HTML, default display property values are taken from behaviors described in the HTML specifications or from the browser/user default stylesheet. &mdash; <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/display">MDN</a></p>
 </blockquote>
 <p><strong>Format</strong>: <code>ds-u-display--[VALUE]</code></p>
@@ -23,8 +22,7 @@ <h4 id="available-display-options-">Available <code>display</code> options:</h4>
 <span class="ds-u-display--inline-block">I'm displayed as <code>inline-block</code></span>
 <span class="ds-u-display--none">I'm hidden</span></div><details class="ds-u-margin-bottom--2" data-reactid="26"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="27">Code snippet</summary><pre class="language-markup" data-reactid="28"><code data-reactid="29"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-display--block<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>I'm displayed as <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>code</span><span class="token punctuation">></span></span>block<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>code</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-display--inline-block<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>I'm displayed as <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>code</span><span class="token punctuation">></span></span>inline-block<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>code</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-display--none<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>I'm hidden<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="30"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="31"><h2 id="visibility">Visibility</h2>
-<blockquote>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-display--none<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>I'm hidden<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="30"><div data-reactid="31"><h2 class="ds-h2" id="utilities.display-visibility.visibility" data-reactid="32">Visibility</h2></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="33"><blockquote>
 <p>The visibility property can be used to hide an element while leaving the space where it would have been. &mdash; <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/visibility">MDN</a></p>
 </blockquote>
 <p><strong>Format</strong>: <code>ds-u-visibility--[VALUE]</code></p>
@@ -35,14 +33,13 @@ <h4 id="available-visibility-options-">Available <code>visibility</code> options
 <li><code>ds-u-visibility--screen-reader</code></li>
 </ul>
 <h4 id="accessibility">Accessibility</h4>
-<p>There may sometimes be a situation where you want to hide an element, but still want its text to be read by a screen reader. The <code>ds-u-visibility--screen-reader</code> class will hide the content visually, but provide the content to screen readers.</p></div><section class="ds-u-margin-top--3" data-reactid="32"><div class="markup markup--html" data-reactid="33"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="34"><span class="ds-u-visibility--hidden">I'm hidden</span>
+<p>There may sometimes be a situation where you want to hide an element, but still want its text to be read by a screen reader. The <code>ds-u-visibility--screen-reader</code> class will hide the content visually, but provide the content to screen readers.</p></div><section class="ds-u-margin-top--3" data-reactid="34"><div class="markup markup--html" data-reactid="35"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="36"><span class="ds-u-visibility--hidden">I'm hidden</span>
 <span class="ds-u-visibility--screen-reader">I'm visible to screen readers only</span>
-<span class="ds-u-visibility--visible">I'm visible</span></div><details class="ds-u-margin-bottom--2" data-reactid="35"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="36">Code snippet</summary><pre class="language-markup" data-reactid="37"><code data-reactid="38"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-visibility--hidden<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>I'm hidden<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
+<span class="ds-u-visibility--visible">I'm visible</span></div><details class="ds-u-margin-bottom--2" data-reactid="37"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="38">Code snippet</summary><pre class="language-markup" data-reactid="39"><code data-reactid="40"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-visibility--hidden<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>I'm hidden<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-visibility--screen-reader<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>I'm visible to screen readers only<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-visibility--visible<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>I'm visible<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="39"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="40"><h2 id="responsive">Responsive</h2>
-<p>Use a <a href="/responsive">responsive prefix</a> to show/hide content at specific breakpoints.</p>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-visibility--visible<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>I'm visible<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="41"><div data-reactid="42"><h2 class="ds-h2" id="utilities.display-visibility.responsive" data-reactid="43">Responsive</h2></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="44"><p>Use a <a href="/responsive">responsive prefix</a> to show/hide content at specific breakpoints.</p>
 <p>A responsive prefix is supported on all of the utility classes mentioned above, except for <code>ds-u-visibility--screen-reader</code>.</p>
-<p><em>Resize your browser to see each breakpoint in action:</em></p></div><section class="ds-u-margin-top--3" data-reactid="41"><div class="markup markup--html" data-reactid="42"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="43">
+<p><em>Resize your browser to see each breakpoint in action:</em></p></div><section class="ds-u-margin-top--3" data-reactid="45"><div class="markup markup--html" data-reactid="46"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="47">
   <div class="ds-u-sm-display--none ds-u-color--muted">
     Hidden on sm screens and larger
   </div>
@@ -94,7 +91,7 @@ <h4 id="accessibility">Accessibility</h4>
   <div class="ds-u-xl-visibility--visible">
     Visible on xl screens and larger
   </div>
-</div><details class="ds-u-margin-bottom--2" data-reactid="44"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="45">Code snippet</summary><pre class="language-markup" data-reactid="46"><code data-reactid="47">
+</div><details class="ds-u-margin-bottom--2" data-reactid="48"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="49">Code snippet</summary><pre class="language-markup" data-reactid="50"><code data-reactid="51">
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-sm-display--none ds-u-color--muted<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     Hidden on sm screens and larger
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
@@ -149,8 +146,8 @@ <h4 id="accessibility">Accessibility</h4>
 </code></pre></details></div></section></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Visibility","description":"<p>Use the <code>display</code> and <code>visibility</code> utility classes to show and hide elements.</p>","reference":"utilities.visibility","referenceNumber":"2.21","referenceURI":"design-system/utilities/visibility","weight":0,"markup":"","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"display\">Display</h2>\n<blockquote>\n<p>The display CSS property specifies the type of rendering box used for an element. In HTML, default display property values are taken from behaviors described in the HTML specifications or from the browser/user default stylesheet. &mdash; <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/display\">MDN</a></p>\n</blockquote>\n<p><strong>Format</strong>: <code>ds-u-display--[VALUE]</code></p>\n<h4 id=\"available-display-options-\">Available <code>display</code> options:</h4>\n<ul>\n<li><code>ds-u-display--block</code></li>\n<li><code>ds-u-display--inline-block</code></li>\n<li><code>ds-u-display--none</code></li>\n</ul>","reference":"utilities.visibility.display","referenceNumber":"2.21.1","referenceURI":"design-system/utilities/visibility/display","weight":0,"markup":"<span class=\"ds-u-display--block\">I'm displayed as <code>block</code></span>\n<span class=\"ds-u-display--inline-block\">I'm displayed as <code>inline-block</code></span>\n<span class=\"ds-u-display--none\">I'm hidden</span>","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.visibility"},{"header":"---","description":"<h2 id=\"visibility\">Visibility</h2>\n<blockquote>\n<p>The visibility property can be used to hide an element while leaving the space where it would have been. &mdash; <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/visibility\">MDN</a></p>\n</blockquote>\n<p><strong>Format</strong>: <code>ds-u-visibility--[VALUE]</code></p>\n<h4 id=\"available-visibility-options-\">Available <code>visibility</code> options:</h4>\n<ul>\n<li><code>ds-u-visibility--hidden</code></li>\n<li><code>ds-u-visibility--visible</code></li>\n<li><code>ds-u-visibility--screen-reader</code></li>\n</ul>\n<h4 id=\"accessibility\">Accessibility</h4>\n<p>There may sometimes be a situation where you want to hide an element, but still want its text to be read by a screen reader. The <code>ds-u-visibility--screen-reader</code> class will hide the content visually, but provide the content to screen readers.</p>","reference":"utilities.visibility.visibility","referenceNumber":"2.21.3","referenceURI":"design-system/utilities/visibility/visibility","weight":0,"markup":"<span class=\"ds-u-visibility--hidden\">I'm hidden</span>\n<span class=\"ds-u-visibility--screen-reader\">I'm visible to screen readers only</span>\n<span class=\"ds-u-visibility--visible\">I'm visible</span>","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.visibility"},{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Use a <a href=\"/responsive\">responsive prefix</a> to show/hide content at specific breakpoints.</p>\n<p>A responsive prefix is supported on all of the utility classes mentioned above, except for <code>ds-u-visibility--screen-reader</code>.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.visibility.responsive","referenceNumber":"2.21.2","referenceURI":"design-system/utilities/visibility/responsive","weight":0,"markup":"\n  <div class=\"ds-u-sm-display--none ds-u-color--muted\">\n    Hidden on sm screens and larger\n  </div>\n  <div class=\"ds-u-sm-display--block\">\n    Displayed as block on sm screens and larger\n  </div>\n  <div class=\"ds-u-sm-visibility--hidden ds-u-color--muted\">\n    Invisible on sm screens and larger\n  </div>\n  <div class=\"ds-u-sm-visibility--visible\">\n    Visible on sm screens and larger\n  </div>\n\n  <div class=\"ds-u-md-display--none ds-u-color--muted\">\n    Hidden on md screens and larger\n  </div>\n  <div class=\"ds-u-md-display--block\">\n    Displayed as block on md screens and larger\n  </div>\n  <div class=\"ds-u-md-visibility--hidden ds-u-color--muted\">\n    Invisible on md screens and larger\n  </div>\n  <div class=\"ds-u-md-visibility--visible\">\n    Visible on md screens and larger\n  </div>\n\n  <div class=\"ds-u-lg-display--none ds-u-color--muted\">\n    Hidden on lg screens and larger\n  </div>\n  <div class=\"ds-u-lg-display--block\">\n    Displayed as block on lg screens and larger\n  </div>\n  <div class=\"ds-u-lg-visibility--hidden ds-u-color--muted\">\n    Invisible on lg screens and larger\n  </div>\n  <div class=\"ds-u-lg-visibility--visible\">\n    Visible on lg screens and larger\n  </div>\n\n  <div class=\"ds-u-xl-display--none ds-u-color--muted\">\n    Hidden on xl screens and larger\n  </div>\n  <div class=\"ds-u-xl-display--block\">\n    Displayed as block on xl screens and larger\n  </div>\n  <div class=\"ds-u-xl-visibility--hidden ds-u-color--muted\">\n    Invisible on xl screens and larger\n  </div>\n  <div class=\"ds-u-xl-visibility--visible\">\n    Visible on xl screens and larger\n  </div>\n","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.visibility"}],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Display/Visibility","description":"<p>Use the <code>display</code> and <code>visibility</code> utility classes to show and hide elements.</p>","reference":"utilities.display-visibility","referenceNumber":"2.6","referenceURI":"design-system/utilities/display-visibility","weight":0,"markup":"","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Display","description":"<blockquote>\n<p>The display CSS property specifies the type of rendering box used for an element. In HTML, default display property values are taken from behaviors described in the HTML specifications or from the browser/user default stylesheet. &mdash; <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/display\">MDN</a></p>\n</blockquote>\n<p><strong>Format</strong>: <code>ds-u-display--[VALUE]</code></p>\n<h4 id=\"available-display-options-\">Available <code>display</code> options:</h4>\n<ul>\n<li><code>ds-u-display--block</code></li>\n<li><code>ds-u-display--inline-block</code></li>\n<li><code>ds-u-display--none</code></li>\n</ul>","reference":"utilities.display-visibility.display","referenceNumber":"2.6.1","referenceURI":"design-system/utilities/display-visibility/display","weight":0,"markup":"<span class=\"ds-u-display--block\">I'm displayed as <code>block</code></span>\n<span class=\"ds-u-display--inline-block\">I'm displayed as <code>inline-block</code></span>\n<span class=\"ds-u-display--none\">I'm hidden</span>","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.display-visibility"},{"header":"Visibility","description":"<blockquote>\n<p>The visibility property can be used to hide an element while leaving the space where it would have been. &mdash; <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/visibility\">MDN</a></p>\n</blockquote>\n<p><strong>Format</strong>: <code>ds-u-visibility--[VALUE]</code></p>\n<h4 id=\"available-visibility-options-\">Available <code>visibility</code> options:</h4>\n<ul>\n<li><code>ds-u-visibility--hidden</code></li>\n<li><code>ds-u-visibility--visible</code></li>\n<li><code>ds-u-visibility--screen-reader</code></li>\n</ul>\n<h4 id=\"accessibility\">Accessibility</h4>\n<p>There may sometimes be a situation where you want to hide an element, but still want its text to be read by a screen reader. The <code>ds-u-visibility--screen-reader</code> class will hide the content visually, but provide the content to screen readers.</p>","reference":"utilities.display-visibility.visibility","referenceNumber":"2.6.3","referenceURI":"design-system/utilities/display-visibility/visibility","weight":0,"markup":"<span class=\"ds-u-visibility--hidden\">I'm hidden</span>\n<span class=\"ds-u-visibility--screen-reader\">I'm visible to screen readers only</span>\n<span class=\"ds-u-visibility--visible\">I'm visible</span>","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.display-visibility"},{"header":"Responsive","description":"<p>Use a <a href=\"/responsive\">responsive prefix</a> to show/hide content at specific breakpoints.</p>\n<p>A responsive prefix is supported on all of the utility classes mentioned above, except for <code>ds-u-visibility--screen-reader</code>.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.display-visibility.responsive","referenceNumber":"2.6.2","referenceURI":"design-system/utilities/display-visibility/responsive","weight":0,"markup":"\n  <div class=\"ds-u-sm-display--none ds-u-color--muted\">\n    Hidden on sm screens and larger\n  </div>\n  <div class=\"ds-u-sm-display--block\">\n    Displayed as block on sm screens and larger\n  </div>\n  <div class=\"ds-u-sm-visibility--hidden ds-u-color--muted\">\n    Invisible on sm screens and larger\n  </div>\n  <div class=\"ds-u-sm-visibility--visible\">\n    Visible on sm screens and larger\n  </div>\n\n  <div class=\"ds-u-md-display--none ds-u-color--muted\">\n    Hidden on md screens and larger\n  </div>\n  <div class=\"ds-u-md-display--block\">\n    Displayed as block on md screens and larger\n  </div>\n  <div class=\"ds-u-md-visibility--hidden ds-u-color--muted\">\n    Invisible on md screens and larger\n  </div>\n  <div class=\"ds-u-md-visibility--visible\">\n    Visible on md screens and larger\n  </div>\n\n  <div class=\"ds-u-lg-display--none ds-u-color--muted\">\n    Hidden on lg screens and larger\n  </div>\n  <div class=\"ds-u-lg-display--block\">\n    Displayed as block on lg screens and larger\n  </div>\n  <div class=\"ds-u-lg-visibility--hidden ds-u-color--muted\">\n    Invisible on lg screens and larger\n  </div>\n  <div class=\"ds-u-lg-visibility--visible\">\n    Visible on lg screens and larger\n  </div>\n\n  <div class=\"ds-u-xl-display--none ds-u-color--muted\">\n    Hidden on xl screens and larger\n  </div>\n  <div class=\"ds-u-xl-display--block\">\n    Displayed as block on xl screens and larger\n  </div>\n  <div class=\"ds-u-xl-visibility--hidden ds-u-color--muted\">\n    Invisible on xl screens and larger\n  </div>\n  <div class=\"ds-u-xl-visibility--visible\">\n    Visible on xl screens and larger\n  </div>\n","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.display-visibility"}],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/float/index.html b/docs/utilities/float/index.html
index 0c8d603482..156dc6fcdc 100644
--- a/docs/utilities/float/index.html
+++ b/docs/utilities/float/index.html
@@ -2,15 +2,15 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Float - CMSgov Design System</title>
+  <title>Float - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1302281612"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.float" data-reactid="12">Float</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/float.scss</code></heading><div data-reactid="15"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="16"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="17">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="18"><article class="ds-u-margin-y--6 l-content" data-reactid="19"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="20"><p>Set an element&#39;s <code>float</code> property using the float utility. You can use the <code>ds-u-clearfix</code> utility class to clearfix your floats.</p>
-<p><strong>Format</strong>: <code>ds-u-float--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="21"><div class="markup markup--html" data-reactid="22"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="23"><div class="ds-u-clearfix">
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1400999853"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.float" data-reactid="10">Float</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/float.scss</code></heading><div data-reactid="13"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="14"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="15">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="16"><article class="ds-u-margin-y--6 l-content" data-reactid="17"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="18"><p>Set an element&#39;s <code>float</code> property using the float utility. You can use the <code>ds-u-clearfix</code> utility class to clearfix your floats.</p>
+<p><strong>Format</strong>: <code>ds-u-float--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="19"><div class="markup markup--html" data-reactid="20"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="21"><div class="ds-u-clearfix">
   <div class="ds-u-float--left ds-u-fill--gray-lightest">
     <code>float: left</code>
   </div>
@@ -24,7 +24,7 @@
   <div class="ds-u-float--none ds-u-fill--gray-lightest">
     <code>float: none</code>
   </div>
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="24"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="25">Code snippet</summary><pre class="language-markup" data-reactid="26"><code data-reactid="27"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-clearfix<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="22"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="23">Code snippet</summary><pre class="language-markup" data-reactid="24"><code data-reactid="25"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-clearfix<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-float--left ds-u-fill--gray-lightest<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>code</span><span class="token punctuation">></span></span>float: left<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>code</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
@@ -38,8 +38,7 @@
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-float--none ds-u-fill--gray-lightest<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>code</span><span class="token punctuation">></span></span>float: none<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>code</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="28"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="29"><h2 id="responsive">Responsive</h2>
-<p>Use a <a href="/responsive">responsive prefix</a> to change how an element is floated at specific breakpoints.</p>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="26"><div data-reactid="27"><h2 class="ds-h2" id="utilities.float.responsive" data-reactid="28">Responsive</h2></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="29"><p>Use a <a href="/responsive">responsive prefix</a> to change how an element is floated at specific breakpoints.</p>
 <p><em>Resize your browser to see each breakpoint in action:</em></p></div><section class="ds-u-margin-top--3" data-reactid="30"><div class="markup markup--html" data-reactid="31"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="32"><div class="ds-u-clearfix">
   :)
   <div class="ds-u-float--none ds-u-md-float--left ds-u-lg-float--right">
@@ -69,8 +68,8 @@
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Float","description":"<p>Set an element&#39;s <code>float</code> property using the float utility. You can use the <code>ds-u-clearfix</code> utility class to clearfix your floats.</p>\n<p><strong>Format</strong>: <code>ds-u-float--[VALUE]</code></p>","reference":"utilities.float","referenceNumber":"2.6","referenceURI":"design-system/utilities/float","weight":0,"markup":"<div class=\"ds-u-clearfix\">\n  <div class=\"ds-u-float--left ds-u-fill--gray-lightest\">\n    <code>float: left</code>\n  </div>\n</div>\n<div class=\"ds-u-clearfix\">\n  <div class=\"ds-u-float--right ds-u-fill--gray-lightest\">\n    <code>float: right</code>\n  </div>\n</div>\n<div class=\"ds-u-clearfix\">\n  <div class=\"ds-u-float--none ds-u-fill--gray-lightest\">\n    <code>float: none</code>\n  </div>\n</div>","source":{"filename":"utilities/float.scss","path":"packages/core/src/utilities/float.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Use a <a href=\"/responsive\">responsive prefix</a> to change how an element is floated at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.float.responsive","referenceNumber":"2.6.1","referenceURI":"design-system/utilities/float/responsive","weight":0,"markup":"<div class=\"ds-u-clearfix\">\n  :)\n  <div class=\"ds-u-float--none ds-u-md-float--left ds-u-lg-float--right\">\n    <code class=\"ds-u-md-display--none\">\n      float: none\n    </code>\n    <code class=\"ds-u-display--none ds-u-md-display--inline-block ds-u-lg-display--none\">\n      float: left\n    </code>\n    <code class=\"ds-u-display--none ds-u-lg-display--inline-block\">\n      float: right\n    </code>\n  </div>\n</div>","source":{"filename":"utilities/float.scss","path":"packages/core/src/utilities/float.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.float"}],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Float","description":"<p>Set an element&#39;s <code>float</code> property using the float utility. You can use the <code>ds-u-clearfix</code> utility class to clearfix your floats.</p>\n<p><strong>Format</strong>: <code>ds-u-float--[VALUE]</code></p>","reference":"utilities.float","referenceNumber":"2.7","referenceURI":"design-system/utilities/float","weight":0,"markup":"<div class=\"ds-u-clearfix\">\n  <div class=\"ds-u-float--left ds-u-fill--gray-lightest\">\n    <code>float: left</code>\n  </div>\n</div>\n<div class=\"ds-u-clearfix\">\n  <div class=\"ds-u-float--right ds-u-fill--gray-lightest\">\n    <code>float: right</code>\n  </div>\n</div>\n<div class=\"ds-u-clearfix\">\n  <div class=\"ds-u-float--none ds-u-fill--gray-lightest\">\n    <code>float: none</code>\n  </div>\n</div>","source":{"filename":"utilities/float.scss","path":"packages/core/src/utilities/float.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Responsive","description":"<p>Use a <a href=\"/responsive\">responsive prefix</a> to change how an element is floated at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.float.responsive","referenceNumber":"2.7.1","referenceURI":"design-system/utilities/float/responsive","weight":0,"markup":"<div class=\"ds-u-clearfix\">\n  :)\n  <div class=\"ds-u-float--none ds-u-md-float--left ds-u-lg-float--right\">\n    <code class=\"ds-u-md-display--none\">\n      float: none\n    </code>\n    <code class=\"ds-u-display--none ds-u-md-display--inline-block ds-u-lg-display--none\">\n      float: left\n    </code>\n    <code class=\"ds-u-display--none ds-u-lg-display--inline-block\">\n      float: right\n    </code>\n  </div>\n</div>","source":{"filename":"utilities/float.scss","path":"packages/core/src/utilities/float.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.float"}],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/font-family/index.html b/docs/utilities/font-family/index.html
index fb33f54022..36468e58e6 100644
--- a/docs/utilities/font-family/index.html
+++ b/docs/utilities/font-family/index.html
@@ -2,27 +2,27 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Font familiy - CMSgov Design System</title>
+  <title>Font familiy - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="673343344"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.font-family" data-reactid="12">Font familiy</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/font-family.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>Change an element&#39;s typeface to either the sans-serif (Open Sans) or serif (Bitter) family using the font family utility.</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="308747028"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.font-family" data-reactid="10">Font familiy</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/font-family.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>Change an element&#39;s typeface to either the sans-serif (Open Sans) or serif (Bitter) family using the font family utility.</p>
 <p><strong>Format</strong>: <code>ds-u-[serif|sans]</code></p>
 <h2 id="theming">Theming</h2>
 <p>The following Sass variables can be overridden to theme the font family utility:</p>
 <ul>
 <li><code>$font-sans</code></li>
 <li><code>$font-serif</code></li>
-</ul></div><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20"><p class="ds-u-serif">Bitter, Georgia, serif</p>
-<p class="ds-u-sans">Open Sans, Helvetica, sans-serif</p></div><details class="ds-u-margin-bottom--2" data-reactid="21"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="22">Code snippet</summary><pre class="language-markup" data-reactid="23"><code data-reactid="24"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-serif<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Bitter, Georgia, serif<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
+</ul></div><section class="ds-u-margin-top--3" data-reactid="16"><div class="markup markup--html" data-reactid="17"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="18"><p class="ds-u-serif">Bitter, Georgia, serif</p>
+<p class="ds-u-sans">Open Sans, Helvetica, sans-serif</p></div><details class="ds-u-margin-bottom--2" data-reactid="19"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="20">Code snippet</summary><pre class="language-markup" data-reactid="21"><code data-reactid="22"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-serif<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Bitter, Georgia, serif<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-sans<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Open Sans, Helvetica, sans-serif<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Font familiy","description":"<p>Change an element&#39;s typeface to either the sans-serif (Open Sans) or serif (Bitter) family using the font family utility.</p>\n<p><strong>Format</strong>: <code>ds-u-[serif|sans]</code></p>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme the font family utility:</p>\n<ul>\n<li><code>$font-sans</code></li>\n<li><code>$font-serif</code></li>\n</ul>","reference":"utilities.font-family","referenceNumber":"2.7","referenceURI":"design-system/utilities/font-family","weight":0,"markup":"<p class=\"ds-u-serif\">Bitter, Georgia, serif</p>\n<p class=\"ds-u-sans\">Open Sans, Helvetica, sans-serif</p>","source":{"filename":"utilities/font-family.scss","path":"packages/core/src/utilities/font-family.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Font familiy","description":"<p>Change an element&#39;s typeface to either the sans-serif (Open Sans) or serif (Bitter) family using the font family utility.</p>\n<p><strong>Format</strong>: <code>ds-u-[serif|sans]</code></p>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme the font family utility:</p>\n<ul>\n<li><code>$font-sans</code></li>\n<li><code>$font-serif</code></li>\n</ul>","reference":"utilities.font-family","referenceNumber":"2.8","referenceURI":"design-system/utilities/font-family","weight":0,"markup":"<p class=\"ds-u-serif\">Bitter, Georgia, serif</p>\n<p class=\"ds-u-sans\">Open Sans, Helvetica, sans-serif</p>","source":{"filename":"utilities/font-family.scss","path":"packages/core/src/utilities/font-family.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/font-size/index.html b/docs/utilities/font-size/index.html
index b679f6711f..ef0018aea1 100644
--- a/docs/utilities/font-size/index.html
+++ b/docs/utilities/font-size/index.html
@@ -2,15 +2,15 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Font size - CMSgov Design System</title>
+  <title>Font size - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-781238992"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.font-size" data-reactid="12">Font size</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/font-size.scss</code></heading><div data-reactid="15"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="16"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="17">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="18"><article class="ds-u-margin-y--6 l-content" data-reactid="19"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="20"><p>Use the font size utility to make the text larger or smaller.</p>
-<p><strong>Format</strong>: <code>ds-u-font-size--[SIZE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="21"><div class="markup markup--html" data-reactid="22"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="23"><p class="ds-u-font-size--display ds-u-leading--heading ds-u-margin--0 ds-u-truncate">We the People of the United States</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1373631502"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.font-size" data-reactid="10">Font size</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/font-size.scss</code></heading><div data-reactid="13"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="14"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="15">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="16"><article class="ds-u-margin-y--6 l-content" data-reactid="17"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="18"><p>Use the font size utility to make the text larger or smaller.</p>
+<p><strong>Format</strong>: <code>ds-u-font-size--[SIZE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="19"><div class="markup markup--html" data-reactid="20"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="21"><p class="ds-u-font-size--display ds-u-leading--heading ds-u-margin--0 ds-u-truncate">We the People of the United States</p>
 <p class="ds-u-font-size--title ds-u-leading--heading ds-u-margin--0 ds-u-truncate">We the People of the United States</p>
 <p class="ds-u-font-size--h1 ds-u-leading--heading ds-u-margin--0 ds-u-truncate">We the People of the United States</p>
 <p class="ds-u-font-size--h2 ds-u-leading--heading ds-u-margin--0 ds-u-truncate">We the People of the United States</p>
@@ -19,7 +19,7 @@
 <p class="ds-u-font-size--lead ds-u-leading--heading ds-u-margin--0 ds-u-truncate">We the People of the United States</p>
 <p class="ds-u-font-size--base ds-u-leading--heading ds-u-margin--0 ds-u-truncate">We the People of the United States</p>
 <p class="ds-u-font-size--small ds-u-leading--heading ds-u-margin--0 ds-u-truncate">We the People of the United States</p>
-</div><details class="ds-u-margin-bottom--2" data-reactid="24"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="25">Code snippet</summary><pre class="language-markup" data-reactid="26"><code data-reactid="27"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-size--display ds-u-leading--heading ds-u-margin--0 ds-u-truncate<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
+</div><details class="ds-u-margin-bottom--2" data-reactid="22"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="23">Code snippet</summary><pre class="language-markup" data-reactid="24"><code data-reactid="25"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-size--display ds-u-leading--heading ds-u-margin--0 ds-u-truncate<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-size--title ds-u-leading--heading ds-u-margin--0 ds-u-truncate<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-size--h1 ds-u-leading--heading ds-u-margin--0 ds-u-truncate<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-size--h2 ds-u-leading--heading ds-u-margin--0 ds-u-truncate<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
@@ -28,8 +28,7 @@
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-size--lead ds-u-leading--heading ds-u-margin--0 ds-u-truncate<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-size--base ds-u-leading--heading ds-u-margin--0 ds-u-truncate<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-size--small ds-u-leading--heading ds-u-margin--0 ds-u-truncate<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
-</code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="28"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="29"><h2 id="responsive">Responsive</h2>
-<p>Use a <a href="/responsive">responsive prefix</a> to change the font size at specific breakpoints.</p>
+</code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="26"><div data-reactid="27"><h2 class="ds-h2" id="utilities.font-size.responsive" data-reactid="28">Responsive</h2></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="29"><p>Use a <a href="/responsive">responsive prefix</a> to change the font size at specific breakpoints.</p>
 <p><em>Resize your browser to see each breakpoint in action:</em></p></div><section class="ds-u-margin-top--3" data-reactid="30"><div class="markup markup--html" data-reactid="31"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="32"><div class="ds-u-font-size--base ds-u-sm-font-size--h4 ds-u-md-font-size--h3 ds-u-lg-font-size--h2 ds-u-xl-font-size--h1">
  We the People of the United States, in Order to form a more perfect Union
 </div></div><details class="ds-u-margin-bottom--2" data-reactid="33"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="34">Code snippet</summary><pre class="language-markup" data-reactid="35"><code data-reactid="36"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-size--base ds-u-sm-font-size--h4 ds-u-md-font-size--h3 ds-u-lg-font-size--h2 ds-u-xl-font-size--h1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
@@ -37,8 +36,8 @@
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Font size","description":"<p>Use the font size utility to make the text larger or smaller.</p>\n<p><strong>Format</strong>: <code>ds-u-font-size--[SIZE]</code></p>","reference":"utilities.font-size","referenceNumber":"2.8","referenceURI":"design-system/utilities/font-size","weight":0,"markup":"<p class=\"ds-u-font-size--display ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--title ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h1 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h2 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h3 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h4 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--lead ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--base ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--small ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n","source":{"filename":"utilities/font-size.scss","path":"packages/core/src/utilities/font-size.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the font size at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.font-size.responsive","referenceNumber":"2.8.1","referenceURI":"design-system/utilities/font-size/responsive","weight":0,"markup":"<div class=\"ds-u-font-size--base ds-u-sm-font-size--h4 ds-u-md-font-size--h3 ds-u-lg-font-size--h2 ds-u-xl-font-size--h1\">\n  {{ lorem-m }}\n</div>","source":{"filename":"utilities/font-size.scss","path":"packages/core/src/utilities/font-size.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.font-size"}],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Font size","description":"<p>Use the font size utility to make the text larger or smaller.</p>\n<p><strong>Format</strong>: <code>ds-u-font-size--[SIZE]</code></p>","reference":"utilities.font-size","referenceNumber":"2.9","referenceURI":"design-system/utilities/font-size","weight":0,"markup":"<p class=\"ds-u-font-size--display ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--title ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h1 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h2 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h3 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h4 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--lead ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--base ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--small ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n","source":{"filename":"utilities/font-size.scss","path":"packages/core/src/utilities/font-size.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Responsive","description":"<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the font size at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.font-size.responsive","referenceNumber":"2.9.1","referenceURI":"design-system/utilities/font-size/responsive","weight":0,"markup":"<div class=\"ds-u-font-size--base ds-u-sm-font-size--h4 ds-u-md-font-size--h3 ds-u-lg-font-size--h2 ds-u-xl-font-size--h1\">\n  {{ lorem-m }}\n</div>","source":{"filename":"utilities/font-size.scss","path":"packages/core/src/utilities/font-size.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.font-size"}],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/font-style/index.html b/docs/utilities/font-style/index.html
index 7e5a996c74..84299ae4de 100644
--- a/docs/utilities/font-style/index.html
+++ b/docs/utilities/font-style/index.html
@@ -2,21 +2,21 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Font style - CMSgov Design System</title>
+  <title>Font style - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-2107282319"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.font-style" data-reactid="12">Font style</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/font-style.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>Change an element&#39;s <code>font-style</code> property using the font style utility.</p>
-<p><strong>Format</strong>: <code>ds-u-font-style--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20"><p class="ds-u-font-style--normal">We the People of the United States, in Order to form a more perfect Union</p>
-<p class="ds-u-font-style--italic">We the People of the United States, in Order to form a more perfect Union</p></div><details class="ds-u-margin-bottom--2" data-reactid="21"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="22">Code snippet</summary><pre class="language-markup" data-reactid="23"><code data-reactid="24"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-style--normal<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1519968235"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.font-style" data-reactid="10">Font style</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/font-style.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>Change an element&#39;s <code>font-style</code> property using the font style utility.</p>
+<p><strong>Format</strong>: <code>ds-u-font-style--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="16"><div class="markup markup--html" data-reactid="17"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="18"><p class="ds-u-font-style--normal">We the People of the United States, in Order to form a more perfect Union</p>
+<p class="ds-u-font-style--italic">We the People of the United States, in Order to form a more perfect Union</p></div><details class="ds-u-margin-bottom--2" data-reactid="19"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="20">Code snippet</summary><pre class="language-markup" data-reactid="21"><code data-reactid="22"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-style--normal<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-style--italic<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Font style","description":"<p>Change an element&#39;s <code>font-style</code> property using the font style utility.</p>\n<p><strong>Format</strong>: <code>ds-u-font-style--[VALUE]</code></p>","reference":"utilities.font-style","referenceNumber":"2.9","referenceURI":"design-system/utilities/font-style","weight":0,"markup":"<p class=\"ds-u-font-style--normal\">{{ lorem-m }}</p>\n<p class=\"ds-u-font-style--italic\">{{ lorem-m }}</p>","source":{"filename":"utilities/font-style.scss","path":"packages/core/src/utilities/font-style.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Font style","description":"<p>Change an element&#39;s <code>font-style</code> property using the font style utility.</p>\n<p><strong>Format</strong>: <code>ds-u-font-style--[VALUE]</code></p>","reference":"utilities.font-style","referenceNumber":"2.10","referenceURI":"design-system/utilities/font-style","weight":0,"markup":"<p class=\"ds-u-font-style--normal\">{{ lorem-m }}</p>\n<p class=\"ds-u-font-style--italic\">{{ lorem-m }}</p>","source":{"filename":"utilities/font-style.scss","path":"packages/core/src/utilities/font-style.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/font-weight/index.html b/docs/utilities/font-weight/index.html
index 5a2b5e6129..621a65d1d9 100644
--- a/docs/utilities/font-weight/index.html
+++ b/docs/utilities/font-weight/index.html
@@ -2,23 +2,23 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Font weight - CMSgov Design System</title>
+  <title>Font weight - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1025301930"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.font-weight" data-reactid="12">Font weight</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/font-weight.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>Change an element&#39;s <code>font-weight</code> property using the font weight utility.</p>
-<p><strong>Format</strong>: <code>ds-u-font-weight--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20"><p class="ds-u-font-weight--normal">Normal</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1306685106"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.font-weight" data-reactid="10">Font weight</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/font-weight.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>Change an element&#39;s <code>font-weight</code> property using the font weight utility.</p>
+<p><strong>Format</strong>: <code>ds-u-font-weight--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="16"><div class="markup markup--html" data-reactid="17"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="18"><p class="ds-u-font-weight--normal">Normal</p>
 <p class="ds-u-font-weight--semibold">Semibold</p>
-<p class="ds-u-font-weight--bold">Bold</p></div><details class="ds-u-margin-bottom--2" data-reactid="21"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="22">Code snippet</summary><pre class="language-markup" data-reactid="23"><code data-reactid="24"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-weight--normal<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Normal<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
+<p class="ds-u-font-weight--bold">Bold</p></div><details class="ds-u-margin-bottom--2" data-reactid="19"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="20">Code snippet</summary><pre class="language-markup" data-reactid="21"><code data-reactid="22"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-weight--normal<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Normal<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-weight--semibold<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Semibold<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-weight--bold<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Bold<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Font weight","description":"<p>Change an element&#39;s <code>font-weight</code> property using the font weight utility.</p>\n<p><strong>Format</strong>: <code>ds-u-font-weight--[VALUE]</code></p>","reference":"utilities.font-weight","referenceNumber":"2.10","referenceURI":"design-system/utilities/font-weight","weight":0,"markup":"<p class=\"ds-u-font-weight--normal\">Normal</p>\n<p class=\"ds-u-font-weight--semibold\">Semibold</p>\n<p class=\"ds-u-font-weight--bold\">Bold</p>","source":{"filename":"utilities/font-weight.scss","path":"packages/core/src/utilities/font-weight.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Font weight","description":"<p>Change an element&#39;s <code>font-weight</code> property using the font weight utility.</p>\n<p><strong>Format</strong>: <code>ds-u-font-weight--[VALUE]</code></p>","reference":"utilities.font-weight","referenceNumber":"2.11","referenceURI":"design-system/utilities/font-weight","weight":0,"markup":"<p class=\"ds-u-font-weight--normal\">Normal</p>\n<p class=\"ds-u-font-weight--semibold\">Semibold</p>\n<p class=\"ds-u-font-weight--bold\">Bold</p>","source":{"filename":"utilities/font-weight.scss","path":"packages/core/src/utilities/font-weight.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/index.html b/docs/utilities/index.html
index c115f67507..154e6e9492 100644
--- a/docs/utilities/index.html
+++ b/docs/utilities/index.html
@@ -2,24 +2,24 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Utilities - CMSgov Design System</title>
+  <title>Utilities - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-546586751"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities" data-reactid="12">Utilities</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/index.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>A utility class modifies a single trait, typically a single CSS property. To apply a trait, or a combination of traits to an element, add the corresponding utility class directly to the HTML element.</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="352875301"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities" data-reactid="10">Utilities</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/index.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>A utility class modifies a single trait, typically a single CSS property. To apply a trait, or a combination of traits to an element, add the corresponding utility class directly to the HTML element.</p>
 <p>Together, they can form a variety of UI patterns. You won&#39;t always want to use combinations of utilities to generate more complicated patterns, but the option is there. Once you&#39;ve identified a set of traits that seem to be reused a lot, it&#39;s a good time to consider turning those into a component.</p>
-<p><strong>Format:</strong> <code>ds-u-[NAME]</code></p></div><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20"><div class="ds-u-fill--primary-alt ds-u-padding--3">
+<p><strong>Format:</strong> <code>ds-u-[NAME]</code></p></div><section class="ds-u-margin-top--3" data-reactid="16"><div class="markup markup--html" data-reactid="17"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="18"><div class="ds-u-fill--primary-alt ds-u-padding--3">
   <p class="ds-u-margin--0 ds-u-color--white ds-u-text-align--center">Hello world</p>
-</div></div><details class="ds-u-margin-bottom--2" data-reactid="21"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="22">Code snippet</summary><pre class="language-markup" data-reactid="23"><code data-reactid="24"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-fill--primary-alt ds-u-padding--3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
+</div></div><details class="ds-u-margin-bottom--2" data-reactid="19"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="20">Code snippet</summary><pre class="language-markup" data-reactid="21"><code data-reactid="22"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-fill--primary-alt ds-u-padding--3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-margin--0 ds-u-color--white ds-u-text-align--center<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Hello world<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Utilities","description":"<p>A utility class modifies a single trait, typically a single CSS property. To apply a trait, or a combination of traits to an element, add the corresponding utility class directly to the HTML element.</p>\n<p>Together, they can form a variety of UI patterns. You won&#39;t always want to use combinations of utilities to generate more complicated patterns, but the option is there. Once you&#39;ve identified a set of traits that seem to be reused a lot, it&#39;s a good time to consider turning those into a component.</p>\n<p><strong>Format:</strong> <code>ds-u-[NAME]</code></p>","reference":"utilities","referenceNumber":"2","referenceURI":"design-system/utilities","weight":20,"markup":"<div class=\"ds-u-fill--primary-alt ds-u-padding--3\">\n  <p class=\"ds-u-margin--0 ds-u-color--white ds-u-text-align--center\">Hello world</p>\n</div>","source":{"filename":"utilities/index.scss","path":"packages/core/src/utilities/index.scss"},"depth":1,"modifiers":[],"sections":[{"header":"Background color","description":"<p>Use the background color utility to change the default background color of an element. Each background color group may have a <code>dark</code>, <code>darker</code>, <code>darkest</code>, <code>light</code>, <code>lighter</code> and <code>lightest</code> shade modifier.</p>\n<p>Color groups include:</p>\n<ul>\n<li><strong>primary</strong> - The dominant brand color, used for things like links and call-to-actions</li>\n<li><strong>primary-alt</strong> - A variation of the dominant brand color</li>\n<li><strong>secondary</strong> - A secondary brand color that can be used for accents and call-to-action variations.</li>\n<li><strong>tertiary</strong> - Complementary accent colors</li>\n<li><strong>state</strong> - State indicator accents (success, warning, error)</li>\n</ul>\n<p><strong>Format</strong>: <code>ds-u-fill--[COLOR NAME]-[SHADE]</code></p>\n<h2 id=\"theming\">Theming</h2>\n<p>Each background (and text color) utility class utilizes a Sass color variable which can be overridden. The swatches below include the utility class name as well as the Sass variable name.</p>","reference":"utilities.background-color","referenceNumber":"2.1","referenceURI":"design-system/utilities/background-color","weight":0,"markup":"<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary\n      <br />$color-primary\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-darker\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-darker\n      <br />$color-primary-darker\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-darkest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-darkest\n      <br />$color-primary-darkest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt\n      <br />$color-primary-alt\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt-dark\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt-dark\n      <br />$color-primary-alt-dark\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt-darkest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt-darkest\n      <br />$color-primary-alt-darkest\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt-light\n      <br />$color-primary-alt-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt-lightest\n      <br />$color-primary-alt-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary\n      <br />$color-secondary\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary-dark\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary-dark\n      <br />$color-secondary-dark\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary-darkest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary-darkest\n      <br />$color-secondary-darkest\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary-light\n      <br />$color-secondary-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary-lightest\n      <br />$color-secondary-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray\n      <br />$color-gray\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray-dark\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray-dark\n      <br />$color-gray-dark\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray-light\n      <br />$color-gray-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray-lighter\n      <br />$color-gray-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray-lightest\n      <br />$color-gray-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gold\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gold\n      <br />$color-gold\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gold-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gold-light\n      <br />$color-gold-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gold-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gold-lighter\n      <br />$color-gold-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gold-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gold-lightest\n      <br />$color-gold-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--warn\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--warn\n      <br />$color-warn\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--warn-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--warn-light\n      <br />$color-warn-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--warn-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--warn-lighter\n      <br />$color-warn-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--warn-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--warn-lightest\n      <br />$color-warn-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--green\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--green\n      <br />$color-green\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--green-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--green-light\n      <br />$color-green-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--green-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--green-lighter\n      <br />$color-green-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--green-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--green-lightest\n      <br />$color-green-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--success\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--success\n      <br />$color-success\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--success-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--success-light\n      <br />$color-success-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--success-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--success-lighter\n      <br />$color-success-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--success-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--success-lightest\n      <br />$color-success-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error\n      <br />$color-error\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-dark\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-dark\n      <br />$color-error-dark\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-darkest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-darkest\n      <br />$color-error-darkest\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-light\n      <br />$color-error-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-lighter\n      <br />$color-error-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-lightest\n      <br />$color-error-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--base\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--base\n      <br />$color-base\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--background\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--background\n      <br />$color-background\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--background-inverse\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--background-inverse\n      <br />$color-background-inverse\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--white\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--white\n      <br />$color-white\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--transparent\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--transparent\n      \n    </code>\n  </article>\n</div>\n","source":{"filename":"utilities/background-color.scss","path":"packages/core/src/utilities/background-color.scss"},"depth":2,"modifiers":[],"sections":[],"hideMarkup":true,"parentReference":"utilities"},{"header":"Border","description":"<h4 id=\"border-size-\">Border size:</h4>\n<p>Choose between a border size of <code>0</code>, <code>1px</code> or <code>2px</code>.</p>\n<p><strong>Format</strong>: <code>ds-u-border-[x|y|bottom|left|right|top]--[SIZE]</code></p>\n<h4 id=\"border-color-\">Border color:</h4>\n<p><strong>Format</strong>: <code>ds-u-border--[COLOR NAME]</code></p>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme the border utility:</p>\n<ul>\n<li><code>$border-color</code></li>\n<li><code>$border-color-inverse</code></li>\n</ul>","reference":"utilities.border","referenceNumber":"2.2","referenceURI":"design-system/utilities/border","weight":0,"markup":"\n<div class=\"ds-u-border--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border--0</code>\n</div>\n\n<div class=\"ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border--1</code>\n</div>\n\n<div class=\"ds-u-border--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border--2</code>\n</div>\n\n<div class=\"ds-u-border-x--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-x--0</code>\n</div>\n\n<div class=\"ds-u-border-x--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-x--1</code>\n</div>\n\n<div class=\"ds-u-border-x--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-x--2</code>\n</div>\n\n<div class=\"ds-u-border-y--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-y--0</code>\n</div>\n\n<div class=\"ds-u-border-y--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-y--1</code>\n</div>\n\n<div class=\"ds-u-border-y--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-y--2</code>\n</div>\n\n<div class=\"ds-u-border-bottom--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-bottom--0</code>\n</div>\n\n<div class=\"ds-u-border-bottom--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-bottom--1</code>\n</div>\n\n<div class=\"ds-u-border-bottom--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-bottom--2</code>\n</div>\n\n<div class=\"ds-u-border-left--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-left--0</code>\n</div>\n\n<div class=\"ds-u-border-left--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-left--1</code>\n</div>\n\n<div class=\"ds-u-border-left--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-left--2</code>\n</div>\n\n<div class=\"ds-u-border-right--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-right--0</code>\n</div>\n\n<div class=\"ds-u-border-right--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-right--1</code>\n</div>\n\n<div class=\"ds-u-border-right--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-right--2</code>\n</div>\n\n<div class=\"ds-u-border-top--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-top--0</code>\n</div>\n\n<div class=\"ds-u-border-top--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-top--1</code>\n</div>\n\n<div class=\"ds-u-border-top--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-top--2</code>\n</div>\n<h1 class=\"ds-u-font-size--lead ds-u-margin-y--2\">Color</h1>\n<div class=\"ds-u-fill--primary-darkest ds-u-padding--1\">\n  <div class=\"ds-u-border--inverse ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--inverse</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--error ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--error</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--error-light ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--error-light</code>\n  </div>\n</div>\n<div class=\"ds-u-fill--primary-darkest ds-u-padding--1\">\n  <div class=\"ds-u-border--error-lighter ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--error-lighter</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--warn ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--warn</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--warn-light ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--warn-light</code>\n  </div>\n</div>\n<div class=\"ds-u-fill--primary-darkest ds-u-padding--1\">\n  <div class=\"ds-u-border--warn-lighter ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--warn-lighter</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--success ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--success</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--success-light ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--success-light</code>\n  </div>\n</div>\n<div class=\"ds-u-fill--primary-darkest ds-u-padding--1\">\n  <div class=\"ds-u-border--success-lighter ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--success-lighter</code>\n  </div>\n</div>\n","source":{"filename":"utilities/border.scss","path":"packages/core/src/utilities/border.scss"},"depth":2,"modifiers":[],"sections":[],"hideMarkup":true,"parentReference":"utilities"},{"header":"Border radius","description":"<p>Apply rounded corners to an element with the border radius utility.</p>\n<h4 id=\"available-border-radius-options-\">Available <code>border-radius</code> options:</h4>\n<ul>\n<li><code>ds-u-radius</code> Applies the default <code>$border-radius</code> (3px)</li>\n<li><code>ds-u-radius--pill</code></li>\n<li><code>ds-u-radius--circle</code> Can make a circle when combined with a fixed height and width.</li>\n</ul>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme the border radius utility:</p>\n<ul>\n<li><code>$border-radius</code></li>\n</ul>","reference":"utilities.border-radius","referenceNumber":"2.3","referenceURI":"design-system/utilities/border-radius","weight":0,"markup":"<p class=\"ds-u-radius ds-u-fill--green-lighter\">Round</p>\n<p class=\"ds-u-radius--pill ds-u-fill--green-lighter\">Pill</p>\n<p class=\"ds-u-radius--circle ds-u-fill--green-lighter ds-u-padding--3 ds-u-display--inline-block\"></p>","source":{"filename":"utilities/border-radius.scss","path":"packages/core/src/utilities/border-radius.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Clearfix","description":"<p>The clearfix utility can be applied to an element to clear floats around the element.</p>\n<p><strong>Format</strong>: <code>ds-u-clearfix</code></p>","reference":"utilities.clearfix","referenceNumber":"2.4","referenceURI":"design-system/utilities/clearfix","weight":0,"markup":"","source":{"filename":"utilities/overflow.scss","path":"packages/core/src/utilities/overflow.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Color","description":"<p>Use the color utility to change an element&#39;s text color.</p>\n<p><strong>Format</strong>: <code>ds-u-color--[COLOR NAME]-[SHADE]</code></p>\n<h2 id=\"theming\">Theming</h2>\n<p>See the <a href=\"/utilities/background-color#theming\">Background color</a> utility&#39;s theming instructions to learn how to override color values.</p>","reference":"utilities.color","referenceNumber":"2.5","referenceURI":"design-system/utilities/color","weight":0,"markup":"  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--muted ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--muted\">.ds-u-color--muted</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--muted\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--black ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--black\">.ds-u-color--black</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--black\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--primary ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--primary\">.ds-u-color--primary</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--primary\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--primary-darker ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--primary-darker\">.ds-u-color--primary-darker</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--primary-darker\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--primary-darkest ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--primary-darkest\">.ds-u-color--primary-darkest</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--primary-darkest\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--gray ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--gray\">.ds-u-color--gray</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--gray\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--error ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--error\">.ds-u-color--error</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--error\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--error-dark ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--error-dark\">.ds-u-color--error-dark</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--error-dark\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--success ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--success\">.ds-u-color--success</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--success\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base-inverse ds-u-fill--background-inverse\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base-inverse\">.ds-u-color--base-inverse</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base-inverse\">.ds-u-fill--background-inverse</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--muted-inverse ds-u-fill--background-inverse\">\n      <code class=\"ds-u-fill--transparent ds-u-color--muted-inverse\">.ds-u-color--muted-inverse</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--muted-inverse\">.ds-u-fill--background-inverse</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--error-light ds-u-fill--background-inverse\">\n      <code class=\"ds-u-fill--transparent ds-u-color--error-light\">.ds-u-color--error-light</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--error-light\">.ds-u-fill--background-inverse</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--base\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--base</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--gray-dark\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--gray-dark</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--gray\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--gray</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--primary-darkest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--primary-darkest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--primary-darker\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--primary-darker</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--primary\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--primary</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--primary-alt-darkest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--primary-alt-darkest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--primary-alt-dark\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--primary-alt-dark</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--primary-alt\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--primary-alt</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--green\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--green</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--success\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--success</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--green-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--green-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--success-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--success-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gold\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gold</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--warn\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--warn</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gold-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gold-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--warn-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--warn-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--secondary-darkest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--secondary-darkest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--error-darkest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--error-darkest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--secondary-dark\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--secondary-dark</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--error-dark\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--error-dark</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--secondary\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--secondary</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--error\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--error</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gray-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gray-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gray-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gray-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--primary-alt-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--primary-alt-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--green-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--green-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--success-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--success-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--green-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--green-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--success-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--success-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gold-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gold-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--warn-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--warn-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gold-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gold-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--warn-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--warn-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--secondary-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--secondary-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--error-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--error-lightest</code>\n    </p>\n  </article>\n","source":{"filename":"utilities/color.scss","path":"packages/core/src/utilities/color.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<p>WCAG (Web Content Accessibility Guidelines) ensure that content is accessible by everyone, regardless of disability or user device. To meet these standards, text and interactive elements should have a color contrast ratio of <a href=\"http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html\">at least 4.5:1</a>. This ensures that viewers who cannot see the full color spectrum are able to read the text.</p>\n<p>The options below offer color palette combinations that fall within the range of Section 508 compliant foreground/background color contrast ratios. To ensure that text remains accessible, <strong>use only these permitted color combinations</strong>.</p>","reference":"utilities.color.guidance","referenceNumber":"2.5.1","referenceURI":"design-system/utilities/color/guidance","weight":0,"markup":"","source":{"filename":"utilities/color.scss","path":"packages/core/src/utilities/color.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.color"}],"hideMarkup":true,"parentReference":"utilities"},{"header":"Float","description":"<p>Set an element&#39;s <code>float</code> property using the float utility. You can use the <code>ds-u-clearfix</code> utility class to clearfix your floats.</p>\n<p><strong>Format</strong>: <code>ds-u-float--[VALUE]</code></p>","reference":"utilities.float","referenceNumber":"2.6","referenceURI":"design-system/utilities/float","weight":0,"markup":"<div class=\"ds-u-clearfix\">\n  <div class=\"ds-u-float--left ds-u-fill--gray-lightest\">\n    <code>float: left</code>\n  </div>\n</div>\n<div class=\"ds-u-clearfix\">\n  <div class=\"ds-u-float--right ds-u-fill--gray-lightest\">\n    <code>float: right</code>\n  </div>\n</div>\n<div class=\"ds-u-clearfix\">\n  <div class=\"ds-u-float--none ds-u-fill--gray-lightest\">\n    <code>float: none</code>\n  </div>\n</div>","source":{"filename":"utilities/float.scss","path":"packages/core/src/utilities/float.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Use a <a href=\"/responsive\">responsive prefix</a> to change how an element is floated at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.float.responsive","referenceNumber":"2.6.1","referenceURI":"design-system/utilities/float/responsive","weight":0,"markup":"<div class=\"ds-u-clearfix\">\n  :)\n  <div class=\"ds-u-float--none ds-u-md-float--left ds-u-lg-float--right\">\n    <code class=\"ds-u-md-display--none\">\n      float: none\n    </code>\n    <code class=\"ds-u-display--none ds-u-md-display--inline-block ds-u-lg-display--none\">\n      float: left\n    </code>\n    <code class=\"ds-u-display--none ds-u-lg-display--inline-block\">\n      float: right\n    </code>\n  </div>\n</div>","source":{"filename":"utilities/float.scss","path":"packages/core/src/utilities/float.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.float"}],"parentReference":"utilities"},{"header":"Font familiy","description":"<p>Change an element&#39;s typeface to either the sans-serif (Open Sans) or serif (Bitter) family using the font family utility.</p>\n<p><strong>Format</strong>: <code>ds-u-[serif|sans]</code></p>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme the font family utility:</p>\n<ul>\n<li><code>$font-sans</code></li>\n<li><code>$font-serif</code></li>\n</ul>","reference":"utilities.font-family","referenceNumber":"2.7","referenceURI":"design-system/utilities/font-family","weight":0,"markup":"<p class=\"ds-u-serif\">Bitter, Georgia, serif</p>\n<p class=\"ds-u-sans\">Open Sans, Helvetica, sans-serif</p>","source":{"filename":"utilities/font-family.scss","path":"packages/core/src/utilities/font-family.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Font size","description":"<p>Use the font size utility to make the text larger or smaller.</p>\n<p><strong>Format</strong>: <code>ds-u-font-size--[SIZE]</code></p>","reference":"utilities.font-size","referenceNumber":"2.8","referenceURI":"design-system/utilities/font-size","weight":0,"markup":"<p class=\"ds-u-font-size--display ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--title ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h1 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h2 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h3 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h4 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--lead ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--base ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--small ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n","source":{"filename":"utilities/font-size.scss","path":"packages/core/src/utilities/font-size.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the font size at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.font-size.responsive","referenceNumber":"2.8.1","referenceURI":"design-system/utilities/font-size/responsive","weight":0,"markup":"<div class=\"ds-u-font-size--base ds-u-sm-font-size--h4 ds-u-md-font-size--h3 ds-u-lg-font-size--h2 ds-u-xl-font-size--h1\">\n  {{ lorem-m }}\n</div>","source":{"filename":"utilities/font-size.scss","path":"packages/core/src/utilities/font-size.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.font-size"}],"parentReference":"utilities"},{"header":"Font style","description":"<p>Change an element&#39;s <code>font-style</code> property using the font style utility.</p>\n<p><strong>Format</strong>: <code>ds-u-font-style--[VALUE]</code></p>","reference":"utilities.font-style","referenceNumber":"2.9","referenceURI":"design-system/utilities/font-style","weight":0,"markup":"<p class=\"ds-u-font-style--normal\">{{ lorem-m }}</p>\n<p class=\"ds-u-font-style--italic\">{{ lorem-m }}</p>","source":{"filename":"utilities/font-style.scss","path":"packages/core/src/utilities/font-style.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Font weight","description":"<p>Change an element&#39;s <code>font-weight</code> property using the font weight utility.</p>\n<p><strong>Format</strong>: <code>ds-u-font-weight--[VALUE]</code></p>","reference":"utilities.font-weight","referenceNumber":"2.10","referenceURI":"design-system/utilities/font-weight","weight":0,"markup":"<p class=\"ds-u-font-weight--normal\">Normal</p>\n<p class=\"ds-u-font-weight--semibold\">Semibold</p>\n<p class=\"ds-u-font-weight--bold\">Bold</p>","source":{"filename":"utilities/font-weight.scss","path":"packages/core/src/utilities/font-weight.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Line height","description":"<p>In CSS, the <code>line-height</code> property controls the leading (<code>led-ing</code>). Leading refers to the vertical distance from the baseline of one line to the baseline of the next.</p>\n<p><strong>Format</strong>: <code>ds-u-leading--[NAME]</code></p>","reference":"utilities.line-height","referenceNumber":"2.11","referenceURI":"design-system/utilities/line-height","weight":0,"markup":"<p class=\"ds-u-leading--heading ds-u-font-size--h1 ds-u-margin--0 ds-u-margin-bottom--2\">{{lorem-m}}</p>\n<p class=\"ds-u-leading--lead ds-u-font-size--lead ds-u-margin--0 ds-u-margin-bottom--2\">{{lorem-l}}</p>\n<p class=\"ds-u-leading--base ds-u-font-size--base ds-u-margin--0 ds-u-margin-bottom--2\">{{lorem-l}}</p>\n<p class=\"ds-u-leading--reset ds-u-margin--0\">{{lorem-s}}</p>","source":{"filename":"utilities/line-height.scss","path":"packages/core/src/utilities/line-height.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<blockquote>\n<p>Many people with cognitive disabilities have trouble tracking lines of text when a block of text is single spaced. Providing spacing between <code>1.5</code> to <code>2</code> allows them to start a new line more easily once they have finished the previous one. &mdash; <a href=\"https://www.w3.org/TR/WCAG20-TECHS/C21.html\">WCAG 2.0 Compliance Techniques</a></p>\n</blockquote>","reference":"utilities.line-height.guidance","referenceNumber":"2.11.1","referenceURI":"design-system/utilities/line-height/guidance","weight":0,"markup":"","source":{"filename":"utilities/line-height.scss","path":"packages/core/src/utilities/line-height.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.line-height"}],"parentReference":"utilities"},{"header":"Margin","description":"<p>Use the margin utility to change an element&#39;s margin. All margins are multiples of <code>8px</code> and can be inferred by the class name. For example, <code>ds-u-margin-top--3</code> can be understood as applying a <code>margin-top</code> of <code>24px</code> (<code>3 * 8px = 24px</code>).</p>\n<p><strong>Format</strong>: <code>ds-u-margin-[x|y|bottom|left|right|top]--[MULTIPLE]</code></p>","reference":"utilities.margin","referenceNumber":"2.12","referenceURI":"design-system/utilities/margin","weight":0,"markup":"\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-x--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-x--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-x--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-x--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-x--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-x--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-x--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-x--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-y--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-y--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-y--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-y--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-y--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-y--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-y--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-y--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-bottom--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-bottom--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-bottom--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-bottom--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-bottom--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-bottom--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-bottom--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-bottom--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-left--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-left--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-left--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-left--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-left--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-left--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-left--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-left--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-right--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-right--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-right--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-right--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-right--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-right--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-right--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-right--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-top--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-top--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-top--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-top--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-top--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-top--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-top--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-top--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--7</code>\n  </div>\n</div>\n","source":{"filename":"utilities/margin.scss","path":"packages/core/src/utilities/margin.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the margin at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.margin.responsive","referenceNumber":"2.12.1","referenceURI":"design-system/utilities/margin/responsive","weight":0,"markup":"<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin--1 ds-u-sm-margin--2 ds-u-md-margin--3 ds-u-lg-margin--4 ds-u-xl-margin--5 ds-u-display--inline-block\">\n    <span class=\"ds-u-fill--background\">Responsive margins</span>\n  </div>\n</div>","source":{"filename":"utilities/margin.scss","path":"packages/core/src/utilities/margin.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.margin"}],"hideMarkup":true,"parentReference":"utilities"},{"header":"Measure","description":"<p>Line length, also called &quot;measure&quot;, is an important part of readability.</p>\n<p>The design system includes 3 measure modifiers:</p>\n<ul>\n<li><strong>narrow</strong> = line length ~45 characters</li>\n<li><strong>base</strong> = line length ~65 characters</li>\n<li><strong>wide</strong> = line length ~80 characters</li>\n</ul>\n<p><strong>Format</strong>: <code>ds-u-measure--[NAME]</code></p>","reference":"utilities.measure","referenceNumber":"2.13","referenceURI":"design-system/utilities/measure","weight":0,"markup":"<p class=\"ds-u-measure--narrow\">{{ lorem-l }}</p>\n<p class=\"ds-u-measure--base ds-u-font-size--small\">{{ lorem-l }}</p>\n<p class=\"ds-u-measure--wide ds-u-font-size--small\">{{ lorem-l }}</p>","source":{"filename":"utilities/measure.scss","path":"packages/core/src/utilities/measure.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<blockquote>\n<p>A line of text shouldn’t be longer than 80 characters. This helps users with certain reading or visual disabilities that have trouble keeping their place when reading long lines of text. If the width of the text container is resized, it should be allowed to scale in a way so 80 characters or less are shown...Another way to ensure good line-length is to use a fluid layout or apply responsive web design techniques that allow the user to resize the window to find a comfortable line length. &mdash; <a href=\"https://www.w3.org/WAI/tutorials/page-structure/styling/#line-length\">W3C</a></p>\n</blockquote>","reference":"utilities.measure.guidance","referenceNumber":"2.13.1","referenceURI":"design-system/utilities/measure/guidance","weight":0,"markup":"","source":{"filename":"utilities/measure.scss","path":"packages/core/src/utilities/measure.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.measure"}],"parentReference":"utilities"},{"header":"Overflow","description":"<p>Use the overflow utility to set the <code>overflow</code> property of an element.</p>\n<blockquote>\n<p>The overflow property specifies whether to clip content, render scrollbars or just display content when it overflows its block level container. &mdash; <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/overflow\">MDN</a></p>\n</blockquote>\n<p><strong>Format</strong>: <code>ds-u-overflow--[VALUE]</code></p>\n<h4 id=\"available-overflow-options-\">Available <code>overflow</code> options:</h4>\n<ul>\n<li><code>ds-u-overflow--hidden</code></li>\n<li><code>ds-u-overflow--scroll</code></li>\n<li><code>ds-u-overflow--auto</code></li>\n</ul>","reference":"utilities.overflow","referenceNumber":"2.14","referenceURI":"design-system/utilities/overflow","weight":0,"markup":"","source":{"filename":"utilities/overflow.scss","path":"packages/core/src/utilities/overflow.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Padding","description":"<p>Use the padding utility to change an element&#39;s padding. All padding values are multiples of <code>8px</code> and can be inferred by the class name. For example, <code>ds-u-padding-top--3</code> can be understood as applying a <code>padding-top</code> of <code>24px</code> (<code>3 * 8px = 24px</code>).</p>\n<p><strong>Format</strong>: <code>ds-u-padding-[x|y|bottom|left|right|top]--[MULTIPLE]</code></p>","reference":"utilities.padding","referenceNumber":"2.15","referenceURI":"design-system/utilities/padding","weight":0,"markup":"\n<div class=\"ds-u-fill--gray-dark ds-u-padding--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--7</code>\n</div>\n","source":{"filename":"utilities/padding.scss","path":"packages/core/src/utilities/padding.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the padding at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.padding.responsive","referenceNumber":"2.15.1","referenceURI":"design-system/utilities/padding/responsive","weight":0,"markup":"<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-padding--1 ds-u-sm-padding--2 ds-u-md-padding--3 ds-u-lg-padding--4 ds-u-xl-padding--5 ds-u-display--inline-block\">\n    <span class=\"ds-u-color--white\">Responsive padding</span>\n  </div>\n</div>","source":{"filename":"utilities/padding.scss","path":"packages/core/src/utilities/padding.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.padding"}],"hideMarkup":true,"parentReference":"utilities"},{"header":"Text alignment","description":"<p>Align text using the <code>text-align</code> utility.</p>\n<p><strong>Format</strong>: <code>ds-u-text-align--[VALUE]</code></p>","reference":"utilities.text-align","referenceNumber":"2.16","referenceURI":"design-system/utilities/text-align","weight":0,"markup":"<p class=\"ds-u-text-align--center\">Center</p>\n<p class=\"ds-u-text-align--left\">Left</p>\n<p class=\"ds-u-text-align--right\">Right</p>","source":{"filename":"utilities/text-align.scss","path":"packages/core/src/utilities/text-align.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the text alignment at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.text-align.responsive","referenceNumber":"2.16.1","referenceURI":"design-system/utilities/text-align/responsive","weight":0,"markup":"<div class=\"ds-u-sm-text-align--center ds-u-md-text-align--left ds-u-lg-text-align--right\">\n  {{lorem-s}}\n</div>","source":{"filename":"utilities/text-align.scss","path":"packages/core/src/utilities/text-align.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.text-align"}],"parentReference":"utilities"},{"header":"Text decoration","description":"<p>Set whether text is underlined or not using the <code>text-decoration</code> utility.</p>\n<p><strong>Format</strong>: <code>ds-u-text-decoration--[VALUE]</code></p>","reference":"utilities.text-decoration","referenceNumber":"2.17","referenceURI":"design-system/utilities/text-decoration","weight":0,"markup":"<p class=\"ds-u-text-decoration--underline\">Underlined text</p>\n<a class=\"ds-u-text-decoration--none\" href=\"http://example.com\">Link text without underline</a>","source":{"filename":"utilities/text-decoration.scss","path":"packages/core/src/utilities/text-decoration.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Text transform","description":"<p>Set the capitalization of text using the text transform utility.</p>\n<p><strong>Format</strong>: <code>ds-u-text-transform--[VALUE]</code></p>","reference":"utilities.text-transform","referenceNumber":"2.18","referenceURI":"design-system/utilities/text-transform","weight":0,"markup":"<p class=\"ds-u-text-transform--uppercase\">uppercase transform</p>\n<p class=\"ds-u-text-transform--lowercase\">Lowercase transform</p>\n<p class=\"ds-u-text-transform--capitalize\">capitalized transform</p>","source":{"filename":"utilities/text-transform.scss","path":"packages/core/src/utilities/text-transform.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Truncate","description":"<p>Use the truncate utility to limit a text string to one line.</p>\n<h3 id=\"accessibility\">Accessibility</h3>\n<p>Place the full text in a <code>title</code> attribute so that it’s accessible on hover.</p>","reference":"utilities.truncate","referenceNumber":"2.19","referenceURI":"design-system/utilities/truncate","weight":0,"markup":"<p class=\"ds-u-truncate\" title=\"{{lorem-l}}\">{{lorem-l}}</p>","source":{"filename":"utilities/truncate.scss","path":"packages/core/src/utilities/truncate.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Vertical align","description":"<p>Use the vertical align utility on inline-level elements (<code>inline</code> and <code>inline-block</code>) and on table cells.</p>\n<p><strong>Format</strong>: <code>ds-u-valign--[VALUE]</code></p>","reference":"utilities.vertical-align","referenceNumber":"2.20","referenceURI":"design-system/utilities/vertical-align","weight":0,"markup":"<table>\n  <tbody>\n    <tr>\n      <td class=\"ds-u-font-size--title ds-u-leading--reset\">A</td>\n      <td class=\"ds-u-valign--top\">Top alignment</td>\n    </tr>\n    <tr>\n      <td class=\"ds-u-font-size--title ds-u-leading--reset\">B</td>\n      <td class=\"ds-u-valign--middle\">Middle alignment</td>\n    </tr>\n    <tr>\n      <td class=\"ds-u-font-size--title ds-u-leading--reset\">C</td>\n      <td class=\"ds-u-valign--bottom\">Bottom alignment</td>\n    </tr>\n  </tbody>\n</table>","source":{"filename":"utilities/vertical-align.scss","path":"packages/core/src/utilities/vertical-align.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Visibility","description":"<p>Use the <code>display</code> and <code>visibility</code> utility classes to show and hide elements.</p>","reference":"utilities.visibility","referenceNumber":"2.21","referenceURI":"design-system/utilities/visibility","weight":0,"markup":"","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"display\">Display</h2>\n<blockquote>\n<p>The display CSS property specifies the type of rendering box used for an element. In HTML, default display property values are taken from behaviors described in the HTML specifications or from the browser/user default stylesheet. &mdash; <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/display\">MDN</a></p>\n</blockquote>\n<p><strong>Format</strong>: <code>ds-u-display--[VALUE]</code></p>\n<h4 id=\"available-display-options-\">Available <code>display</code> options:</h4>\n<ul>\n<li><code>ds-u-display--block</code></li>\n<li><code>ds-u-display--inline-block</code></li>\n<li><code>ds-u-display--none</code></li>\n</ul>","reference":"utilities.visibility.display","referenceNumber":"2.21.1","referenceURI":"design-system/utilities/visibility/display","weight":0,"markup":"<span class=\"ds-u-display--block\">I'm displayed as <code>block</code></span>\n<span class=\"ds-u-display--inline-block\">I'm displayed as <code>inline-block</code></span>\n<span class=\"ds-u-display--none\">I'm hidden</span>","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.visibility"},{"header":"---","description":"<h2 id=\"visibility\">Visibility</h2>\n<blockquote>\n<p>The visibility property can be used to hide an element while leaving the space where it would have been. &mdash; <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/visibility\">MDN</a></p>\n</blockquote>\n<p><strong>Format</strong>: <code>ds-u-visibility--[VALUE]</code></p>\n<h4 id=\"available-visibility-options-\">Available <code>visibility</code> options:</h4>\n<ul>\n<li><code>ds-u-visibility--hidden</code></li>\n<li><code>ds-u-visibility--visible</code></li>\n<li><code>ds-u-visibility--screen-reader</code></li>\n</ul>\n<h4 id=\"accessibility\">Accessibility</h4>\n<p>There may sometimes be a situation where you want to hide an element, but still want its text to be read by a screen reader. The <code>ds-u-visibility--screen-reader</code> class will hide the content visually, but provide the content to screen readers.</p>","reference":"utilities.visibility.visibility","referenceNumber":"2.21.3","referenceURI":"design-system/utilities/visibility/visibility","weight":0,"markup":"<span class=\"ds-u-visibility--hidden\">I'm hidden</span>\n<span class=\"ds-u-visibility--screen-reader\">I'm visible to screen readers only</span>\n<span class=\"ds-u-visibility--visible\">I'm visible</span>","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.visibility"},{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Use a <a href=\"/responsive\">responsive prefix</a> to show/hide content at specific breakpoints.</p>\n<p>A responsive prefix is supported on all of the utility classes mentioned above, except for <code>ds-u-visibility--screen-reader</code>.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.visibility.responsive","referenceNumber":"2.21.2","referenceURI":"design-system/utilities/visibility/responsive","weight":0,"markup":"\n  <div class=\"ds-u-sm-display--none ds-u-color--muted\">\n    Hidden on sm screens and larger\n  </div>\n  <div class=\"ds-u-sm-display--block\">\n    Displayed as block on sm screens and larger\n  </div>\n  <div class=\"ds-u-sm-visibility--hidden ds-u-color--muted\">\n    Invisible on sm screens and larger\n  </div>\n  <div class=\"ds-u-sm-visibility--visible\">\n    Visible on sm screens and larger\n  </div>\n\n  <div class=\"ds-u-md-display--none ds-u-color--muted\">\n    Hidden on md screens and larger\n  </div>\n  <div class=\"ds-u-md-display--block\">\n    Displayed as block on md screens and larger\n  </div>\n  <div class=\"ds-u-md-visibility--hidden ds-u-color--muted\">\n    Invisible on md screens and larger\n  </div>\n  <div class=\"ds-u-md-visibility--visible\">\n    Visible on md screens and larger\n  </div>\n\n  <div class=\"ds-u-lg-display--none ds-u-color--muted\">\n    Hidden on lg screens and larger\n  </div>\n  <div class=\"ds-u-lg-display--block\">\n    Displayed as block on lg screens and larger\n  </div>\n  <div class=\"ds-u-lg-visibility--hidden ds-u-color--muted\">\n    Invisible on lg screens and larger\n  </div>\n  <div class=\"ds-u-lg-visibility--visible\">\n    Visible on lg screens and larger\n  </div>\n\n  <div class=\"ds-u-xl-display--none ds-u-color--muted\">\n    Hidden on xl screens and larger\n  </div>\n  <div class=\"ds-u-xl-display--block\">\n    Displayed as block on xl screens and larger\n  </div>\n  <div class=\"ds-u-xl-visibility--hidden ds-u-color--muted\">\n    Invisible on xl screens and larger\n  </div>\n  <div class=\"ds-u-xl-visibility--visible\">\n    Visible on xl screens and larger\n  </div>\n","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.visibility"}],"parentReference":"utilities"}],"parentReference":null};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Utilities","description":"<p>A utility class modifies a single trait, typically a single CSS property. To apply a trait, or a combination of traits to an element, add the corresponding utility class directly to the HTML element.</p>\n<p>Together, they can form a variety of UI patterns. You won&#39;t always want to use combinations of utilities to generate more complicated patterns, but the option is there. Once you&#39;ve identified a set of traits that seem to be reused a lot, it&#39;s a good time to consider turning those into a component.</p>\n<p><strong>Format:</strong> <code>ds-u-[NAME]</code></p>","reference":"utilities","referenceNumber":"2","referenceURI":"design-system/utilities","weight":20,"markup":"<div class=\"ds-u-fill--primary-alt ds-u-padding--3\">\n  <p class=\"ds-u-margin--0 ds-u-color--white ds-u-text-align--center\">Hello world</p>\n</div>","source":{"filename":"utilities/index.scss","path":"packages/core/src/utilities/index.scss"},"depth":1,"modifiers":[],"sections":[{"header":"Background color","description":"<p>Use the background color utility to change the default background color of an element. Each background color group may have a <code>dark</code>, <code>darker</code>, <code>darkest</code>, <code>light</code>, <code>lighter</code> and <code>lightest</code> shade modifier.</p>\n<p>Color groups include:</p>\n<ul>\n<li><strong>primary</strong> - The dominant brand color, used for things like links and call-to-actions</li>\n<li><strong>primary-alt</strong> - A variation of the dominant brand color</li>\n<li><strong>secondary</strong> - A secondary brand color that can be used for accents and call-to-action variations.</li>\n<li><strong>tertiary</strong> - Complementary accent colors</li>\n<li><strong>state</strong> - State indicator accents (success, warning, error)</li>\n</ul>\n<p><strong>Format</strong>: <code>ds-u-fill--[COLOR NAME]-[SHADE]</code></p>\n<h2 id=\"theming\">Theming</h2>\n<p>Each background (and text color) utility class utilizes a Sass color variable which can be overridden. The swatches below include the utility class name as well as the Sass variable name.</p>","reference":"utilities.background-color","referenceNumber":"2.1","referenceURI":"design-system/utilities/background-color","weight":0,"markup":"<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary\n      <br />$color-primary\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-darker\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-darker\n      <br />$color-primary-darker\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-darkest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-darkest\n      <br />$color-primary-darkest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt\n      <br />$color-primary-alt\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt-dark\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt-dark\n      <br />$color-primary-alt-dark\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt-darkest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt-darkest\n      <br />$color-primary-alt-darkest\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt-light\n      <br />$color-primary-alt-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--primary-alt-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--primary-alt-lightest\n      <br />$color-primary-alt-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary\n      <br />$color-secondary\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary-dark\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary-dark\n      <br />$color-secondary-dark\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary-darkest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary-darkest\n      <br />$color-secondary-darkest\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary-light\n      <br />$color-secondary-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--secondary-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--secondary-lightest\n      <br />$color-secondary-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray\n      <br />$color-gray\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray-dark\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray-dark\n      <br />$color-gray-dark\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray-light\n      <br />$color-gray-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray-lighter\n      <br />$color-gray-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gray-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gray-lightest\n      <br />$color-gray-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gold\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gold\n      <br />$color-gold\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gold-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gold-light\n      <br />$color-gold-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gold-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gold-lighter\n      <br />$color-gold-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--gold-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--gold-lightest\n      <br />$color-gold-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--warn\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--warn\n      <br />$color-warn\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--warn-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--warn-light\n      <br />$color-warn-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--warn-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--warn-lighter\n      <br />$color-warn-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--warn-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--warn-lightest\n      <br />$color-warn-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--green\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--green\n      <br />$color-green\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--green-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--green-light\n      <br />$color-green-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--green-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--green-lighter\n      <br />$color-green-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--green-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--green-lightest\n      <br />$color-green-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--success\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--success\n      <br />$color-success\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--success-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--success-light\n      <br />$color-success-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--success-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--success-lighter\n      <br />$color-success-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--success-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--success-lightest\n      <br />$color-success-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error\n      <br />$color-error\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-dark\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-dark\n      <br />$color-error-dark\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-darkest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-darkest\n      <br />$color-error-darkest\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-light\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-light\n      <br />$color-error-light\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-lighter\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-lighter\n      <br />$color-error-lighter\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--error-lightest\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--error-lightest\n      <br />$color-error-lightest\n    </code>\n  </article>\n</div>\n<div class=\"d-u-margin-bottom-2 ds-u-clearfix\">\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--base\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--base\n      <br />$color-base\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--background\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--background\n      <br />$color-background\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--background-inverse\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--background-inverse\n      <br />$color-background-inverse\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--white\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--white\n      <br />$color-white\n    </code>\n  </article>\n  <article class=\"c-swatch ds-u-margin-bottom--2\">\n    <div class=\"c-swatch__preview ds-u-fill--transparent\"></div>\n    <code class=\"c-swatch__label ds-u-display--block ds-u-margin--0 ds-u-leading--lead\">\n      .ds-u-fill--transparent\n      \n    </code>\n  </article>\n</div>\n","source":{"filename":"utilities/background-color.scss","path":"packages/core/src/utilities/background-color.scss"},"depth":2,"modifiers":[],"sections":[],"hideMarkup":true,"parentReference":"utilities"},{"header":"Border","description":"<h4 id=\"border-size-\">Border size:</h4>\n<p>Choose between a border size of <code>0</code>, <code>1px</code> or <code>2px</code>.</p>\n<p><strong>Format</strong>: <code>ds-u-border-[x|y|bottom|left|right|top]--[SIZE]</code></p>\n<h4 id=\"border-color-\">Border color:</h4>\n<p><strong>Format</strong>: <code>ds-u-border--[COLOR NAME]</code></p>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme the border utility:</p>\n<ul>\n<li><code>$border-color</code></li>\n<li><code>$border-color-inverse</code></li>\n</ul>","reference":"utilities.border","referenceNumber":"2.2","referenceURI":"design-system/utilities/border","weight":0,"markup":"\n<div class=\"ds-u-border--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border--0</code>\n</div>\n\n<div class=\"ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border--1</code>\n</div>\n\n<div class=\"ds-u-border--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border--2</code>\n</div>\n\n<div class=\"ds-u-border-x--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-x--0</code>\n</div>\n\n<div class=\"ds-u-border-x--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-x--1</code>\n</div>\n\n<div class=\"ds-u-border-x--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-x--2</code>\n</div>\n\n<div class=\"ds-u-border-y--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-y--0</code>\n</div>\n\n<div class=\"ds-u-border-y--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-y--1</code>\n</div>\n\n<div class=\"ds-u-border-y--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-y--2</code>\n</div>\n\n<div class=\"ds-u-border-bottom--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-bottom--0</code>\n</div>\n\n<div class=\"ds-u-border-bottom--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-bottom--1</code>\n</div>\n\n<div class=\"ds-u-border-bottom--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-bottom--2</code>\n</div>\n\n<div class=\"ds-u-border-left--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-left--0</code>\n</div>\n\n<div class=\"ds-u-border-left--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-left--1</code>\n</div>\n\n<div class=\"ds-u-border-left--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-left--2</code>\n</div>\n\n<div class=\"ds-u-border-right--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-right--0</code>\n</div>\n\n<div class=\"ds-u-border-right--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-right--1</code>\n</div>\n\n<div class=\"ds-u-border-right--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-right--2</code>\n</div>\n\n<div class=\"ds-u-border-top--0 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-top--0</code>\n</div>\n\n<div class=\"ds-u-border-top--1 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-top--1</code>\n</div>\n\n<div class=\"ds-u-border-top--2 ds-u-margin-y--1 ds-u-padding--1\">\n  <code class=\"ds-u-fill--background\">ds-u-border-top--2</code>\n</div>\n<h1 class=\"ds-u-font-size--lead ds-u-margin-y--2\">Color</h1>\n<div class=\"ds-u-fill--primary-darkest ds-u-padding--1\">\n  <div class=\"ds-u-border--inverse ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--inverse</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--error ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--error</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--error-light ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--error-light</code>\n  </div>\n</div>\n<div class=\"ds-u-fill--primary-darkest ds-u-padding--1\">\n  <div class=\"ds-u-border--error-lighter ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--error-lighter</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--warn ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--warn</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--warn-light ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--warn-light</code>\n  </div>\n</div>\n<div class=\"ds-u-fill--primary-darkest ds-u-padding--1\">\n  <div class=\"ds-u-border--warn-lighter ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--warn-lighter</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--success ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--success</code>\n  </div>\n</div>\n<div >\n  <div class=\"ds-u-border--success-light ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--success-light</code>\n  </div>\n</div>\n<div class=\"ds-u-fill--primary-darkest ds-u-padding--1\">\n  <div class=\"ds-u-border--success-lighter ds-u-border--1 ds-u-margin-y--1 ds-u-padding--1\">\n    <code class=\"ds-u-fill--background\">ds-u-border--success-lighter</code>\n  </div>\n</div>\n","source":{"filename":"utilities/border.scss","path":"packages/core/src/utilities/border.scss"},"depth":2,"modifiers":[],"sections":[],"hideMarkup":true,"parentReference":"utilities"},{"header":"Border radius","description":"<p>Apply rounded corners to an element with the border radius utility.</p>\n<h4 id=\"available-border-radius-options-\">Available <code>border-radius</code> options:</h4>\n<ul>\n<li><code>ds-u-radius</code> Applies the default <code>$border-radius</code> (3px)</li>\n<li><code>ds-u-radius--pill</code></li>\n<li><code>ds-u-radius--circle</code> Can make a circle when combined with a fixed height and width.</li>\n</ul>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme the border radius utility:</p>\n<ul>\n<li><code>$border-radius</code></li>\n</ul>","reference":"utilities.border-radius","referenceNumber":"2.3","referenceURI":"design-system/utilities/border-radius","weight":0,"markup":"<p class=\"ds-u-radius ds-u-fill--green-lighter\">Round</p>\n<p class=\"ds-u-radius--pill ds-u-fill--green-lighter\">Pill</p>\n<p class=\"ds-u-radius--circle ds-u-fill--green-lighter ds-u-padding--3 ds-u-display--inline-block\"></p>","source":{"filename":"utilities/border-radius.scss","path":"packages/core/src/utilities/border-radius.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Clearfix","description":"<p>The clearfix utility can be applied to an element to clear floats around the element.</p>\n<p><strong>Format</strong>: <code>ds-u-clearfix</code></p>","reference":"utilities.clearfix","referenceNumber":"2.4","referenceURI":"design-system/utilities/clearfix","weight":0,"markup":"","source":{"filename":"utilities/overflow.scss","path":"packages/core/src/utilities/overflow.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Color","description":"<p>Use the color utility to change an element&#39;s text color.</p>\n<p><strong>Format</strong>: <code>ds-u-color--[COLOR NAME]-[SHADE]</code></p>\n<h2 id=\"theming\">Theming</h2>\n<p>See the <a href=\"/utilities/background-color#theming\">Background color</a> utility&#39;s theming instructions to learn how to override color values.</p>","reference":"utilities.color","referenceNumber":"2.5","referenceURI":"design-system/utilities/color","weight":0,"markup":"  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--muted ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--muted\">.ds-u-color--muted</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--muted\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--black ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--black\">.ds-u-color--black</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--black\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--primary ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--primary\">.ds-u-color--primary</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--primary\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--primary-darker ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--primary-darker\">.ds-u-color--primary-darker</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--primary-darker\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--primary-darkest ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--primary-darkest\">.ds-u-color--primary-darkest</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--primary-darkest\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--gray ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--gray\">.ds-u-color--gray</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--gray\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--error ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--error\">.ds-u-color--error</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--error\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--error-dark ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--error-dark\">.ds-u-color--error-dark</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--error-dark\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--success ds-u-fill--white\">\n      <code class=\"ds-u-fill--transparent ds-u-color--success\">.ds-u-color--success</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--success\">.ds-u-fill--white</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base-inverse ds-u-fill--background-inverse\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base-inverse\">.ds-u-color--base-inverse</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base-inverse\">.ds-u-fill--background-inverse</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--muted-inverse ds-u-fill--background-inverse\">\n      <code class=\"ds-u-fill--transparent ds-u-color--muted-inverse\">.ds-u-color--muted-inverse</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--muted-inverse\">.ds-u-fill--background-inverse</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--error-light ds-u-fill--background-inverse\">\n      <code class=\"ds-u-fill--transparent ds-u-color--error-light\">.ds-u-color--error-light</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--error-light\">.ds-u-fill--background-inverse</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--base\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--base</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--gray-dark\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--gray-dark</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--gray\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--gray</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--primary-darkest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--primary-darkest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--primary-darker\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--primary-darker</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--primary\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--primary</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--primary-alt-darkest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--primary-alt-darkest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--primary-alt-dark\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--primary-alt-dark</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--primary-alt\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--primary-alt</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--green\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--green</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--success\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--success</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--green-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--green-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--success-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--success-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gold\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gold</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--warn\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--warn</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gold-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gold-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--warn-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--warn-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--secondary-darkest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--secondary-darkest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--error-darkest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--error-darkest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--secondary-dark\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--secondary-dark</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--error-dark\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--error-dark</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--secondary\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--secondary</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--white ds-u-fill--error\">\n      <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-color--white</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--white\">.ds-u-fill--error</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gray-light\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gray-light</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gray-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gray-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--primary-alt-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--primary-alt-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--green-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--green-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--success-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--success-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--green-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--green-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--success-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--success-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gold-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gold-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--warn-lighter\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--warn-lighter</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--gold-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--gold-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--warn-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--warn-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--secondary-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--secondary-lightest</code>\n    </p>\n  </article>\n  <article class=\"ds-u-margin-bottom--2\">\n    <p class=\"ds-u-color--base ds-u-fill--error-lightest\">\n      <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-color--base</code>\n      on <code class=\"ds-u-fill--transparent ds-u-color--base\">.ds-u-fill--error-lightest</code>\n    </p>\n  </article>\n","source":{"filename":"utilities/color.scss","path":"packages/core/src/utilities/color.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<p>WCAG (Web Content Accessibility Guidelines) ensure that content is accessible by everyone, regardless of disability or user device. To meet these standards, text and interactive elements should have a color contrast ratio of <a href=\"http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html\">at least 4.5:1</a>. This ensures that viewers who cannot see the full color spectrum are able to read the text.</p>\n<p>The options below offer color palette combinations that fall within the range of Section 508 compliant foreground/background color contrast ratios. To ensure that text remains accessible, <strong>use only these permitted color combinations</strong>.</p>","reference":"utilities.color.guidance","referenceNumber":"2.5.1","referenceURI":"design-system/utilities/color/guidance","weight":0,"markup":"","source":{"filename":"utilities/color.scss","path":"packages/core/src/utilities/color.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.color"}],"hideMarkup":true,"parentReference":"utilities"},{"header":"Display/Visibility","description":"<p>Use the <code>display</code> and <code>visibility</code> utility classes to show and hide elements.</p>","reference":"utilities.display-visibility","referenceNumber":"2.6","referenceURI":"design-system/utilities/display-visibility","weight":0,"markup":"","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Display","description":"<blockquote>\n<p>The display CSS property specifies the type of rendering box used for an element. In HTML, default display property values are taken from behaviors described in the HTML specifications or from the browser/user default stylesheet. &mdash; <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/display\">MDN</a></p>\n</blockquote>\n<p><strong>Format</strong>: <code>ds-u-display--[VALUE]</code></p>\n<h4 id=\"available-display-options-\">Available <code>display</code> options:</h4>\n<ul>\n<li><code>ds-u-display--block</code></li>\n<li><code>ds-u-display--inline-block</code></li>\n<li><code>ds-u-display--none</code></li>\n</ul>","reference":"utilities.display-visibility.display","referenceNumber":"2.6.1","referenceURI":"design-system/utilities/display-visibility/display","weight":0,"markup":"<span class=\"ds-u-display--block\">I'm displayed as <code>block</code></span>\n<span class=\"ds-u-display--inline-block\">I'm displayed as <code>inline-block</code></span>\n<span class=\"ds-u-display--none\">I'm hidden</span>","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.display-visibility"},{"header":"Visibility","description":"<blockquote>\n<p>The visibility property can be used to hide an element while leaving the space where it would have been. &mdash; <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/visibility\">MDN</a></p>\n</blockquote>\n<p><strong>Format</strong>: <code>ds-u-visibility--[VALUE]</code></p>\n<h4 id=\"available-visibility-options-\">Available <code>visibility</code> options:</h4>\n<ul>\n<li><code>ds-u-visibility--hidden</code></li>\n<li><code>ds-u-visibility--visible</code></li>\n<li><code>ds-u-visibility--screen-reader</code></li>\n</ul>\n<h4 id=\"accessibility\">Accessibility</h4>\n<p>There may sometimes be a situation where you want to hide an element, but still want its text to be read by a screen reader. The <code>ds-u-visibility--screen-reader</code> class will hide the content visually, but provide the content to screen readers.</p>","reference":"utilities.display-visibility.visibility","referenceNumber":"2.6.3","referenceURI":"design-system/utilities/display-visibility/visibility","weight":0,"markup":"<span class=\"ds-u-visibility--hidden\">I'm hidden</span>\n<span class=\"ds-u-visibility--screen-reader\">I'm visible to screen readers only</span>\n<span class=\"ds-u-visibility--visible\">I'm visible</span>","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.display-visibility"},{"header":"Responsive","description":"<p>Use a <a href=\"/responsive\">responsive prefix</a> to show/hide content at specific breakpoints.</p>\n<p>A responsive prefix is supported on all of the utility classes mentioned above, except for <code>ds-u-visibility--screen-reader</code>.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.display-visibility.responsive","referenceNumber":"2.6.2","referenceURI":"design-system/utilities/display-visibility/responsive","weight":0,"markup":"\n  <div class=\"ds-u-sm-display--none ds-u-color--muted\">\n    Hidden on sm screens and larger\n  </div>\n  <div class=\"ds-u-sm-display--block\">\n    Displayed as block on sm screens and larger\n  </div>\n  <div class=\"ds-u-sm-visibility--hidden ds-u-color--muted\">\n    Invisible on sm screens and larger\n  </div>\n  <div class=\"ds-u-sm-visibility--visible\">\n    Visible on sm screens and larger\n  </div>\n\n  <div class=\"ds-u-md-display--none ds-u-color--muted\">\n    Hidden on md screens and larger\n  </div>\n  <div class=\"ds-u-md-display--block\">\n    Displayed as block on md screens and larger\n  </div>\n  <div class=\"ds-u-md-visibility--hidden ds-u-color--muted\">\n    Invisible on md screens and larger\n  </div>\n  <div class=\"ds-u-md-visibility--visible\">\n    Visible on md screens and larger\n  </div>\n\n  <div class=\"ds-u-lg-display--none ds-u-color--muted\">\n    Hidden on lg screens and larger\n  </div>\n  <div class=\"ds-u-lg-display--block\">\n    Displayed as block on lg screens and larger\n  </div>\n  <div class=\"ds-u-lg-visibility--hidden ds-u-color--muted\">\n    Invisible on lg screens and larger\n  </div>\n  <div class=\"ds-u-lg-visibility--visible\">\n    Visible on lg screens and larger\n  </div>\n\n  <div class=\"ds-u-xl-display--none ds-u-color--muted\">\n    Hidden on xl screens and larger\n  </div>\n  <div class=\"ds-u-xl-display--block\">\n    Displayed as block on xl screens and larger\n  </div>\n  <div class=\"ds-u-xl-visibility--hidden ds-u-color--muted\">\n    Invisible on xl screens and larger\n  </div>\n  <div class=\"ds-u-xl-visibility--visible\">\n    Visible on xl screens and larger\n  </div>\n","source":{"filename":"utilities/display-visibility.scss","path":"packages/core/src/utilities/display-visibility.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.display-visibility"}],"parentReference":"utilities"},{"header":"Float","description":"<p>Set an element&#39;s <code>float</code> property using the float utility. You can use the <code>ds-u-clearfix</code> utility class to clearfix your floats.</p>\n<p><strong>Format</strong>: <code>ds-u-float--[VALUE]</code></p>","reference":"utilities.float","referenceNumber":"2.7","referenceURI":"design-system/utilities/float","weight":0,"markup":"<div class=\"ds-u-clearfix\">\n  <div class=\"ds-u-float--left ds-u-fill--gray-lightest\">\n    <code>float: left</code>\n  </div>\n</div>\n<div class=\"ds-u-clearfix\">\n  <div class=\"ds-u-float--right ds-u-fill--gray-lightest\">\n    <code>float: right</code>\n  </div>\n</div>\n<div class=\"ds-u-clearfix\">\n  <div class=\"ds-u-float--none ds-u-fill--gray-lightest\">\n    <code>float: none</code>\n  </div>\n</div>","source":{"filename":"utilities/float.scss","path":"packages/core/src/utilities/float.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Responsive","description":"<p>Use a <a href=\"/responsive\">responsive prefix</a> to change how an element is floated at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.float.responsive","referenceNumber":"2.7.1","referenceURI":"design-system/utilities/float/responsive","weight":0,"markup":"<div class=\"ds-u-clearfix\">\n  :)\n  <div class=\"ds-u-float--none ds-u-md-float--left ds-u-lg-float--right\">\n    <code class=\"ds-u-md-display--none\">\n      float: none\n    </code>\n    <code class=\"ds-u-display--none ds-u-md-display--inline-block ds-u-lg-display--none\">\n      float: left\n    </code>\n    <code class=\"ds-u-display--none ds-u-lg-display--inline-block\">\n      float: right\n    </code>\n  </div>\n</div>","source":{"filename":"utilities/float.scss","path":"packages/core/src/utilities/float.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.float"}],"parentReference":"utilities"},{"header":"Font familiy","description":"<p>Change an element&#39;s typeface to either the sans-serif (Open Sans) or serif (Bitter) family using the font family utility.</p>\n<p><strong>Format</strong>: <code>ds-u-[serif|sans]</code></p>\n<h2 id=\"theming\">Theming</h2>\n<p>The following Sass variables can be overridden to theme the font family utility:</p>\n<ul>\n<li><code>$font-sans</code></li>\n<li><code>$font-serif</code></li>\n</ul>","reference":"utilities.font-family","referenceNumber":"2.8","referenceURI":"design-system/utilities/font-family","weight":0,"markup":"<p class=\"ds-u-serif\">Bitter, Georgia, serif</p>\n<p class=\"ds-u-sans\">Open Sans, Helvetica, sans-serif</p>","source":{"filename":"utilities/font-family.scss","path":"packages/core/src/utilities/font-family.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Font size","description":"<p>Use the font size utility to make the text larger or smaller.</p>\n<p><strong>Format</strong>: <code>ds-u-font-size--[SIZE]</code></p>","reference":"utilities.font-size","referenceNumber":"2.9","referenceURI":"design-system/utilities/font-size","weight":0,"markup":"<p class=\"ds-u-font-size--display ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--title ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h1 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h2 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h3 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--h4 ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--lead ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--base ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n<p class=\"ds-u-font-size--small ds-u-leading--heading ds-u-margin--0 ds-u-truncate\">{{lorem-s}}</p>\n","source":{"filename":"utilities/font-size.scss","path":"packages/core/src/utilities/font-size.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Responsive","description":"<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the font size at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.font-size.responsive","referenceNumber":"2.9.1","referenceURI":"design-system/utilities/font-size/responsive","weight":0,"markup":"<div class=\"ds-u-font-size--base ds-u-sm-font-size--h4 ds-u-md-font-size--h3 ds-u-lg-font-size--h2 ds-u-xl-font-size--h1\">\n  {{ lorem-m }}\n</div>","source":{"filename":"utilities/font-size.scss","path":"packages/core/src/utilities/font-size.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.font-size"}],"parentReference":"utilities"},{"header":"Font style","description":"<p>Change an element&#39;s <code>font-style</code> property using the font style utility.</p>\n<p><strong>Format</strong>: <code>ds-u-font-style--[VALUE]</code></p>","reference":"utilities.font-style","referenceNumber":"2.10","referenceURI":"design-system/utilities/font-style","weight":0,"markup":"<p class=\"ds-u-font-style--normal\">{{ lorem-m }}</p>\n<p class=\"ds-u-font-style--italic\">{{ lorem-m }}</p>","source":{"filename":"utilities/font-style.scss","path":"packages/core/src/utilities/font-style.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Font weight","description":"<p>Change an element&#39;s <code>font-weight</code> property using the font weight utility.</p>\n<p><strong>Format</strong>: <code>ds-u-font-weight--[VALUE]</code></p>","reference":"utilities.font-weight","referenceNumber":"2.11","referenceURI":"design-system/utilities/font-weight","weight":0,"markup":"<p class=\"ds-u-font-weight--normal\">Normal</p>\n<p class=\"ds-u-font-weight--semibold\">Semibold</p>\n<p class=\"ds-u-font-weight--bold\">Bold</p>","source":{"filename":"utilities/font-weight.scss","path":"packages/core/src/utilities/font-weight.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Line height","description":"<p>In CSS, the <code>line-height</code> property controls the leading (<code>led-ing</code>). Leading refers to the vertical distance from the baseline of one line to the baseline of the next.</p>\n<p><strong>Format</strong>: <code>ds-u-leading--[NAME]</code></p>","reference":"utilities.line-height","referenceNumber":"2.12","referenceURI":"design-system/utilities/line-height","weight":0,"markup":"<p class=\"ds-u-leading--heading ds-u-font-size--h1 ds-u-margin--0 ds-u-margin-bottom--2\">{{lorem-m}}</p>\n<p class=\"ds-u-leading--lead ds-u-font-size--lead ds-u-margin--0 ds-u-margin-bottom--2\">{{lorem-l}}</p>\n<p class=\"ds-u-leading--base ds-u-font-size--base ds-u-margin--0 ds-u-margin-bottom--2\">{{lorem-l}}</p>\n<p class=\"ds-u-leading--reset ds-u-margin--0\">{{lorem-s}}</p>","source":{"filename":"utilities/line-height.scss","path":"packages/core/src/utilities/line-height.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<blockquote>\n<p>Many people with cognitive disabilities have trouble tracking lines of text when a block of text is single spaced. Providing spacing between <code>1.5</code> to <code>2</code> allows them to start a new line more easily once they have finished the previous one. &mdash; <a href=\"https://www.w3.org/TR/WCAG20-TECHS/C21.html\">WCAG 2.0 Compliance Techniques</a></p>\n</blockquote>","reference":"utilities.line-height.guidance","referenceNumber":"2.12.1","referenceURI":"design-system/utilities/line-height/guidance","weight":0,"markup":"","source":{"filename":"utilities/line-height.scss","path":"packages/core/src/utilities/line-height.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.line-height"}],"parentReference":"utilities"},{"header":"Margin","description":"<p>Use the margin utility to change an element&#39;s margin. All margins are multiples of <code>8px</code> and can be inferred by the class name. For example, <code>ds-u-margin-top--3</code> can be understood as applying a <code>margin-top</code> of <code>24px</code> (<code>3 * 8px = 24px</code>).</p>\n<p><strong>Format</strong>: <code>ds-u-margin-[x|y|bottom|left|right|top]--[MULTIPLE]</code></p>","reference":"utilities.margin","referenceNumber":"2.13","referenceURI":"design-system/utilities/margin","weight":0,"markup":"\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-x--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-x--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-x--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-x--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-x--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-x--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-x--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-x--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-y--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-y--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-y--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-y--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-y--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-y--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-y--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-y--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-bottom--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-bottom--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-bottom--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-bottom--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-bottom--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-bottom--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-bottom--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-bottom--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-left--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-left--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-left--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-left--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-left--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-left--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-left--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-left--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-right--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-right--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-right--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-right--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-right--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-right--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-right--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-right--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-top--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-top--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-top--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-top--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-top--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-top--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-top--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-top--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--7</code>\n  </div>\n</div>\n","source":{"filename":"utilities/margin.scss","path":"packages/core/src/utilities/margin.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Responsive","description":"<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the margin at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.margin.responsive","referenceNumber":"2.13.1","referenceURI":"design-system/utilities/margin/responsive","weight":0,"markup":"<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin--1 ds-u-sm-margin--2 ds-u-md-margin--3 ds-u-lg-margin--4 ds-u-xl-margin--5 ds-u-display--inline-block\">\n    <span class=\"ds-u-fill--background\">Responsive margins</span>\n  </div>\n</div>","source":{"filename":"utilities/margin.scss","path":"packages/core/src/utilities/margin.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.margin"}],"hideMarkup":true,"parentReference":"utilities"},{"header":"Measure","description":"<p>Line length, also called &quot;measure&quot;, is an important part of readability.</p>\n<p>The design system includes 3 measure modifiers:</p>\n<ul>\n<li><strong>narrow</strong> = line length ~45 characters</li>\n<li><strong>base</strong> = line length ~65 characters</li>\n<li><strong>wide</strong> = line length ~80 characters</li>\n</ul>\n<p><strong>Format</strong>: <code>ds-u-measure--[NAME]</code></p>","reference":"utilities.measure","referenceNumber":"2.14","referenceURI":"design-system/utilities/measure","weight":0,"markup":"<p class=\"ds-u-measure--narrow\">{{ lorem-l }}</p>\n<p class=\"ds-u-measure--base ds-u-font-size--small\">{{ lorem-l }}</p>\n<p class=\"ds-u-measure--wide ds-u-font-size--small\">{{ lorem-l }}</p>","source":{"filename":"utilities/measure.scss","path":"packages/core/src/utilities/measure.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<blockquote>\n<p>A line of text shouldn’t be longer than 80 characters. This helps users with certain reading or visual disabilities that have trouble keeping their place when reading long lines of text. If the width of the text container is resized, it should be allowed to scale in a way so 80 characters or less are shown...Another way to ensure good line-length is to use a fluid layout or apply responsive web design techniques that allow the user to resize the window to find a comfortable line length. &mdash; <a href=\"https://www.w3.org/WAI/tutorials/page-structure/styling/#line-length\">W3C</a></p>\n</blockquote>","reference":"utilities.measure.guidance","referenceNumber":"2.14.1","referenceURI":"design-system/utilities/measure/guidance","weight":0,"markup":"","source":{"filename":"utilities/measure.scss","path":"packages/core/src/utilities/measure.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.measure"}],"parentReference":"utilities"},{"header":"Overflow","description":"<p>Use the overflow utility to set the <code>overflow</code> property of an element.</p>\n<blockquote>\n<p>The overflow property specifies whether to clip content, render scrollbars or just display content when it overflows its block level container. &mdash; <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/overflow\">MDN</a></p>\n</blockquote>\n<p><strong>Format</strong>: <code>ds-u-overflow--[VALUE]</code></p>\n<h4 id=\"available-overflow-options-\">Available <code>overflow</code> options:</h4>\n<ul>\n<li><code>ds-u-overflow--hidden</code></li>\n<li><code>ds-u-overflow--scroll</code></li>\n<li><code>ds-u-overflow--auto</code></li>\n</ul>","reference":"utilities.overflow","referenceNumber":"2.15","referenceURI":"design-system/utilities/overflow","weight":0,"markup":"","source":{"filename":"utilities/overflow.scss","path":"packages/core/src/utilities/overflow.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Padding","description":"<p>Use the padding utility to change an element&#39;s padding. All padding values are multiples of <code>8px</code> and can be inferred by the class name. For example, <code>ds-u-padding-top--3</code> can be understood as applying a <code>padding-top</code> of <code>24px</code> (<code>3 * 8px = 24px</code>).</p>\n<p><strong>Format</strong>: <code>ds-u-padding-[x|y|bottom|left|right|top]--[MULTIPLE]</code></p>","reference":"utilities.padding","referenceNumber":"2.16","referenceURI":"design-system/utilities/padding","weight":0,"markup":"\n<div class=\"ds-u-fill--gray-dark ds-u-padding--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--7</code>\n</div>\n","source":{"filename":"utilities/padding.scss","path":"packages/core/src/utilities/padding.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Responsive","description":"<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the padding at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.padding.responsive","referenceNumber":"2.16.1","referenceURI":"design-system/utilities/padding/responsive","weight":0,"markup":"<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-padding--1 ds-u-sm-padding--2 ds-u-md-padding--3 ds-u-lg-padding--4 ds-u-xl-padding--5 ds-u-display--inline-block\">\n    <span class=\"ds-u-color--white\">Responsive padding</span>\n  </div>\n</div>","source":{"filename":"utilities/padding.scss","path":"packages/core/src/utilities/padding.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.padding"}],"hideMarkup":true,"parentReference":"utilities"},{"header":"Text alignment","description":"<p>Align text using the <code>text-align</code> utility.</p>\n<p><strong>Format</strong>: <code>ds-u-text-align--[VALUE]</code></p>","reference":"utilities.text-align","referenceNumber":"2.17","referenceURI":"design-system/utilities/text-align","weight":0,"markup":"<p class=\"ds-u-text-align--center\">Center</p>\n<p class=\"ds-u-text-align--left\">Left</p>\n<p class=\"ds-u-text-align--right\">Right</p>","source":{"filename":"utilities/text-align.scss","path":"packages/core/src/utilities/text-align.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Responsive","description":"<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the text alignment at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.text-align.responsive","referenceNumber":"2.17.1","referenceURI":"design-system/utilities/text-align/responsive","weight":0,"markup":"<div class=\"ds-u-sm-text-align--center ds-u-md-text-align--left ds-u-lg-text-align--right\">\n  {{lorem-s}}\n</div>","source":{"filename":"utilities/text-align.scss","path":"packages/core/src/utilities/text-align.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.text-align"}],"parentReference":"utilities"},{"header":"Text decoration","description":"<p>Set whether text is underlined or not using the <code>text-decoration</code> utility.</p>\n<p><strong>Format</strong>: <code>ds-u-text-decoration--[VALUE]</code></p>","reference":"utilities.text-decoration","referenceNumber":"2.18","referenceURI":"design-system/utilities/text-decoration","weight":0,"markup":"<p class=\"ds-u-text-decoration--underline\">Underlined text</p>\n<a class=\"ds-u-text-decoration--none\" href=\"http://example.com\">Link text without underline</a>","source":{"filename":"utilities/text-decoration.scss","path":"packages/core/src/utilities/text-decoration.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Text transform","description":"<p>Set the capitalization of text using the text transform utility.</p>\n<p><strong>Format</strong>: <code>ds-u-text-transform--[VALUE]</code></p>","reference":"utilities.text-transform","referenceNumber":"2.19","referenceURI":"design-system/utilities/text-transform","weight":0,"markup":"<p class=\"ds-u-text-transform--uppercase\">uppercase transform</p>\n<p class=\"ds-u-text-transform--lowercase\">Lowercase transform</p>\n<p class=\"ds-u-text-transform--capitalize\">capitalized transform</p>","source":{"filename":"utilities/text-transform.scss","path":"packages/core/src/utilities/text-transform.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Truncate","description":"<p>Use the truncate utility to limit a text string to one line.</p>\n<h3 id=\"accessibility\">Accessibility</h3>\n<p>Place the full text in a <code>title</code> attribute so that it’s accessible on hover.</p>","reference":"utilities.truncate","referenceNumber":"2.20","referenceURI":"design-system/utilities/truncate","weight":0,"markup":"<p class=\"ds-u-truncate\" title=\"{{lorem-l}}\">{{lorem-l}}</p>","source":{"filename":"utilities/truncate.scss","path":"packages/core/src/utilities/truncate.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"},{"header":"Vertical align","description":"<p>Use the vertical align utility on inline-level elements (<code>inline</code> and <code>inline-block</code>) and on table cells.</p>\n<p><strong>Format</strong>: <code>ds-u-valign--[VALUE]</code></p>","reference":"utilities.vertical-align","referenceNumber":"2.21","referenceURI":"design-system/utilities/vertical-align","weight":0,"markup":"<table>\n  <tbody>\n    <tr>\n      <td class=\"ds-u-font-size--title ds-u-leading--reset\">A</td>\n      <td class=\"ds-u-valign--top\">Top alignment</td>\n    </tr>\n    <tr>\n      <td class=\"ds-u-font-size--title ds-u-leading--reset\">B</td>\n      <td class=\"ds-u-valign--middle\">Middle alignment</td>\n    </tr>\n    <tr>\n      <td class=\"ds-u-font-size--title ds-u-leading--reset\">C</td>\n      <td class=\"ds-u-valign--bottom\">Bottom alignment</td>\n    </tr>\n  </tbody>\n</table>","source":{"filename":"utilities/vertical-align.scss","path":"packages/core/src/utilities/vertical-align.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"}],"parentReference":null};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/line-height/index.html b/docs/utilities/line-height/index.html
index 5aead68fb9..310e60c872 100644
--- a/docs/utilities/line-height/index.html
+++ b/docs/utilities/line-height/index.html
@@ -2,28 +2,28 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Line height - CMSgov Design System</title>
+  <title>Line height - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="982195251"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.line-height" data-reactid="12">Line height</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/line-height.scss</code></heading><div data-reactid="15"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="16"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="17">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="18">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="19"><article class="ds-u-margin-y--6 l-content" data-reactid="20"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="21"><p>In CSS, the <code>line-height</code> property controls the leading (<code>led-ing</code>). Leading refers to the vertical distance from the baseline of one line to the baseline of the next.</p>
-<p><strong>Format</strong>: <code>ds-u-leading--[NAME]</code></p></div><section class="ds-u-margin-top--3" data-reactid="22"><div class="markup markup--html" data-reactid="23"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="24"><p class="ds-u-leading--heading ds-u-font-size--h1 ds-u-margin--0 ds-u-margin-bottom--2">We the People of the United States, in Order to form a more perfect Union</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1897910220"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.line-height" data-reactid="10">Line height</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/line-height.scss</code></heading><div data-reactid="13"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="14"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="15">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="16">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="17"><article class="ds-u-margin-y--6 l-content" data-reactid="18"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="19"><p>In CSS, the <code>line-height</code> property controls the leading (<code>led-ing</code>). Leading refers to the vertical distance from the baseline of one line to the baseline of the next.</p>
+<p><strong>Format</strong>: <code>ds-u-leading--[NAME]</code></p></div><section class="ds-u-margin-top--3" data-reactid="20"><div class="markup markup--html" data-reactid="21"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="22"><p class="ds-u-leading--heading ds-u-font-size--h1 ds-u-margin--0 ds-u-margin-bottom--2">We the People of the United States, in Order to form a more perfect Union</p>
 <p class="ds-u-leading--lead ds-u-font-size--lead ds-u-margin--0 ds-u-margin-bottom--2">We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.</p>
 <p class="ds-u-leading--base ds-u-font-size--base ds-u-margin--0 ds-u-margin-bottom--2">We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.</p>
-<p class="ds-u-leading--reset ds-u-margin--0">We the People of the United States</p></div><details class="ds-u-margin-bottom--2" data-reactid="25"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="26">Code snippet</summary><pre class="language-markup" data-reactid="27"><code data-reactid="28"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-leading--heading ds-u-font-size--h1 ds-u-margin--0 ds-u-margin-bottom--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
+<p class="ds-u-leading--reset ds-u-margin--0">We the People of the United States</p></div><details class="ds-u-margin-bottom--2" data-reactid="23"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="24">Code snippet</summary><pre class="language-markup" data-reactid="25"><code data-reactid="26"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-leading--heading ds-u-font-size--h1 ds-u-margin--0 ds-u-margin-bottom--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-leading--lead ds-u-font-size--lead ds-u-margin--0 ds-u-margin-bottom--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-leading--base ds-u-font-size--base ds-u-margin--0 ds-u-margin-bottom--2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-leading--reset ds-u-margin--0<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="29"><article class="ds-u-margin-y--6 l-content" data-reactid="30"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="31"><h2 id="accessibility">Accessibility</h2>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-leading--reset ds-u-margin--0<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="27"><article class="ds-u-margin-y--6 l-content" data-reactid="28"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="29"><h2 id="accessibility">Accessibility</h2>
 <blockquote>
 <p>Many people with cognitive disabilities have trouble tracking lines of text when a block of text is single spaced. Providing spacing between <code>1.5</code> to <code>2</code> allows them to start a new line more easily once they have finished the previous one. &mdash; <a href="https://www.w3.org/TR/WCAG20-TECHS/C21.html">WCAG 2.0 Compliance Techniques</a></p>
 </blockquote></div></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Line height","description":"<p>In CSS, the <code>line-height</code> property controls the leading (<code>led-ing</code>). Leading refers to the vertical distance from the baseline of one line to the baseline of the next.</p>\n<p><strong>Format</strong>: <code>ds-u-leading--[NAME]</code></p>","reference":"utilities.line-height","referenceNumber":"2.11","referenceURI":"design-system/utilities/line-height","weight":0,"markup":"<p class=\"ds-u-leading--heading ds-u-font-size--h1 ds-u-margin--0 ds-u-margin-bottom--2\">{{lorem-m}}</p>\n<p class=\"ds-u-leading--lead ds-u-font-size--lead ds-u-margin--0 ds-u-margin-bottom--2\">{{lorem-l}}</p>\n<p class=\"ds-u-leading--base ds-u-font-size--base ds-u-margin--0 ds-u-margin-bottom--2\">{{lorem-l}}</p>\n<p class=\"ds-u-leading--reset ds-u-margin--0\">{{lorem-s}}</p>","source":{"filename":"utilities/line-height.scss","path":"packages/core/src/utilities/line-height.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<blockquote>\n<p>Many people with cognitive disabilities have trouble tracking lines of text when a block of text is single spaced. Providing spacing between <code>1.5</code> to <code>2</code> allows them to start a new line more easily once they have finished the previous one. &mdash; <a href=\"https://www.w3.org/TR/WCAG20-TECHS/C21.html\">WCAG 2.0 Compliance Techniques</a></p>\n</blockquote>","reference":"utilities.line-height.guidance","referenceNumber":"2.11.1","referenceURI":"design-system/utilities/line-height/guidance","weight":0,"markup":"","source":{"filename":"utilities/line-height.scss","path":"packages/core/src/utilities/line-height.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.line-height"}],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Line height","description":"<p>In CSS, the <code>line-height</code> property controls the leading (<code>led-ing</code>). Leading refers to the vertical distance from the baseline of one line to the baseline of the next.</p>\n<p><strong>Format</strong>: <code>ds-u-leading--[NAME]</code></p>","reference":"utilities.line-height","referenceNumber":"2.12","referenceURI":"design-system/utilities/line-height","weight":0,"markup":"<p class=\"ds-u-leading--heading ds-u-font-size--h1 ds-u-margin--0 ds-u-margin-bottom--2\">{{lorem-m}}</p>\n<p class=\"ds-u-leading--lead ds-u-font-size--lead ds-u-margin--0 ds-u-margin-bottom--2\">{{lorem-l}}</p>\n<p class=\"ds-u-leading--base ds-u-font-size--base ds-u-margin--0 ds-u-margin-bottom--2\">{{lorem-l}}</p>\n<p class=\"ds-u-leading--reset ds-u-margin--0\">{{lorem-s}}</p>","source":{"filename":"utilities/line-height.scss","path":"packages/core/src/utilities/line-height.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<blockquote>\n<p>Many people with cognitive disabilities have trouble tracking lines of text when a block of text is single spaced. Providing spacing between <code>1.5</code> to <code>2</code> allows them to start a new line more easily once they have finished the previous one. &mdash; <a href=\"https://www.w3.org/TR/WCAG20-TECHS/C21.html\">WCAG 2.0 Compliance Techniques</a></p>\n</blockquote>","reference":"utilities.line-height.guidance","referenceNumber":"2.12.1","referenceURI":"design-system/utilities/line-height/guidance","weight":0,"markup":"","source":{"filename":"utilities/line-height.scss","path":"packages/core/src/utilities/line-height.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.line-height"}],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/margin/index.html b/docs/utilities/margin/index.html
index f82ffa2587..dadc138aa7 100644
--- a/docs/utilities/margin/index.html
+++ b/docs/utilities/margin/index.html
@@ -2,15 +2,15 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Margin - CMSgov Design System</title>
+  <title>Margin - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="213556660"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.margin" data-reactid="12">Margin</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/margin.scss</code></heading><div data-reactid="15"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="16"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="17">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="18"><article class="ds-u-margin-y--6 l-content" data-reactid="19"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="20"><p>Use the margin utility to change an element&#39;s margin. All margins are multiples of <code>8px</code> and can be inferred by the class name. For example, <code>ds-u-margin-top--3</code> can be understood as applying a <code>margin-top</code> of <code>24px</code> (<code>3 * 8px = 24px</code>).</p>
-<p><strong>Format</strong>: <code>ds-u-margin-[x|y|bottom|left|right|top]--[MULTIPLE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="21"><div class="markup markup--html" data-reactid="22"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="23">
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-888902827"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.margin" data-reactid="10">Margin</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/margin.scss</code></heading><div data-reactid="13"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="14"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="15">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="16"><article class="ds-u-margin-y--6 l-content" data-reactid="17"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="18"><p>Use the margin utility to change an element&#39;s margin. All margins are multiples of <code>8px</code> and can be inferred by the class name. For example, <code>ds-u-margin-top--3</code> can be understood as applying a <code>margin-top</code> of <code>24px</code> (<code>3 * 8px = 24px</code>).</p>
+<p><strong>Format</strong>: <code>ds-u-margin-[x|y|bottom|left|right|top]--[MULTIPLE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="19"><div class="markup markup--html" data-reactid="20"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="21">
 
 <div class="ds-u-fill--gray-cool-light">
   <div class="ds-u-margin--0 ds-u-display--inline-block">
@@ -347,8 +347,7 @@
     <code class="ds-u-fill--background ds-u-margin--0">ds-u-margin-top--7</code>
   </div>
 </div>
-</div></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="24"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="25"><h2 id="responsive">Responsive</h2>
-<p>Use a <a href="/responsive">responsive prefix</a> to change the margin at specific breakpoints.</p>
+</div></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="22"><div data-reactid="23"><h2 class="ds-h2" id="utilities.margin.responsive" data-reactid="24">Responsive</h2></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="25"><p>Use a <a href="/responsive">responsive prefix</a> to change the margin at specific breakpoints.</p>
 <p><em>Resize your browser to see each breakpoint in action:</em></p></div><section class="ds-u-margin-top--3" data-reactid="26"><div class="markup markup--html" data-reactid="27"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="28"><div class="ds-u-fill--gray-dark">
   <div class="ds-u-margin--1 ds-u-sm-margin--2 ds-u-md-margin--3 ds-u-lg-margin--4 ds-u-xl-margin--5 ds-u-display--inline-block">
     <span class="ds-u-fill--background">Responsive margins</span>
@@ -360,8 +359,8 @@
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Margin","description":"<p>Use the margin utility to change an element&#39;s margin. All margins are multiples of <code>8px</code> and can be inferred by the class name. For example, <code>ds-u-margin-top--3</code> can be understood as applying a <code>margin-top</code> of <code>24px</code> (<code>3 * 8px = 24px</code>).</p>\n<p><strong>Format</strong>: <code>ds-u-margin-[x|y|bottom|left|right|top]--[MULTIPLE]</code></p>","reference":"utilities.margin","referenceNumber":"2.12","referenceURI":"design-system/utilities/margin","weight":0,"markup":"\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-x--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-x--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-x--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-x--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-x--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-x--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-x--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-x--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-y--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-y--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-y--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-y--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-y--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-y--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-y--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-y--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-bottom--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-bottom--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-bottom--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-bottom--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-bottom--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-bottom--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-bottom--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-bottom--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-left--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-left--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-left--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-left--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-left--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-left--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-left--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-left--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-right--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-right--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-right--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-right--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-right--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-right--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-right--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-right--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-top--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-top--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-top--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-top--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-top--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-top--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-top--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-top--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--7</code>\n  </div>\n</div>\n","source":{"filename":"utilities/margin.scss","path":"packages/core/src/utilities/margin.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the margin at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.margin.responsive","referenceNumber":"2.12.1","referenceURI":"design-system/utilities/margin/responsive","weight":0,"markup":"<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin--1 ds-u-sm-margin--2 ds-u-md-margin--3 ds-u-lg-margin--4 ds-u-xl-margin--5 ds-u-display--inline-block\">\n    <span class=\"ds-u-fill--background\">Responsive margins</span>\n  </div>\n</div>","source":{"filename":"utilities/margin.scss","path":"packages/core/src/utilities/margin.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.margin"}],"hideMarkup":true,"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Margin","description":"<p>Use the margin utility to change an element&#39;s margin. All margins are multiples of <code>8px</code> and can be inferred by the class name. For example, <code>ds-u-margin-top--3</code> can be understood as applying a <code>margin-top</code> of <code>24px</code> (<code>3 * 8px = 24px</code>).</p>\n<p><strong>Format</strong>: <code>ds-u-margin-[x|y|bottom|left|right|top]--[MULTIPLE]</code></p>","reference":"utilities.margin","referenceNumber":"2.13","referenceURI":"design-system/utilities/margin","weight":0,"markup":"\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-x--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-x--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-x--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-x--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-x--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-x--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-x--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-x--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-x--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-y--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-y--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-y--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-y--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-y--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-y--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-y--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-y--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-y--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-bottom--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-bottom--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-bottom--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-bottom--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-bottom--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-bottom--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-bottom--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-bottom--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-bottom--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-left--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-left--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-left--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-left--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-left--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-left--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-left--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-left--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-left--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-right--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-right--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-right--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-right--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-right--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-right--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-right--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-right--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-right--7</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-cool-light\">\n  <div class=\"ds-u-margin-top--0 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--0</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-warm-light\">\n  <div class=\"ds-u-margin-top--1 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--1</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lightest\">\n  <div class=\"ds-u-margin-top--2 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--2</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-lighter\">\n  <div class=\"ds-u-margin-top--3 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--3</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-light\">\n  <div class=\"ds-u-margin-top--4 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--4</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-medium\">\n  <div class=\"ds-u-margin-top--5 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--5</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray\">\n  <div class=\"ds-u-margin-top--6 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--6</code>\n  </div>\n</div>\n\n<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin-top--7 ds-u-display--inline-block\">\n    <code class=\"ds-u-fill--background ds-u-margin--0\">ds-u-margin-top--7</code>\n  </div>\n</div>\n","source":{"filename":"utilities/margin.scss","path":"packages/core/src/utilities/margin.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Responsive","description":"<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the margin at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.margin.responsive","referenceNumber":"2.13.1","referenceURI":"design-system/utilities/margin/responsive","weight":0,"markup":"<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-margin--1 ds-u-sm-margin--2 ds-u-md-margin--3 ds-u-lg-margin--4 ds-u-xl-margin--5 ds-u-display--inline-block\">\n    <span class=\"ds-u-fill--background\">Responsive margins</span>\n  </div>\n</div>","source":{"filename":"utilities/margin.scss","path":"packages/core/src/utilities/margin.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.margin"}],"hideMarkup":true,"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/measure/index.html b/docs/utilities/measure/index.html
index 68a998166e..07d8756830 100644
--- a/docs/utilities/measure/index.html
+++ b/docs/utilities/measure/index.html
@@ -2,32 +2,32 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Measure - CMSgov Design System</title>
+  <title>Measure - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1601224369"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.measure" data-reactid="12">Measure</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/measure.scss</code></heading><div data-reactid="15"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="16"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="17">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="18">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="19"><article class="ds-u-margin-y--6 l-content" data-reactid="20"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="21"><p>Line length, also called &quot;measure&quot;, is an important part of readability.</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="653325544"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.measure" data-reactid="10">Measure</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/measure.scss</code></heading><div data-reactid="13"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="14"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="15">Usage</a><a aria-selected="false" aria-controls="guidance" class="ds-c-tabs__item" href="#guidance" id="ds-c-tabs__item--guidance" role="tab" data-reactid="16">Guidance</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="17"><article class="ds-u-margin-y--6 l-content" data-reactid="18"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="19"><p>Line length, also called &quot;measure&quot;, is an important part of readability.</p>
 <p>The design system includes 3 measure modifiers:</p>
 <ul>
 <li><strong>narrow</strong> = line length ~45 characters</li>
 <li><strong>base</strong> = line length ~65 characters</li>
 <li><strong>wide</strong> = line length ~80 characters</li>
 </ul>
-<p><strong>Format</strong>: <code>ds-u-measure--[NAME]</code></p></div><section class="ds-u-margin-top--3" data-reactid="22"><div class="markup markup--html" data-reactid="23"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="24"><p class="ds-u-measure--narrow">We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.</p>
+<p><strong>Format</strong>: <code>ds-u-measure--[NAME]</code></p></div><section class="ds-u-margin-top--3" data-reactid="20"><div class="markup markup--html" data-reactid="21"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="22"><p class="ds-u-measure--narrow">We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.</p>
 <p class="ds-u-measure--base ds-u-font-size--small">We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.</p>
-<p class="ds-u-measure--wide ds-u-font-size--small">We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.</p></div><details class="ds-u-margin-bottom--2" data-reactid="25"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="26">Code snippet</summary><pre class="language-markup" data-reactid="27"><code data-reactid="28"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-measure--narrow<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
+<p class="ds-u-measure--wide ds-u-font-size--small">We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.</p></div><details class="ds-u-margin-bottom--2" data-reactid="23"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="24">Code snippet</summary><pre class="language-markup" data-reactid="25"><code data-reactid="26"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-measure--narrow<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-measure--base ds-u-font-size--small<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-measure--wide ds-u-font-size--small<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="29"><article class="ds-u-margin-y--6 l-content" data-reactid="30"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="31"><h2 id="accessibility">Accessibility</h2>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-measure--wide ds-u-font-size--small<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div><div aria-labelledby="ds-c-tabs__item--guidance" aria-hidden="true" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="guidance" role="tabpanel" data-reactid="27"><article class="ds-u-margin-y--6 l-content" data-reactid="28"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="29"><h2 id="accessibility">Accessibility</h2>
 <blockquote>
 <p>A line of text shouldn’t be longer than 80 characters. This helps users with certain reading or visual disabilities that have trouble keeping their place when reading long lines of text. If the width of the text container is resized, it should be allowed to scale in a way so 80 characters or less are shown...Another way to ensure good line-length is to use a fluid layout or apply responsive web design techniques that allow the user to resize the window to find a comfortable line length. &mdash; <a href="https://www.w3.org/WAI/tutorials/page-structure/styling/#line-length">W3C</a></p>
 </blockquote></div></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Measure","description":"<p>Line length, also called &quot;measure&quot;, is an important part of readability.</p>\n<p>The design system includes 3 measure modifiers:</p>\n<ul>\n<li><strong>narrow</strong> = line length ~45 characters</li>\n<li><strong>base</strong> = line length ~65 characters</li>\n<li><strong>wide</strong> = line length ~80 characters</li>\n</ul>\n<p><strong>Format</strong>: <code>ds-u-measure--[NAME]</code></p>","reference":"utilities.measure","referenceNumber":"2.13","referenceURI":"design-system/utilities/measure","weight":0,"markup":"<p class=\"ds-u-measure--narrow\">{{ lorem-l }}</p>\n<p class=\"ds-u-measure--base ds-u-font-size--small\">{{ lorem-l }}</p>\n<p class=\"ds-u-measure--wide ds-u-font-size--small\">{{ lorem-l }}</p>","source":{"filename":"utilities/measure.scss","path":"packages/core/src/utilities/measure.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<blockquote>\n<p>A line of text shouldn’t be longer than 80 characters. This helps users with certain reading or visual disabilities that have trouble keeping their place when reading long lines of text. If the width of the text container is resized, it should be allowed to scale in a way so 80 characters or less are shown...Another way to ensure good line-length is to use a fluid layout or apply responsive web design techniques that allow the user to resize the window to find a comfortable line length. &mdash; <a href=\"https://www.w3.org/WAI/tutorials/page-structure/styling/#line-length\">W3C</a></p>\n</blockquote>","reference":"utilities.measure.guidance","referenceNumber":"2.13.1","referenceURI":"design-system/utilities/measure/guidance","weight":0,"markup":"","source":{"filename":"utilities/measure.scss","path":"packages/core/src/utilities/measure.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.measure"}],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Measure","description":"<p>Line length, also called &quot;measure&quot;, is an important part of readability.</p>\n<p>The design system includes 3 measure modifiers:</p>\n<ul>\n<li><strong>narrow</strong> = line length ~45 characters</li>\n<li><strong>base</strong> = line length ~65 characters</li>\n<li><strong>wide</strong> = line length ~80 characters</li>\n</ul>\n<p><strong>Format</strong>: <code>ds-u-measure--[NAME]</code></p>","reference":"utilities.measure","referenceNumber":"2.14","referenceURI":"design-system/utilities/measure","weight":0,"markup":"<p class=\"ds-u-measure--narrow\">{{ lorem-l }}</p>\n<p class=\"ds-u-measure--base ds-u-font-size--small\">{{ lorem-l }}</p>\n<p class=\"ds-u-measure--wide ds-u-font-size--small\">{{ lorem-l }}</p>","source":{"filename":"utilities/measure.scss","path":"packages/core/src/utilities/measure.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"accessibility\">Accessibility</h2>\n<blockquote>\n<p>A line of text shouldn’t be longer than 80 characters. This helps users with certain reading or visual disabilities that have trouble keeping their place when reading long lines of text. If the width of the text container is resized, it should be allowed to scale in a way so 80 characters or less are shown...Another way to ensure good line-length is to use a fluid layout or apply responsive web design techniques that allow the user to resize the window to find a comfortable line length. &mdash; <a href=\"https://www.w3.org/WAI/tutorials/page-structure/styling/#line-length\">W3C</a></p>\n</blockquote>","reference":"utilities.measure.guidance","referenceNumber":"2.14.1","referenceURI":"design-system/utilities/measure/guidance","weight":0,"markup":"","source":{"filename":"utilities/measure.scss","path":"packages/core/src/utilities/measure.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.measure"}],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/overflow/index.html b/docs/utilities/overflow/index.html
index 1c7da0d383..f19d1d1527 100644
--- a/docs/utilities/overflow/index.html
+++ b/docs/utilities/overflow/index.html
@@ -2,14 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Overflow - CMSgov Design System</title>
+  <title>Overflow - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-93682750"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.overflow" data-reactid="12">Overflow</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/overflow.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>Use the overflow utility to set the <code>overflow</code> property of an element.</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-970967198"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.overflow" data-reactid="10">Overflow</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/overflow.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>Use the overflow utility to set the <code>overflow</code> property of an element.</p>
 <blockquote>
 <p>The overflow property specifies whether to clip content, render scrollbars or just display content when it overflows its block level container. &mdash; <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/overflow">MDN</a></p>
 </blockquote>
@@ -22,8 +22,8 @@ <h4 id="available-overflow-options-">Available <code>overflow</code> options:</h
 </ul></div></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Overflow","description":"<p>Use the overflow utility to set the <code>overflow</code> property of an element.</p>\n<blockquote>\n<p>The overflow property specifies whether to clip content, render scrollbars or just display content when it overflows its block level container. &mdash; <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/overflow\">MDN</a></p>\n</blockquote>\n<p><strong>Format</strong>: <code>ds-u-overflow--[VALUE]</code></p>\n<h4 id=\"available-overflow-options-\">Available <code>overflow</code> options:</h4>\n<ul>\n<li><code>ds-u-overflow--hidden</code></li>\n<li><code>ds-u-overflow--scroll</code></li>\n<li><code>ds-u-overflow--auto</code></li>\n</ul>","reference":"utilities.overflow","referenceNumber":"2.14","referenceURI":"design-system/utilities/overflow","weight":0,"markup":"","source":{"filename":"utilities/overflow.scss","path":"packages/core/src/utilities/overflow.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Overflow","description":"<p>Use the overflow utility to set the <code>overflow</code> property of an element.</p>\n<blockquote>\n<p>The overflow property specifies whether to clip content, render scrollbars or just display content when it overflows its block level container. &mdash; <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/overflow\">MDN</a></p>\n</blockquote>\n<p><strong>Format</strong>: <code>ds-u-overflow--[VALUE]</code></p>\n<h4 id=\"available-overflow-options-\">Available <code>overflow</code> options:</h4>\n<ul>\n<li><code>ds-u-overflow--hidden</code></li>\n<li><code>ds-u-overflow--scroll</code></li>\n<li><code>ds-u-overflow--auto</code></li>\n</ul>","reference":"utilities.overflow","referenceNumber":"2.15","referenceURI":"design-system/utilities/overflow","weight":0,"markup":"","source":{"filename":"utilities/overflow.scss","path":"packages/core/src/utilities/overflow.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/padding/index.html b/docs/utilities/padding/index.html
index 68717d7935..7ab74e5a73 100644
--- a/docs/utilities/padding/index.html
+++ b/docs/utilities/padding/index.html
@@ -2,15 +2,15 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Padding - CMSgov Design System</title>
+  <title>Padding - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1510737497"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.padding" data-reactid="12">Padding</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/padding.scss</code></heading><div data-reactid="15"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="16"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="17">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="18"><article class="ds-u-margin-y--6 l-content" data-reactid="19"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="20"><p>Use the padding utility to change an element&#39;s padding. All padding values are multiples of <code>8px</code> and can be inferred by the class name. For example, <code>ds-u-padding-top--3</code> can be understood as applying a <code>padding-top</code> of <code>24px</code> (<code>3 * 8px = 24px</code>).</p>
-<p><strong>Format</strong>: <code>ds-u-padding-[x|y|bottom|left|right|top]--[MULTIPLE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="21"><div class="markup markup--html" data-reactid="22"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="23">
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1282266180"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.padding" data-reactid="10">Padding</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/padding.scss</code></heading><div data-reactid="13"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="14"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="15">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="16"><article class="ds-u-margin-y--6 l-content" data-reactid="17"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="18"><p>Use the padding utility to change an element&#39;s padding. All padding values are multiples of <code>8px</code> and can be inferred by the class name. For example, <code>ds-u-padding-top--3</code> can be understood as applying a <code>padding-top</code> of <code>24px</code> (<code>3 * 8px = 24px</code>).</p>
+<p><strong>Format</strong>: <code>ds-u-padding-[x|y|bottom|left|right|top]--[MULTIPLE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="19"><div class="markup markup--html" data-reactid="20"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="21">
 <div class="ds-u-fill--gray-dark ds-u-padding--0 ds-u-margin-bottom--2">
   <code class="ds-u-fill--transparent ds-u-color--white">ds-u-padding--0</code>
 </div>
@@ -234,8 +234,7 @@
 <div class="ds-u-fill--gray-dark ds-u-padding-top--7 ds-u-margin-bottom--2">
   <code class="ds-u-fill--transparent ds-u-color--white">ds-u-padding-top--7</code>
 </div>
-</div></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="24"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="25"><h2 id="responsive">Responsive</h2>
-<p>Use a <a href="/responsive">responsive prefix</a> to change the padding at specific breakpoints.</p>
+</div></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="22"><div data-reactid="23"><h2 class="ds-h2" id="utilities.padding.responsive" data-reactid="24">Responsive</h2></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="25"><p>Use a <a href="/responsive">responsive prefix</a> to change the padding at specific breakpoints.</p>
 <p><em>Resize your browser to see each breakpoint in action:</em></p></div><section class="ds-u-margin-top--3" data-reactid="26"><div class="markup markup--html" data-reactid="27"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="28"><div class="ds-u-fill--gray-dark">
   <div class="ds-u-padding--1 ds-u-sm-padding--2 ds-u-md-padding--3 ds-u-lg-padding--4 ds-u-xl-padding--5 ds-u-display--inline-block">
     <span class="ds-u-color--white">Responsive padding</span>
@@ -247,8 +246,8 @@
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Padding","description":"<p>Use the padding utility to change an element&#39;s padding. All padding values are multiples of <code>8px</code> and can be inferred by the class name. For example, <code>ds-u-padding-top--3</code> can be understood as applying a <code>padding-top</code> of <code>24px</code> (<code>3 * 8px = 24px</code>).</p>\n<p><strong>Format</strong>: <code>ds-u-padding-[x|y|bottom|left|right|top]--[MULTIPLE]</code></p>","reference":"utilities.padding","referenceNumber":"2.15","referenceURI":"design-system/utilities/padding","weight":0,"markup":"\n<div class=\"ds-u-fill--gray-dark ds-u-padding--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--7</code>\n</div>\n","source":{"filename":"utilities/padding.scss","path":"packages/core/src/utilities/padding.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the padding at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.padding.responsive","referenceNumber":"2.15.1","referenceURI":"design-system/utilities/padding/responsive","weight":0,"markup":"<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-padding--1 ds-u-sm-padding--2 ds-u-md-padding--3 ds-u-lg-padding--4 ds-u-xl-padding--5 ds-u-display--inline-block\">\n    <span class=\"ds-u-color--white\">Responsive padding</span>\n  </div>\n</div>","source":{"filename":"utilities/padding.scss","path":"packages/core/src/utilities/padding.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.padding"}],"hideMarkup":true,"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Padding","description":"<p>Use the padding utility to change an element&#39;s padding. All padding values are multiples of <code>8px</code> and can be inferred by the class name. For example, <code>ds-u-padding-top--3</code> can be understood as applying a <code>padding-top</code> of <code>24px</code> (<code>3 * 8px = 24px</code>).</p>\n<p><strong>Format</strong>: <code>ds-u-padding-[x|y|bottom|left|right|top]--[MULTIPLE]</code></p>","reference":"utilities.padding","referenceNumber":"2.16","referenceURI":"design-system/utilities/padding","weight":0,"markup":"\n<div class=\"ds-u-fill--gray-dark ds-u-padding--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-x--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-x--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-y--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-y--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-bottom--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-bottom--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-left--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-left--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-right--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-right--7</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--0 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--0</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--1 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--1</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--2 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--2</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--3 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--3</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--4 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--4</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--5 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--5</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--6 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--6</code>\n</div>\n\n<div class=\"ds-u-fill--gray-dark ds-u-padding-top--7 ds-u-margin-bottom--2\">\n  <code class=\"ds-u-fill--transparent ds-u-color--white\">ds-u-padding-top--7</code>\n</div>\n","source":{"filename":"utilities/padding.scss","path":"packages/core/src/utilities/padding.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Responsive","description":"<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the padding at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.padding.responsive","referenceNumber":"2.16.1","referenceURI":"design-system/utilities/padding/responsive","weight":0,"markup":"<div class=\"ds-u-fill--gray-dark\">\n  <div class=\"ds-u-padding--1 ds-u-sm-padding--2 ds-u-md-padding--3 ds-u-lg-padding--4 ds-u-xl-padding--5 ds-u-display--inline-block\">\n    <span class=\"ds-u-color--white\">Responsive padding</span>\n  </div>\n</div>","source":{"filename":"utilities/padding.scss","path":"packages/core/src/utilities/padding.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.padding"}],"hideMarkup":true,"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/text-align/index.html b/docs/utilities/text-align/index.html
index 8715a4e918..013a250e70 100644
--- a/docs/utilities/text-align/index.html
+++ b/docs/utilities/text-align/index.html
@@ -2,20 +2,19 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Text alignment - CMSgov Design System</title>
+  <title>Text alignment - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="136280759"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.text-align" data-reactid="12">Text alignment</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/text-align.scss</code></heading><div data-reactid="15"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="16"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="17">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="18"><article class="ds-u-margin-y--6 l-content" data-reactid="19"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="20"><p>Align text using the <code>text-align</code> utility.</p>
-<p><strong>Format</strong>: <code>ds-u-text-align--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="21"><div class="markup markup--html" data-reactid="22"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="23"><p class="ds-u-text-align--center">Center</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="51202519"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.text-align" data-reactid="10">Text alignment</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/text-align.scss</code></heading><div data-reactid="13"><div class="ds-c-tabs ds-u-padding-left--6 ds-u-fill--gray-lightest" role="tablist" data-reactid="14"><a aria-selected="true" aria-controls="usage" class="ds-c-tabs__item" href="#usage" id="ds-c-tabs__item--usage" role="tab" data-reactid="15">Usage</a></div><div aria-labelledby="ds-c-tabs__item--usage" aria-hidden="false" class="ds-c-tabs__panel ds-u-border--0 ds-u-padding-x--6 ds-u-padding-y--0" id="usage" role="tabpanel" data-reactid="16"><article class="ds-u-margin-y--6 l-content" data-reactid="17"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="18"><p>Align text using the <code>text-align</code> utility.</p>
+<p><strong>Format</strong>: <code>ds-u-text-align--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="19"><div class="markup markup--html" data-reactid="20"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="21"><p class="ds-u-text-align--center">Center</p>
 <p class="ds-u-text-align--left">Left</p>
-<p class="ds-u-text-align--right">Right</p></div><details class="ds-u-margin-bottom--2" data-reactid="24"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="25">Code snippet</summary><pre class="language-markup" data-reactid="26"><code data-reactid="27"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-align--center<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Center<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
+<p class="ds-u-text-align--right">Right</p></div><details class="ds-u-margin-bottom--2" data-reactid="22"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="23">Code snippet</summary><pre class="language-markup" data-reactid="24"><code data-reactid="25"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-align--center<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Center<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-align--left<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Left<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
-<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-align--right<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Right<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="28"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="29"><h2 id="responsive">Responsive</h2>
-<p>Use a <a href="/responsive">responsive prefix</a> to change the text alignment at specific breakpoints.</p>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-align--right<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Right<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article><article class="ds-u-margin-y--6 l-content" data-reactid="26"><div data-reactid="27"><h2 class="ds-h2" id="utilities.text-align.responsive" data-reactid="28">Responsive</h2></div><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="29"><p>Use a <a href="/responsive">responsive prefix</a> to change the text alignment at specific breakpoints.</p>
 <p><em>Resize your browser to see each breakpoint in action:</em></p></div><section class="ds-u-margin-top--3" data-reactid="30"><div class="markup markup--html" data-reactid="31"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="32"><div class="ds-u-sm-text-align--center ds-u-md-text-align--left ds-u-lg-text-align--right">
  We the People of the United States
 </div></div><details class="ds-u-margin-bottom--2" data-reactid="33"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="34">Code snippet</summary><pre class="language-markup" data-reactid="35"><code data-reactid="36"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-sm-text-align--center ds-u-md-text-align--left ds-u-lg-text-align--right<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
@@ -23,8 +22,8 @@
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Text alignment","description":"<p>Align text using the <code>text-align</code> utility.</p>\n<p><strong>Format</strong>: <code>ds-u-text-align--[VALUE]</code></p>","reference":"utilities.text-align","referenceNumber":"2.16","referenceURI":"design-system/utilities/text-align","weight":0,"markup":"<p class=\"ds-u-text-align--center\">Center</p>\n<p class=\"ds-u-text-align--left\">Left</p>\n<p class=\"ds-u-text-align--right\">Right</p>","source":{"filename":"utilities/text-align.scss","path":"packages/core/src/utilities/text-align.scss"},"depth":2,"modifiers":[],"sections":[{"header":"---","description":"<h2 id=\"responsive\">Responsive</h2>\n<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the text alignment at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.text-align.responsive","referenceNumber":"2.16.1","referenceURI":"design-system/utilities/text-align/responsive","weight":0,"markup":"<div class=\"ds-u-sm-text-align--center ds-u-md-text-align--left ds-u-lg-text-align--right\">\n  {{lorem-s}}\n</div>","source":{"filename":"utilities/text-align.scss","path":"packages/core/src/utilities/text-align.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.text-align"}],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Text alignment","description":"<p>Align text using the <code>text-align</code> utility.</p>\n<p><strong>Format</strong>: <code>ds-u-text-align--[VALUE]</code></p>","reference":"utilities.text-align","referenceNumber":"2.17","referenceURI":"design-system/utilities/text-align","weight":0,"markup":"<p class=\"ds-u-text-align--center\">Center</p>\n<p class=\"ds-u-text-align--left\">Left</p>\n<p class=\"ds-u-text-align--right\">Right</p>","source":{"filename":"utilities/text-align.scss","path":"packages/core/src/utilities/text-align.scss"},"depth":2,"modifiers":[],"sections":[{"header":"Responsive","description":"<p>Use a <a href=\"/responsive\">responsive prefix</a> to change the text alignment at specific breakpoints.</p>\n<p><em>Resize your browser to see each breakpoint in action:</em></p>","reference":"utilities.text-align.responsive","referenceNumber":"2.17.1","referenceURI":"design-system/utilities/text-align/responsive","weight":0,"markup":"<div class=\"ds-u-sm-text-align--center ds-u-md-text-align--left ds-u-lg-text-align--right\">\n  {{lorem-s}}\n</div>","source":{"filename":"utilities/text-align.scss","path":"packages/core/src/utilities/text-align.scss"},"depth":3,"modifiers":[],"sections":[],"parentReference":"utilities.text-align"}],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/text-decoration/index.html b/docs/utilities/text-decoration/index.html
index 211b7b3063..b19823ff43 100644
--- a/docs/utilities/text-decoration/index.html
+++ b/docs/utilities/text-decoration/index.html
@@ -2,21 +2,21 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Text decoration - CMSgov Design System</title>
+  <title>Text decoration - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-845312230"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.text-decoration" data-reactid="12">Text decoration</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/text-decoration.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>Set whether text is underlined or not using the <code>text-decoration</code> utility.</p>
-<p><strong>Format</strong>: <code>ds-u-text-decoration--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20"><p class="ds-u-text-decoration--underline">Underlined text</p>
-<a class="ds-u-text-decoration--none" href="http://example.com">Link text without underline</a></div><details class="ds-u-margin-bottom--2" data-reactid="21"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="22">Code snippet</summary><pre class="language-markup" data-reactid="23"><code data-reactid="24"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-decoration--underline<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Underlined text<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-132300098"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.text-decoration" data-reactid="10">Text decoration</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/text-decoration.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>Set whether text is underlined or not using the <code>text-decoration</code> utility.</p>
+<p><strong>Format</strong>: <code>ds-u-text-decoration--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="16"><div class="markup markup--html" data-reactid="17"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="18"><p class="ds-u-text-decoration--underline">Underlined text</p>
+<a class="ds-u-text-decoration--none" href="http://example.com">Link text without underline</a></div><details class="ds-u-margin-bottom--2" data-reactid="19"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="20">Code snippet</summary><pre class="language-markup" data-reactid="21"><code data-reactid="22"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-decoration--underline<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Underlined text<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-decoration--none<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>http://example.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Link text without underline<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Text decoration","description":"<p>Set whether text is underlined or not using the <code>text-decoration</code> utility.</p>\n<p><strong>Format</strong>: <code>ds-u-text-decoration--[VALUE]</code></p>","reference":"utilities.text-decoration","referenceNumber":"2.17","referenceURI":"design-system/utilities/text-decoration","weight":0,"markup":"<p class=\"ds-u-text-decoration--underline\">Underlined text</p>\n<a class=\"ds-u-text-decoration--none\" href=\"http://example.com\">Link text without underline</a>","source":{"filename":"utilities/text-decoration.scss","path":"packages/core/src/utilities/text-decoration.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Text decoration","description":"<p>Set whether text is underlined or not using the <code>text-decoration</code> utility.</p>\n<p><strong>Format</strong>: <code>ds-u-text-decoration--[VALUE]</code></p>","reference":"utilities.text-decoration","referenceNumber":"2.18","referenceURI":"design-system/utilities/text-decoration","weight":0,"markup":"<p class=\"ds-u-text-decoration--underline\">Underlined text</p>\n<a class=\"ds-u-text-decoration--none\" href=\"http://example.com\">Link text without underline</a>","source":{"filename":"utilities/text-decoration.scss","path":"packages/core/src/utilities/text-decoration.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/text-transform/index.html b/docs/utilities/text-transform/index.html
index c19b1a7d72..76dc1a85d3 100644
--- a/docs/utilities/text-transform/index.html
+++ b/docs/utilities/text-transform/index.html
@@ -2,23 +2,23 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Text transform - CMSgov Design System</title>
+  <title>Text transform - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="285281854"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.text-transform" data-reactid="12">Text transform</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/text-transform.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>Set the capitalization of text using the text transform utility.</p>
-<p><strong>Format</strong>: <code>ds-u-text-transform--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20"><p class="ds-u-text-transform--uppercase">uppercase transform</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="1301987795"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.text-transform" data-reactid="10">Text transform</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/text-transform.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>Set the capitalization of text using the text transform utility.</p>
+<p><strong>Format</strong>: <code>ds-u-text-transform--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="16"><div class="markup markup--html" data-reactid="17"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="18"><p class="ds-u-text-transform--uppercase">uppercase transform</p>
 <p class="ds-u-text-transform--lowercase">Lowercase transform</p>
-<p class="ds-u-text-transform--capitalize">capitalized transform</p></div><details class="ds-u-margin-bottom--2" data-reactid="21"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="22">Code snippet</summary><pre class="language-markup" data-reactid="23"><code data-reactid="24"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-transform--uppercase<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>uppercase transform<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
+<p class="ds-u-text-transform--capitalize">capitalized transform</p></div><details class="ds-u-margin-bottom--2" data-reactid="19"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="20">Code snippet</summary><pre class="language-markup" data-reactid="21"><code data-reactid="22"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-transform--uppercase<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>uppercase transform<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-transform--lowercase<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Lowercase transform<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-text-transform--capitalize<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>capitalized transform<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Text transform","description":"<p>Set the capitalization of text using the text transform utility.</p>\n<p><strong>Format</strong>: <code>ds-u-text-transform--[VALUE]</code></p>","reference":"utilities.text-transform","referenceNumber":"2.18","referenceURI":"design-system/utilities/text-transform","weight":0,"markup":"<p class=\"ds-u-text-transform--uppercase\">uppercase transform</p>\n<p class=\"ds-u-text-transform--lowercase\">Lowercase transform</p>\n<p class=\"ds-u-text-transform--capitalize\">capitalized transform</p>","source":{"filename":"utilities/text-transform.scss","path":"packages/core/src/utilities/text-transform.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Text transform","description":"<p>Set the capitalization of text using the text transform utility.</p>\n<p><strong>Format</strong>: <code>ds-u-text-transform--[VALUE]</code></p>","reference":"utilities.text-transform","referenceNumber":"2.19","referenceURI":"design-system/utilities/text-transform","weight":0,"markup":"<p class=\"ds-u-text-transform--uppercase\">uppercase transform</p>\n<p class=\"ds-u-text-transform--lowercase\">Lowercase transform</p>\n<p class=\"ds-u-text-transform--capitalize\">capitalized transform</p>","source":{"filename":"utilities/text-transform.scss","path":"packages/core/src/utilities/text-transform.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/truncate/index.html b/docs/utilities/truncate/index.html
index 96f6a9635d..a0a9773a04 100644
--- a/docs/utilities/truncate/index.html
+++ b/docs/utilities/truncate/index.html
@@ -2,20 +2,20 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Truncate - CMSgov Design System</title>
+  <title>Truncate - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-627733518"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.truncate" data-reactid="12">Truncate</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/truncate.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>Use the truncate utility to limit a text string to one line.</p>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="900153238"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.truncate" data-reactid="10">Truncate</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/truncate.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>Use the truncate utility to limit a text string to one line.</p>
 <h3 id="accessibility">Accessibility</h3>
-<p>Place the full text in a <code>title</code> attribute so that it’s accessible on hover.</p></div><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20"><p class="ds-u-truncate" title="We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.">We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.</p></div><details class="ds-u-margin-bottom--2" data-reactid="21"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="22">Code snippet</summary><pre class="language-markup" data-reactid="23"><code data-reactid="24"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-truncate<span class="token punctuation">"</span></span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></main></div></div></div>
+<p>Place the full text in a <code>title</code> attribute so that it’s accessible on hover.</p></div><section class="ds-u-margin-top--3" data-reactid="16"><div class="markup markup--html" data-reactid="17"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="18"><p class="ds-u-truncate" title="We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.">We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.</p></div><details class="ds-u-margin-bottom--2" data-reactid="19"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="20">Code snippet</summary><pre class="language-markup" data-reactid="21"><code data-reactid="22"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-truncate<span class="token punctuation">"</span></span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Truncate","description":"<p>Use the truncate utility to limit a text string to one line.</p>\n<h3 id=\"accessibility\">Accessibility</h3>\n<p>Place the full text in a <code>title</code> attribute so that it’s accessible on hover.</p>","reference":"utilities.truncate","referenceNumber":"2.19","referenceURI":"design-system/utilities/truncate","weight":0,"markup":"<p class=\"ds-u-truncate\" title=\"{{lorem-l}}\">{{lorem-l}}</p>","source":{"filename":"utilities/truncate.scss","path":"packages/core/src/utilities/truncate.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Truncate","description":"<p>Use the truncate utility to limit a text string to one line.</p>\n<h3 id=\"accessibility\">Accessibility</h3>\n<p>Place the full text in a <code>title</code> attribute so that it’s accessible on hover.</p>","reference":"utilities.truncate","referenceNumber":"2.20","referenceURI":"design-system/utilities/truncate","weight":0,"markup":"<p class=\"ds-u-truncate\" title=\"{{lorem-l}}\">{{lorem-l}}</p>","source":{"filename":"utilities/truncate.scss","path":"packages/core/src/utilities/truncate.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/docs/utilities/vertical-align/index.html b/docs/utilities/vertical-align/index.html
index 9538e00ce3..b084113aa4 100644
--- a/docs/utilities/vertical-align/index.html
+++ b/docs/utilities/vertical-align/index.html
@@ -2,15 +2,15 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Vertical align - CMSgov Design System</title>
+  <title>Vertical align - CMS.gov Design System</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/design-system/public/styles/docs.css" />
 </head>
 <body class="ds-base">
   <div id="js-root">
-    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1190286495"><header class="ds-base--inverse" data-reactid="2"><div class="ds-u-fill--warn-lightest ds-base ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-size--small" data-reactid="3"><strong data-reactid="4">Alpha status</strong><!-- react-text: 5 -->: The design system is under active development and working towards a 1.0 release.<!-- /react-text --></div></header><div class="l-grid" data-reactid="6"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="7"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="8"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="9"><div data-reactid="10"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="11"><h1 class="ds-display" id="utilities.vertical-align" data-reactid="12">Vertical align</h1><div class="ds-u-clearfix" data-reactid="13"></div><code class="ds-u-font-size--small" data-reactid="14">utilities/vertical-align.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="15"><article class="ds-u-margin-y--6 l-content" data-reactid="16"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="17"><p>Use the vertical align utility on inline-level elements (<code>inline</code> and <code>inline-block</code>) and on table cells.</p>
-<p><strong>Format</strong>: <code>ds-u-valign--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="18"><div class="markup markup--html" data-reactid="19"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="20"><table>
+    <div><div data-reactroot="" data-reactid="1" data-react-checksum="-1862770939"><header class="ds-base--inverse ds-u-padding--3" data-reactid="2"><h1 class="ds-h3" data-reactid="3">CMS.gov Design System</h1></header><div class="l-grid" data-reactid="4"><nav class="l-col-3 l-sidebar ds-u-border-right--1 ds-u-padding--2" data-reactid="5"><ul class="ds-c-vertical-nav c-nav__list" data-reactid="6"></ul></nav><main class="l-col-9 l-col-grow" data-reactid="7"><div data-reactid="8"><heading class="ds-u-padding--6 ds-u-display--block ds-u-fill--gray-lightest" data-reactid="9"><h1 class="ds-display" id="utilities.vertical-align" data-reactid="10">Vertical align</h1><div class="ds-u-clearfix" data-reactid="11"></div><code class="ds-u-font-size--small" data-reactid="12">utilities/vertical-align.scss</code></heading><div class="ds-u-border-top--1 ds-u-padding-x--6" data-reactid="13"><article class="ds-u-margin-y--6 l-content" data-reactid="14"><div class="c-details ds-u-margin-top--2 ds-u-measure--wide" data-reactid="15"><p>Use the vertical align utility on inline-level elements (<code>inline</code> and <code>inline-block</code>) and on table cells.</p>
+<p><strong>Format</strong>: <code>ds-u-valign--[VALUE]</code></p></div><section class="ds-u-margin-top--3" data-reactid="16"><div class="markup markup--html" data-reactid="17"><div class="ds-u-border--1 ds-u-padding--1" data-reactid="18"><table>
   <tbody>
     <tr>
       <td class="ds-u-font-size--title ds-u-leading--reset">A</td>
@@ -25,7 +25,7 @@
       <td class="ds-u-valign--bottom">Bottom alignment</td>
     </tr>
   </tbody>
-</table></div><details class="ds-u-margin-bottom--2" data-reactid="21"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="22">Code snippet</summary><pre class="language-markup" data-reactid="23"><code data-reactid="24"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>table</span><span class="token punctuation">></span></span>
+</table></div><details class="ds-u-margin-bottom--2" data-reactid="19"><summary class="ds-u-margin-y--1 ds-c-button ds-c-button--transparent ds-u-padding--1" data-reactid="20">Code snippet</summary><pre class="language-markup" data-reactid="21"><code data-reactid="22"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>table</span><span class="token punctuation">></span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tbody</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tr</span><span class="token punctuation">></span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>ds-u-font-size--title ds-u-leading--reset<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>A<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">></span></span>
@@ -43,8 +43,8 @@
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>table</span><span class="token punctuation">></span></span></code></pre></details></div></section></article></div></div></main></div></div></div>
   </div>
   <script type="text/javascript">
-    var page = {"header":"Vertical align","description":"<p>Use the vertical align utility on inline-level elements (<code>inline</code> and <code>inline-block</code>) and on table cells.</p>\n<p><strong>Format</strong>: <code>ds-u-valign--[VALUE]</code></p>","reference":"utilities.vertical-align","referenceNumber":"2.20","referenceURI":"design-system/utilities/vertical-align","weight":0,"markup":"<table>\n  <tbody>\n    <tr>\n      <td class=\"ds-u-font-size--title ds-u-leading--reset\">A</td>\n      <td class=\"ds-u-valign--top\">Top alignment</td>\n    </tr>\n    <tr>\n      <td class=\"ds-u-font-size--title ds-u-leading--reset\">B</td>\n      <td class=\"ds-u-valign--middle\">Middle alignment</td>\n    </tr>\n    <tr>\n      <td class=\"ds-u-font-size--title ds-u-leading--reset\">C</td>\n      <td class=\"ds-u-valign--bottom\">Bottom alignment</td>\n    </tr>\n  </tbody>\n</table>","source":{"filename":"utilities/vertical-align.scss","path":"packages/core/src/utilities/vertical-align.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
-    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/visibility","items":null,"label":"Visibility","url":"/design-system/utilities/visibility","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
+    var page = {"header":"Vertical align","description":"<p>Use the vertical align utility on inline-level elements (<code>inline</code> and <code>inline-block</code>) and on table cells.</p>\n<p><strong>Format</strong>: <code>ds-u-valign--[VALUE]</code></p>","reference":"utilities.vertical-align","referenceNumber":"2.21","referenceURI":"design-system/utilities/vertical-align","weight":0,"markup":"<table>\n  <tbody>\n    <tr>\n      <td class=\"ds-u-font-size--title ds-u-leading--reset\">A</td>\n      <td class=\"ds-u-valign--top\">Top alignment</td>\n    </tr>\n    <tr>\n      <td class=\"ds-u-font-size--title ds-u-leading--reset\">B</td>\n      <td class=\"ds-u-valign--middle\">Middle alignment</td>\n    </tr>\n    <tr>\n      <td class=\"ds-u-font-size--title ds-u-leading--reset\">C</td>\n      <td class=\"ds-u-valign--bottom\">Bottom alignment</td>\n    </tr>\n  </tbody>\n</table>","source":{"filename":"utilities/vertical-align.scss","path":"packages/core/src/utilities/vertical-align.scss"},"depth":2,"modifiers":[],"sections":[],"parentReference":"utilities"};
+    var routes = [{"defaultCollapsed":true,"id":"design-system/","label":"Getting started","url":"/design-system/","weight":-100},{"defaultCollapsed":true,"items":[{"defaultCollapsed":true,"id":"design-system/guidelines/code-conventions","items":null,"label":"Code conventions","url":"/design-system/guidelines/code-conventions","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/forms","items":null,"label":"Forms","url":"/design-system/guidelines/forms","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/grid","items":null,"label":"Grid layout","url":"/design-system/guidelines/grid","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/i18n","items":null,"label":"Internationalization","url":"/design-system/guidelines/i18n","weight":0},{"defaultCollapsed":true,"id":"design-system/guidelines/responsive","items":null,"label":"Responsive design","url":"/design-system/guidelines/responsive","weight":10}],"label":"Guidelines","weight":5},{"defaultCollapsed":true,"id":"design-system/base","items":[{"defaultCollapsed":true,"id":"design-system/base/typography","items":null,"label":"Typography","url":"/design-system/base/typography","weight":0}],"label":"Base","url":"/design-system/base","weight":10},{"defaultCollapsed":true,"id":"design-system/utilities","items":[{"defaultCollapsed":true,"id":"design-system/utilities/background-color","items":null,"label":"Background color","url":"/design-system/utilities/background-color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border","items":null,"label":"Border","url":"/design-system/utilities/border","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/border-radius","items":null,"label":"Border radius","url":"/design-system/utilities/border-radius","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/clearfix","items":null,"label":"Clearfix","url":"/design-system/utilities/clearfix","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/color","items":null,"label":"Color","url":"/design-system/utilities/color","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/display-visibility","items":null,"label":"Display/Visibility","url":"/design-system/utilities/display-visibility","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/float","items":null,"label":"Float","url":"/design-system/utilities/float","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-family","items":null,"label":"Font familiy","url":"/design-system/utilities/font-family","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-size","items":null,"label":"Font size","url":"/design-system/utilities/font-size","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-style","items":null,"label":"Font style","url":"/design-system/utilities/font-style","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/font-weight","items":null,"label":"Font weight","url":"/design-system/utilities/font-weight","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/line-height","items":null,"label":"Line height","url":"/design-system/utilities/line-height","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/margin","items":null,"label":"Margin","url":"/design-system/utilities/margin","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/measure","items":null,"label":"Measure","url":"/design-system/utilities/measure","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/overflow","items":null,"label":"Overflow","url":"/design-system/utilities/overflow","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/padding","items":null,"label":"Padding","url":"/design-system/utilities/padding","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-align","items":null,"label":"Text alignment","url":"/design-system/utilities/text-align","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-decoration","items":null,"label":"Text decoration","url":"/design-system/utilities/text-decoration","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/text-transform","items":null,"label":"Text transform","url":"/design-system/utilities/text-transform","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/truncate","items":null,"label":"Truncate","url":"/design-system/utilities/truncate","weight":0},{"defaultCollapsed":true,"id":"design-system/utilities/vertical-align","items":null,"label":"Vertical align","url":"/design-system/utilities/vertical-align","weight":0}],"label":"Utilities","url":"/design-system/utilities","weight":20},{"defaultCollapsed":true,"id":"design-system/components","items":[{"defaultCollapsed":true,"id":"design-system/components/alert","items":null,"label":"Alert","url":"/design-system/components/alert","weight":0},{"defaultCollapsed":true,"id":"design-system/components/badge","items":null,"label":"Badge","url":"/design-system/components/badge","weight":0},{"defaultCollapsed":true,"id":"design-system/components/button","items":null,"label":"Button","url":"/design-system/components/button","weight":0},{"defaultCollapsed":true,"id":"design-system/components/choice","items":null,"label":"Checkbox & Radio","url":"/design-system/components/choice","weight":0},{"defaultCollapsed":true,"id":"design-system/components/list","items":null,"label":"List","url":"/design-system/components/list","weight":0},{"defaultCollapsed":true,"id":"design-system/components/select","items":null,"label":"Select","url":"/design-system/components/select","weight":0},{"defaultCollapsed":true,"id":"design-system/components/table","items":null,"label":"Table","url":"/design-system/components/table","weight":0},{"defaultCollapsed":true,"id":"design-system/components/tabs","items":null,"label":"Tabs","url":"/design-system/components/tabs","weight":0},{"defaultCollapsed":true,"id":"design-system/components/text-field","items":null,"label":"Text field","url":"/design-system/components/text-field","weight":0},{"defaultCollapsed":true,"id":"design-system/components/vertical-nav","items":null,"label":"Vertical navigation","url":"/design-system/components/vertical-nav","weight":0}],"label":"Components","url":"/design-system/components","weight":30}];
   </script>
   <script src="/design-system/public/scripts/index.js"></script>
 </body>
diff --git a/examples/react-app/package.json b/examples/react-app/package.json
index 2b36022b56..ea3f27d883 100644
--- a/examples/react-app/package.json
+++ b/examples/react-app/package.json
@@ -3,13 +3,13 @@
   "version": "1.0.0",
   "private": true,
   "dependencies": {
-    "@cmsgov/design-system-core": "^1.0.0-alpha",
-    "react": "^15.5.4",
-    "react-dom": "^15.5.4"
+    "@cmsgov/design-system-core": "latest",
+    "react": "^15.6.1",
+    "react-dom": "^15.6.1"
   },
   "devDependencies": {
-    "babel-core": "^6.24.1",
-    "babel-loader": "^7.0.0-beta.1",
+    "babel-core": "^6.25.0",
+    "babel-loader": "^7.1.1",
     "babel-preset-es2015": "^6.24.1",
     "babel-preset-react": "^6.24.1",
     "gulp": "^3.9.1",
diff --git a/examples/react-app/yarn.lock b/examples/react-app/yarn.lock
index a1d1f367a1..67d8e78c1f 100644
--- a/examples/react-app/yarn.lock
+++ b/examples/react-app/yarn.lock
@@ -2,15 +2,24 @@
 # yarn lockfile v1
 
 
-"@cmsgov/design-system-core@^1.0.0-alpha":
-  version "1.0.0-alpha.4"
-  resolved "https://registry.yarnpkg.com/@cmsgov/design-system-core/-/design-system-core-1.0.0-alpha.4.tgz#1b8784719439f93a560a582d907c173d0b7e2169"
+"@cmsgov/design-system-core@latest":
+  version "1.0.0-alpha.11"
+  resolved "https://registry.yarnpkg.com/@cmsgov/design-system-core/-/design-system-core-1.0.0-alpha.11.tgz#cad8da71a7454ef4deab49ba560833791bd536ee"
   dependencies:
     bourbon "^4.3.3"
     classnames "^2.2.5"
-    react "^15.4.2"
-    react-dom "^15.4.2"
-    uswds "^1.0.0"
+    lodash.uniqueid "^4.0.1"
+    prop-types "^15.5.10"
+    react "^15.6.1"
+    react-dom "^15.6.1"
+    uswds "^1.2.1"
+
+JSONStream@^1.0.3:
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/JSONStream/-/JSONStream-1.3.1.tgz#707f761e01dae9e16f1bcf93703b78c70966579a"
+  dependencies:
+    jsonparse "^1.2.0"
+    through ">=2.2.7 <3"
 
 abbrev@1:
   version "1.1.0"
@@ -89,10 +98,30 @@ array-differ@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/array-differ/-/array-differ-1.0.0.tgz#eff52e3758249d33be402b8bb8e564bb2b5d4031"
 
+array-filter@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/array-filter/-/array-filter-1.0.0.tgz#baf79e62e6ef4c2a4c0b831232daffec251f9d83"
+
+array-filter@~0.0.0:
+  version "0.0.1"
+  resolved "https://registry.yarnpkg.com/array-filter/-/array-filter-0.0.1.tgz#7da8cf2e26628ed732803581fd21f67cacd2eeec"
+
 array-find-index@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/array-find-index/-/array-find-index-1.0.2.tgz#df010aa1287e164bbda6f9723b0a96a1ec4187a1"
 
+array-foreach@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/array-foreach/-/array-foreach-1.0.2.tgz#cd36e42f0f482108c406b35c3612a8970b2fccea"
+
+array-map@~0.0.0:
+  version "0.0.0"
+  resolved "https://registry.yarnpkg.com/array-map/-/array-map-0.0.0.tgz#88a2bab73d1cf7bcd5c1b118a003f66f665fa662"
+
+array-reduce@~0.0.0:
+  version "0.0.0"
+  resolved "https://registry.yarnpkg.com/array-reduce/-/array-reduce-0.0.0.tgz#173899d3ffd1c7d9383e4479525dbe278cab5f2b"
+
 array-uniq@^1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/array-uniq/-/array-uniq-1.0.3.tgz#af6ac877a25cc7f74e058894753858dfdb24fdb6"
@@ -129,12 +158,18 @@ assert-plus@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/assert-plus/-/assert-plus-0.2.0.tgz#d74e1b87e7affc0db8aadb7021f3fe48101ab234"
 
-assert@^1.1.1:
+assert@^1.1.1, assert@^1.4.0:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/assert/-/assert-1.4.1.tgz#99912d591836b5a6f5b345c0f07eefc08fc65d91"
   dependencies:
     util "0.10.3"
 
+astw@^2.0.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/astw/-/astw-2.2.0.tgz#7bd41784d32493987aeb239b6b4e1c57a873b917"
+  dependencies:
+    acorn "^4.0.3"
+
 async-each@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/async-each/-/async-each-1.0.1.tgz#19d386a1d9edc6e7c1c85d388aedbcc56d33602d"
@@ -169,20 +204,20 @@ babel-code-frame@^6.22.0:
     esutils "^2.0.2"
     js-tokens "^3.0.0"
 
-babel-core@^6.24.1:
-  version "6.24.1"
-  resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-6.24.1.tgz#8c428564dce1e1f41fb337ec34f4c3b022b5ad83"
+babel-core@^6.24.1, babel-core@^6.25.0:
+  version "6.25.0"
+  resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-6.25.0.tgz#7dd42b0463c742e9d5296deb3ec67a9322dad729"
   dependencies:
     babel-code-frame "^6.22.0"
-    babel-generator "^6.24.1"
+    babel-generator "^6.25.0"
     babel-helpers "^6.24.1"
     babel-messages "^6.23.0"
     babel-register "^6.24.1"
     babel-runtime "^6.22.0"
-    babel-template "^6.24.1"
-    babel-traverse "^6.24.1"
-    babel-types "^6.24.1"
-    babylon "^6.11.0"
+    babel-template "^6.25.0"
+    babel-traverse "^6.25.0"
+    babel-types "^6.25.0"
+    babylon "^6.17.2"
     convert-source-map "^1.1.0"
     debug "^2.1.1"
     json5 "^0.5.0"
@@ -193,13 +228,13 @@ babel-core@^6.24.1:
     slash "^1.0.0"
     source-map "^0.5.0"
 
-babel-generator@^6.24.1:
-  version "6.24.1"
-  resolved "https://registry.yarnpkg.com/babel-generator/-/babel-generator-6.24.1.tgz#e715f486c58ded25649d888944d52aa07c5d9497"
+babel-generator@^6.25.0:
+  version "6.25.0"
+  resolved "https://registry.yarnpkg.com/babel-generator/-/babel-generator-6.25.0.tgz#33a1af70d5f2890aeb465a4a7793c1df6a9ea9fc"
   dependencies:
     babel-messages "^6.23.0"
     babel-runtime "^6.22.0"
-    babel-types "^6.24.1"
+    babel-types "^6.25.0"
     detect-indent "^4.0.0"
     jsesc "^1.3.0"
     lodash "^4.2.0"
@@ -289,11 +324,11 @@ babel-helpers@^6.24.1:
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-loader@^7.0.0-beta.1:
-  version "7.0.0-beta.1"
-  resolved "https://registry.yarnpkg.com/babel-loader/-/babel-loader-7.0.0-beta.1.tgz#1318888dfcbbd5f05750ba2d72c744cc07815ce2"
+babel-loader@^7.1.1:
+  version "7.1.1"
+  resolved "https://registry.yarnpkg.com/babel-loader/-/babel-loader-7.1.1.tgz#b87134c8b12e3e4c2a94e0546085bc680a2b8488"
   dependencies:
-    find-cache-dir "^0.1.1"
+    find-cache-dir "^1.0.0"
     loader-utils "^1.0.2"
     mkdirp "^0.5.1"
 
@@ -608,6 +643,16 @@ babel-template@^6.24.1:
     babylon "^6.11.0"
     lodash "^4.2.0"
 
+babel-template@^6.25.0:
+  version "6.25.0"
+  resolved "https://registry.yarnpkg.com/babel-template/-/babel-template-6.25.0.tgz#665241166b7c2aa4c619d71e192969552b10c071"
+  dependencies:
+    babel-runtime "^6.22.0"
+    babel-traverse "^6.25.0"
+    babel-types "^6.25.0"
+    babylon "^6.17.2"
+    lodash "^4.2.0"
+
 babel-traverse@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-traverse/-/babel-traverse-6.24.1.tgz#ab36673fd356f9a0948659e7b338d5feadb31695"
@@ -622,6 +667,20 @@ babel-traverse@^6.24.1:
     invariant "^2.2.0"
     lodash "^4.2.0"
 
+babel-traverse@^6.25.0:
+  version "6.25.0"
+  resolved "https://registry.yarnpkg.com/babel-traverse/-/babel-traverse-6.25.0.tgz#2257497e2fcd19b89edc13c4c91381f9512496f1"
+  dependencies:
+    babel-code-frame "^6.22.0"
+    babel-messages "^6.23.0"
+    babel-runtime "^6.22.0"
+    babel-types "^6.25.0"
+    babylon "^6.17.2"
+    debug "^2.2.0"
+    globals "^9.0.0"
+    invariant "^2.2.0"
+    lodash "^4.2.0"
+
 babel-types@^6.19.0, babel-types@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.24.1.tgz#a136879dc15b3606bda0d90c1fc74304c2ff0975"
@@ -631,10 +690,23 @@ babel-types@^6.19.0, babel-types@^6.24.1:
     lodash "^4.2.0"
     to-fast-properties "^1.0.1"
 
+babel-types@^6.25.0:
+  version "6.25.0"
+  resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.25.0.tgz#70afb248d5660e5d18f811d91c8303b54134a18e"
+  dependencies:
+    babel-runtime "^6.22.0"
+    esutils "^2.0.2"
+    lodash "^4.2.0"
+    to-fast-properties "^1.0.1"
+
 babylon@^6.11.0, babylon@^6.15.0:
   version "6.16.1"
   resolved "https://registry.yarnpkg.com/babylon/-/babylon-6.16.1.tgz#30c5a22f481978a9e7f8cdfdf496b11d94b404d3"
 
+babylon@^6.17.2:
+  version "6.17.4"
+  resolved "https://registry.yarnpkg.com/babylon/-/babylon-6.17.4.tgz#3e8b7402b88d22c3423e137a1577883b15ff869a"
+
 balanced-match@^0.4.1:
   version "0.4.2"
   resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-0.4.2.tgz#cb3f3e3c732dc0f01ee70b403f302e61d7709838"
@@ -677,11 +749,7 @@ boom@2.x.x:
   dependencies:
     hoek "2.x.x"
 
-"bourbon-neat@https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz":
-  version "1.8.0"
-  resolved "https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz#cac50f0721b9caa6d184e05133c7c75283ff4446"
-
-bourbon@^4.2.6, bourbon@^4.3.3:
+bourbon@^4.3.3:
   version "4.3.4"
   resolved "https://registry.yarnpkg.com/bourbon/-/bourbon-4.3.4.tgz#4da380029e92c0c8f9764c779451a134b11e7cc3"
 
@@ -704,6 +772,22 @@ brorand@^1.0.1:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/brorand/-/brorand-1.1.0.tgz#12c25efe40a45e3c323eb8675a0a0ce57b22371f"
 
+browser-pack@^6.0.1:
+  version "6.0.2"
+  resolved "https://registry.yarnpkg.com/browser-pack/-/browser-pack-6.0.2.tgz#f86cd6cef4f5300c8e63e07a4d512f65fbff4531"
+  dependencies:
+    JSONStream "^1.0.3"
+    combine-source-map "~0.7.1"
+    defined "^1.0.0"
+    through2 "^2.0.0"
+    umd "^3.0.0"
+
+browser-resolve@^1.11.0, browser-resolve@^1.7.0:
+  version "1.11.2"
+  resolved "https://registry.yarnpkg.com/browser-resolve/-/browser-resolve-1.11.2.tgz#8ff09b0a2c421718a1051c260b32e48f442938ce"
+  dependencies:
+    resolve "1.1.7"
+
 browserify-aes@^1.0.0, browserify-aes@^1.0.4:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/browserify-aes/-/browserify-aes-1.0.6.tgz#5e7725dbdef1fd5930d4ebab48567ce451c48a0a"
@@ -749,12 +833,64 @@ browserify-sign@^4.0.0:
     inherits "^2.0.1"
     parse-asn1 "^5.0.0"
 
-browserify-zlib@^0.1.4:
+browserify-zlib@^0.1.4, browserify-zlib@~0.1.2:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/browserify-zlib/-/browserify-zlib-0.1.4.tgz#bb35f8a519f600e0fa6b8485241c979d0141fb2d"
   dependencies:
     pako "~0.2.0"
 
+browserify@^13.0.0:
+  version "13.3.0"
+  resolved "https://registry.yarnpkg.com/browserify/-/browserify-13.3.0.tgz#b5a9c9020243f0c70e4675bec8223bc627e415ce"
+  dependencies:
+    JSONStream "^1.0.3"
+    assert "^1.4.0"
+    browser-pack "^6.0.1"
+    browser-resolve "^1.11.0"
+    browserify-zlib "~0.1.2"
+    buffer "^4.1.0"
+    cached-path-relative "^1.0.0"
+    concat-stream "~1.5.1"
+    console-browserify "^1.1.0"
+    constants-browserify "~1.0.0"
+    crypto-browserify "^3.0.0"
+    defined "^1.0.0"
+    deps-sort "^2.0.0"
+    domain-browser "~1.1.0"
+    duplexer2 "~0.1.2"
+    events "~1.1.0"
+    glob "^7.1.0"
+    has "^1.0.0"
+    htmlescape "^1.1.0"
+    https-browserify "~0.0.0"
+    inherits "~2.0.1"
+    insert-module-globals "^7.0.0"
+    labeled-stream-splicer "^2.0.0"
+    module-deps "^4.0.8"
+    os-browserify "~0.1.1"
+    parents "^1.0.1"
+    path-browserify "~0.0.0"
+    process "~0.11.0"
+    punycode "^1.3.2"
+    querystring-es3 "~0.2.0"
+    read-only-stream "^2.0.0"
+    readable-stream "^2.0.2"
+    resolve "^1.1.4"
+    shasum "^1.0.0"
+    shell-quote "^1.6.1"
+    stream-browserify "^2.0.0"
+    stream-http "^2.0.0"
+    string_decoder "~0.10.0"
+    subarg "^1.0.0"
+    syntax-error "^1.1.1"
+    through2 "^2.0.0"
+    timers-browserify "^1.0.1"
+    tty-browserify "~0.0.0"
+    url "~0.11.0"
+    util "~0.10.1"
+    vm-browserify "~0.0.1"
+    xtend "^4.0.0"
+
 buffer-shims@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/buffer-shims/-/buffer-shims-1.0.0.tgz#9978ce317388c649ad8793028c3477ef044a8b51"
@@ -763,7 +899,7 @@ buffer-xor@^1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/buffer-xor/-/buffer-xor-1.0.3.tgz#26e61ed1422fb70dd42e6e36729ed51d855fe8d9"
 
-buffer@^4.3.0:
+buffer@^4.1.0, buffer@^4.3.0:
   version "4.9.1"
   resolved "https://registry.yarnpkg.com/buffer/-/buffer-4.9.1.tgz#6d1bb601b07a4efced97094132093027c95bc298"
   dependencies:
@@ -779,6 +915,10 @@ builtin-status-codes@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz#85982878e21b98e1c66425e03d0174788f569ee8"
 
+cached-path-relative@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/cached-path-relative/-/cached-path-relative-1.0.1.tgz#d09c4b52800aa4c078e2dd81a869aac90d2e54e7"
+
 camelcase-keys@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/camelcase-keys/-/camelcase-keys-2.1.0.tgz#308beeaffdf28119051efa1d932213c91b8f92e7"
@@ -884,6 +1024,15 @@ code-point-at@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/code-point-at/-/code-point-at-1.1.0.tgz#0d070b4d043a5bea33a2f1a40e2edb3d9a4ccf77"
 
+combine-source-map@~0.7.1:
+  version "0.7.2"
+  resolved "https://registry.yarnpkg.com/combine-source-map/-/combine-source-map-0.7.2.tgz#0870312856b307a87cc4ac486f3a9a62aeccc09e"
+  dependencies:
+    convert-source-map "~1.1.0"
+    inline-source-map "~0.6.0"
+    lodash.memoize "~3.0.3"
+    source-map "~0.5.3"
+
 combined-stream@^1.0.5, combined-stream@~1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.5.tgz#938370a57b4a51dea2c77c15d5c5fdf895164009"
@@ -898,13 +1047,13 @@ concat-map@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
 
-concat-stream@^1.4.7:
-  version "1.6.0"
-  resolved "https://registry.yarnpkg.com/concat-stream/-/concat-stream-1.6.0.tgz#0aac662fd52be78964d5532f694784e70110acf7"
+concat-stream@~1.5.0, concat-stream@~1.5.1:
+  version "1.5.2"
+  resolved "https://registry.yarnpkg.com/concat-stream/-/concat-stream-1.5.2.tgz#708978624d856af41a5a741defdd261da752c266"
   dependencies:
-    inherits "^2.0.3"
-    readable-stream "^2.2.2"
-    typedarray "^0.0.6"
+    inherits "~2.0.1"
+    readable-stream "~2.0.0"
+    typedarray "~0.0.5"
 
 console-browserify@^1.1.0:
   version "1.1.0"
@@ -916,13 +1065,13 @@ console-control-strings@^1.0.0, console-control-strings@~1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/console-control-strings/-/console-control-strings-1.1.0.tgz#3d7cf4464db6446ea644bf4b39507f9851008e8e"
 
-constants-browserify@^1.0.0:
+constants-browserify@^1.0.0, constants-browserify@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/constants-browserify/-/constants-browserify-1.0.0.tgz#c20b96d8c617748aaf1c16021760cd27fcb8cb75"
 
-convert-source-map@^1.1.0:
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.5.0.tgz#9acd70851c6d5dfdd93d9282e5edf94a03ff46b5"
+convert-source-map@^1.1.0, convert-source-map@~1.1.0:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.1.3.tgz#4829c877e9fe49b3161f3bf3673888e204699860"
 
 core-js@^1.0.0:
   version "1.2.7"
@@ -959,19 +1108,13 @@ create-hmac@^1.1.0, create-hmac@^1.1.2:
     create-hash "^1.1.0"
     inherits "^2.0.1"
 
-cross-spawn-async@^2.2.2:
-  version "2.2.5"
-  resolved "https://registry.yarnpkg.com/cross-spawn-async/-/cross-spawn-async-2.2.5.tgz#845ff0c0834a3ded9d160daca6d390906bb288cc"
-  dependencies:
-    lru-cache "^4.0.0"
-    which "^1.2.8"
-
-cross-spawn@^2.1.5:
-  version "2.2.3"
-  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-2.2.3.tgz#fac56202dfd3d0dd861778f2da203bf434bb821c"
+create-react-class@^15.6.0:
+  version "15.6.0"
+  resolved "https://registry.yarnpkg.com/create-react-class/-/create-react-class-15.6.0.tgz#ab448497c26566e1e29413e883207d57cfe7bed4"
   dependencies:
-    cross-spawn-async "^2.2.2"
-    spawn-sync "^1.0.15"
+    fbjs "^0.8.9"
+    loose-envify "^1.3.1"
+    object-assign "^4.1.1"
 
 cross-spawn@^3.0.0:
   version "3.0.1"
@@ -986,7 +1129,7 @@ cryptiles@2.x.x:
   dependencies:
     boom "2.x.x"
 
-crypto-browserify@^3.11.0:
+crypto-browserify@^3.0.0, crypto-browserify@^3.11.0:
   version "3.11.0"
   resolved "https://registry.yarnpkg.com/crypto-browserify/-/crypto-browserify-3.11.0.tgz#3652a0906ab9b2a7e0c3ce66a408e957a2485522"
   dependencies:
@@ -1041,6 +1184,10 @@ defaults@^1.0.0:
   dependencies:
     clone "^1.0.2"
 
+defined@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/defined/-/defined-1.0.0.tgz#c98d9bcef75674188e110969151199e39b1fa693"
+
 delayed-stream@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619"
@@ -1053,6 +1200,15 @@ deprecated@^0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/deprecated/-/deprecated-0.0.1.tgz#f9c9af5464afa1e7a971458a8bdef2aa94d5bb19"
 
+deps-sort@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/deps-sort/-/deps-sort-2.0.0.tgz#091724902e84658260eb910748cccd1af6e21fb5"
+  dependencies:
+    JSONStream "^1.0.3"
+    shasum "^1.0.0"
+    subarg "^1.0.0"
+    through2 "^2.0.0"
+
 des.js@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/des.js/-/des.js-1.0.0.tgz#c074d2e2aa6a8a9a07dbd61f9a15c2cd83ec8ecc"
@@ -1072,6 +1228,13 @@ detect-indent@^4.0.0:
   dependencies:
     repeating "^2.0.0"
 
+detective@^4.0.0:
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/detective/-/detective-4.5.0.tgz#6e5a8c6b26e6c7a254b1c6b6d7490d98ec91edd1"
+  dependencies:
+    acorn "^4.0.3"
+    defined "^1.0.0"
+
 diffie-hellman@^5.0.0:
   version "5.0.2"
   resolved "https://registry.yarnpkg.com/diffie-hellman/-/diffie-hellman-5.0.2.tgz#b5835739270cfe26acf632099fded2a07f209e5e"
@@ -1080,22 +1243,40 @@ diffie-hellman@^5.0.0:
     miller-rabin "^4.0.0"
     randombytes "^2.0.0"
 
-domain-browser@^1.1.1:
+domain-browser@^1.1.1, domain-browser@~1.1.0:
   version "1.1.7"
   resolved "https://registry.yarnpkg.com/domain-browser/-/domain-browser-1.1.7.tgz#867aa4b093faa05f1de08c06f4d7b21fdf8698bc"
 
+domready@^1.0.8:
+  version "1.0.8"
+  resolved "https://registry.yarnpkg.com/domready/-/domready-1.0.8.tgz#91f252e597b65af77e745ae24dd0185d5e26d58c"
+
 duplexer2@0.0.2:
   version "0.0.2"
   resolved "https://registry.yarnpkg.com/duplexer2/-/duplexer2-0.0.2.tgz#c614dcf67e2fb14995a91711e5a617e8a60a31db"
   dependencies:
     readable-stream "~1.1.9"
 
+duplexer2@^0.1.2, duplexer2@~0.1.0, duplexer2@~0.1.2:
+  version "0.1.4"
+  resolved "https://registry.yarnpkg.com/duplexer2/-/duplexer2-0.1.4.tgz#8b12dab878c0d69e3e7891051662a32fc6bddcc1"
+  dependencies:
+    readable-stream "^2.0.2"
+
 ecc-jsbn@~0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz#0fc73a9ed5f0d53c38193398523ef7e543777505"
   dependencies:
     jsbn "~0.1.0"
 
+elem-dataset@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/elem-dataset/-/elem-dataset-1.1.1.tgz#18f07fa7fc71ebd49b0f9f63819cb03c8276577a"
+
+element-closest@^2.0.1:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/element-closest/-/element-closest-2.0.2.tgz#72a740a107453382e28df9ce5dbb5a8df0f966ec"
+
 elliptic@^6.0.0:
   version "6.4.0"
   resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.4.0.tgz#cac9af8762c85836187003c8dfe193e5e2eae5df"
@@ -1153,7 +1334,7 @@ esutils@^2.0.0, esutils@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.2.tgz#0abf4f1caa5bcb1f7a9d8acc6dea4faaa04bac9b"
 
-events@^1.0.0:
+events@^1.0.0, events@~1.1.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/events/-/events-1.1.1.tgz#9ebdb7635ad099c70dcc4c2a1f5004288e8bd924"
 
@@ -1228,13 +1409,13 @@ fill-range@^2.1.0:
     repeat-element "^1.1.2"
     repeat-string "^1.5.2"
 
-find-cache-dir@^0.1.1:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/find-cache-dir/-/find-cache-dir-0.1.1.tgz#c8defae57c8a52a8a784f9e31c57c742e993a0b9"
+find-cache-dir@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/find-cache-dir/-/find-cache-dir-1.0.0.tgz#9288e3e9e3cc3748717d39eade17cf71fc30ee6f"
   dependencies:
     commondir "^1.0.1"
-    mkdirp "^0.5.1"
-    pkg-dir "^1.0.0"
+    make-dir "^1.0.0"
+    pkg-dir "^2.0.0"
 
 find-index@^0.1.1:
   version "0.1.1"
@@ -1247,6 +1428,12 @@ find-up@^1.0.0:
     path-exists "^2.0.0"
     pinkie-promise "^2.0.0"
 
+find-up@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/find-up/-/find-up-2.1.0.tgz#45d1b7e506c717ddd482775a2b77920a3c0c57a7"
+  dependencies:
+    locate-path "^2.0.0"
+
 findup-sync@^0.4.2:
   version "0.4.3"
   resolved "https://registry.yarnpkg.com/findup-sync/-/findup-sync-0.4.3.tgz#40043929e7bc60adf0b7f4827c4c6e75a0deca12"
@@ -1330,6 +1517,10 @@ fstream@^1.0.0, fstream@^1.0.10, fstream@^1.0.2:
     mkdirp ">=0.5 0"
     rimraf "2"
 
+function-bind@^1.0.2:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.0.tgz#16176714c801798e4e8f2cf7f7529467bb4a5771"
+
 gauge@~2.7.1:
   version "2.7.3"
   resolved "https://registry.yarnpkg.com/gauge/-/gauge-2.7.3.tgz#1c23855f962f17b3ad3d0dc7443f304542edfe09"
@@ -1414,7 +1605,7 @@ glob@^4.3.1:
     minimatch "^2.0.1"
     once "^1.3.0"
 
-glob@^7.0.0, glob@^7.0.3, glob@^7.0.5, glob@~7.1.1:
+glob@^7.0.0, glob@^7.0.3, glob@^7.0.5, glob@^7.1.0, glob@~7.1.1:
   version "7.1.1"
   resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.1.tgz#805211df04faaf1c63a3600306cdf5ade50b2ec8"
   dependencies:
@@ -1577,6 +1768,12 @@ has-unicode@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/has-unicode/-/has-unicode-2.0.1.tgz#e0e6fe6a28cf51138855e086d1691e771de2a8b9"
 
+has@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/has/-/has-1.0.1.tgz#8461733f538b0837c9361e39a9ab9e9704dc2f28"
+  dependencies:
+    function-bind "^1.0.2"
+
 hash.js@^1.0.0, hash.js@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/hash.js/-/hash.js-1.0.3.tgz#1332ff00156c0a0ffdd8236013d07b77a0451573"
@@ -1621,6 +1818,10 @@ hosted-git-info@^2.1.4:
   version "2.4.1"
   resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.4.1.tgz#4b0445e41c004a8bd1337773a4ff790ca40318c8"
 
+htmlescape@^1.1.0:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/htmlescape/-/htmlescape-1.1.1.tgz#3a03edc2214bca3b66424a3e7959349509cb0351"
+
 http-signature@~1.1.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/http-signature/-/http-signature-1.1.1.tgz#df72e267066cd0ac67fb76adf8e134a8fbcf91bf"
@@ -1629,7 +1830,7 @@ http-signature@~1.1.0:
     jsprim "^1.2.2"
     sshpk "^1.7.0"
 
-https-browserify@0.0.1:
+https-browserify@0.0.1, https-browserify@~0.0.0:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/https-browserify/-/https-browserify-0.0.1.tgz#3f91365cabe60b77ed0ebba24b454e3e09d95a82"
 
@@ -1666,7 +1867,7 @@ inherits@1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/inherits/-/inherits-1.0.2.tgz#ca4309dadee6b54cc0b8d247e8d7c7a0975bdc9b"
 
-inherits@2, inherits@^2.0.1, inherits@^2.0.3, inherits@~2.0.0, inherits@~2.0.1:
+inherits@2, inherits@^2.0.1, inherits@~2.0.0, inherits@~2.0.1:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.3.tgz#633c2c83e3da42a502f52466022480f4208261de"
 
@@ -1678,6 +1879,25 @@ ini@^1.3.4, ini@~1.3.0:
   version "1.3.4"
   resolved "https://registry.yarnpkg.com/ini/-/ini-1.3.4.tgz#0537cb79daf59b59a1a517dff706c86ec039162e"
 
+inline-source-map@~0.6.0:
+  version "0.6.2"
+  resolved "https://registry.yarnpkg.com/inline-source-map/-/inline-source-map-0.6.2.tgz#f9393471c18a79d1724f863fa38b586370ade2a5"
+  dependencies:
+    source-map "~0.5.3"
+
+insert-module-globals@^7.0.0:
+  version "7.0.1"
+  resolved "https://registry.yarnpkg.com/insert-module-globals/-/insert-module-globals-7.0.1.tgz#c03bf4e01cb086d5b5e5ace8ad0afe7889d638c3"
+  dependencies:
+    JSONStream "^1.0.3"
+    combine-source-map "~0.7.1"
+    concat-stream "~1.5.1"
+    is-buffer "^1.1.0"
+    lexical-scope "^1.2.0"
+    process "~0.11.0"
+    through2 "^2.0.0"
+    xtend "^4.0.0"
+
 interpret@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.0.2.tgz#f4f623f0bb7122f15f5717c8e254b8161b5c5b2d"
@@ -1709,7 +1929,7 @@ is-binary-path@^1.0.0:
   dependencies:
     binary-extensions "^1.0.0"
 
-is-buffer@^1.0.2:
+is-buffer@^1.0.2, is-buffer@^1.1.0:
   version "1.1.5"
   resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-1.1.5.tgz#1f3b26ef613b214b88cbca23cc6c01d87961eecc"
 
@@ -1797,7 +2017,7 @@ is-windows@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/is-windows/-/is-windows-0.2.0.tgz#de1aa6d63ea29dd248737b69f1ff8b8002d2108c"
 
-isarray@0.0.1:
+isarray@0.0.1, isarray@~0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/isarray/-/isarray-0.0.1.tgz#8a18acfca9a8f4177e09abfc6038939b05d1eedf"
 
@@ -1862,6 +2082,12 @@ json-stable-stringify@^1.0.1:
   dependencies:
     jsonify "~0.0.0"
 
+json-stable-stringify@~0.0.0:
+  version "0.0.1"
+  resolved "https://registry.yarnpkg.com/json-stable-stringify/-/json-stable-stringify-0.0.1.tgz#611c23e814db375527df851193db59dd2af27f45"
+  dependencies:
+    jsonify "~0.0.0"
+
 json-stringify-safe@~5.0.1:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz#1296a2d58fd45f19a0f6ce01d65701e2c735b6eb"
@@ -1874,6 +2100,10 @@ jsonify@~0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/jsonify/-/jsonify-0.0.0.tgz#2c74b6ee41d93ca51b7b5aaee8f503631d252a73"
 
+jsonparse@^1.2.0:
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/jsonparse/-/jsonparse-1.3.1.tgz#3f4dae4a91fac315f71062f8521cc239f1366280"
+
 jsprim@^1.2.2:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/jsprim/-/jsprim-1.4.0.tgz#a3b87e40298d8c380552d8cc7628a0bb95a22918"
@@ -1883,12 +2113,24 @@ jsprim@^1.2.2:
     json-schema "0.2.3"
     verror "1.3.6"
 
+keyboardevent-key-polyfill@^1.0.2:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/keyboardevent-key-polyfill/-/keyboardevent-key-polyfill-1.1.0.tgz#8a319d8e45a13172fca56286372f90c1d4c7014c"
+
 kind-of@^3.0.2:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-3.1.0.tgz#475d698a5e49ff5e53d14e3e732429dc8bf4cf47"
   dependencies:
     is-buffer "^1.0.2"
 
+labeled-stream-splicer@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/labeled-stream-splicer/-/labeled-stream-splicer-2.0.0.tgz#a52e1d138024c00b86b1c0c91f677918b8ae0a59"
+  dependencies:
+    inherits "^2.0.1"
+    isarray "~0.0.1"
+    stream-splicer "^2.0.0"
+
 lazy-cache@^1.0.3:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/lazy-cache/-/lazy-cache-1.0.4.tgz#a1d78fc3a50474cb80845d3b3b6e1da49a446e8e"
@@ -1899,6 +2141,12 @@ lcid@^1.0.0:
   dependencies:
     invert-kv "^1.0.0"
 
+lexical-scope@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/lexical-scope/-/lexical-scope-1.2.0.tgz#fcea5edc704a4b3a8796cdca419c3a0afaf22df4"
+  dependencies:
+    astw "^2.0.0"
+
 liftoff@^2.1.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/liftoff/-/liftoff-2.3.0.tgz#a98f2ff67183d8ba7cfaca10548bd7ff0550b385"
@@ -1944,6 +2192,13 @@ loader-utils@^1.0.2:
     emojis-list "^2.0.0"
     json5 "^0.5.0"
 
+locate-path@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-2.0.0.tgz#2b568b265eec944c6d9c0de9c3dbbbca0354cd8e"
+  dependencies:
+    p-locate "^2.0.0"
+    path-exists "^3.0.0"
+
 lodash._basecopy@^3.0.0:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz#8da0e6a876cf344c0ad8a54882111dd3c5c7ca36"
@@ -2034,6 +2289,10 @@ lodash.mapvalues@^4.4.0:
   version "4.6.0"
   resolved "https://registry.yarnpkg.com/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz#1bafa5005de9dd6f4f26668c30ca37230cc9689c"
 
+lodash.memoize@~3.0.3:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-3.0.4.tgz#2dcbd2c287cbc0a55cc42328bd0c736150d53e3f"
+
 lodash.mergewith@^4.6.0:
   version "4.6.0"
   resolved "https://registry.yarnpkg.com/lodash.mergewith/-/lodash.mergewith-4.6.0.tgz#150cf0a16791f5903b8891eab154609274bdea55"
@@ -2067,6 +2326,10 @@ lodash.templatesettings@^3.0.0:
     lodash._reinterpolate "^3.0.0"
     lodash.escape "^3.0.0"
 
+lodash.uniqueid@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/lodash.uniqueid/-/lodash.uniqueid-4.0.1.tgz#3268f26a7c88e4f4b1758d679271814e31fa5b26"
+
 lodash@^4.0.0, lodash@^4.14.0, lodash@^4.2.0:
   version "4.17.4"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.4.tgz#78203a4d1c328ae1d86dca6460e369b57f4055ae"
@@ -2083,7 +2346,7 @@ longest@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/longest/-/longest-1.0.1.tgz#30a0b2da38f73770e8294a0d22e6625ed77d0097"
 
-loose-envify@^1.0.0, loose-envify@^1.1.0:
+loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.3.1.tgz#d1a8ad33fa9ce0e713d65fdd0ac8b748d478c848"
   dependencies:
@@ -2100,13 +2363,19 @@ lru-cache@2:
   version "2.7.3"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-2.7.3.tgz#6d4524e8b955f95d4f5b58851ce21dd72fb4e952"
 
-lru-cache@^4.0.0, lru-cache@^4.0.1:
+lru-cache@^4.0.1:
   version "4.0.2"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-4.0.2.tgz#1d17679c069cda5d040991a09dbc2c0db377e55e"
   dependencies:
     pseudomap "^1.0.1"
     yallist "^2.0.0"
 
+make-dir@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-1.0.0.tgz#97a011751e91dd87cfadef58832ebb04936de978"
+  dependencies:
+    pify "^2.3.0"
+
 map-cache@^0.2.0:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/map-cache/-/map-cache-0.2.2.tgz#c32abd0bd6525d9b051645bb4f26ac5dc98a0dbf"
@@ -2115,6 +2384,10 @@ map-obj@^1.0.0, map-obj@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/map-obj/-/map-obj-1.0.1.tgz#d933ceb9205d82bdcf4886f6742bdc2b4dea146d"
 
+matches-selector@^1.0.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/matches-selector/-/matches-selector-1.2.0.tgz#d1814e7e8f43e69d22ac33c9af727dc884ecf12a"
+
 memory-fs@^0.4.0, memory-fs@~0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/memory-fs/-/memory-fs-0.4.1.tgz#3a9a20b8462523e447cfbc7e8bb80ed667bfc552"
@@ -2213,6 +2486,26 @@ minimist@^1.1.0, minimist@^1.1.3, minimist@^1.2.0:
   dependencies:
     minimist "0.0.8"
 
+module-deps@^4.0.8:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/module-deps/-/module-deps-4.1.1.tgz#23215833f1da13fd606ccb8087b44852dcb821fd"
+  dependencies:
+    JSONStream "^1.0.3"
+    browser-resolve "^1.7.0"
+    cached-path-relative "^1.0.0"
+    concat-stream "~1.5.0"
+    defined "^1.0.0"
+    detective "^4.0.0"
+    duplexer2 "^0.1.2"
+    inherits "^2.0.1"
+    parents "^1.0.0"
+    readable-stream "^2.0.2"
+    resolve "^1.1.3"
+    stream-combiner2 "^1.1.1"
+    subarg "^1.0.0"
+    through2 "^2.0.0"
+    xtend "^4.0.0"
+
 ms@0.7.2:
   version "0.7.2"
   resolved "https://registry.yarnpkg.com/ms/-/ms-0.7.2.tgz#ae25cf2512b3885a1d95d7f037868d8431124765"
@@ -2349,10 +2642,6 @@ normalize-path@^2.0.1:
   dependencies:
     remove-trailing-separator "^1.0.1"
 
-normalize.css@^3.0.3:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/normalize.css/-/normalize.css-3.0.3.tgz#acc00262e235a2caa91363a2e5e3bfa4f8ad05c6"
-
 "npmlog@0 || 1 || 2 || 3 || 4", npmlog@^4.0.0, npmlog@^4.0.2:
   version "4.0.2"
   resolved "https://registry.yarnpkg.com/npmlog/-/npmlog-4.0.2.tgz#d03950e0e78ce1527ba26d2a7592e9348ac3e75f"
@@ -2374,7 +2663,7 @@ object-assign@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-3.0.0.tgz#9bedd5ca0897949bca47e7ff408062d549f587f2"
 
-object-assign@^4.0.1, object-assign@^4.1.0:
+object-assign@^4.0.1, object-assign@^4.1.0, object-assign@^4.1.1:
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
 
@@ -2385,13 +2674,7 @@ object.omit@^2.0.0:
     for-own "^0.1.4"
     is-extendable "^0.1.1"
 
-once@^1.3.0, once@^1.3.3:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1"
-  dependencies:
-    wrappy "1"
-
-once@~1.3.0:
+once@^1.3.0, once@^1.3.3, once@~1.3.0:
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/once/-/once-1.3.3.tgz#b2e261557ce4c314ec8304f3fa82663e4297ca20"
   dependencies:
@@ -2413,6 +2696,10 @@ os-browserify@^0.2.0:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/os-browserify/-/os-browserify-0.2.1.tgz#63fc4ccee5d2d7763d26bbf8601078e6c2e0044f"
 
+os-browserify@~0.1.1:
+  version "0.1.2"
+  resolved "https://registry.yarnpkg.com/os-browserify/-/os-browserify-0.1.2.tgz#49ca0293e0b19590a5f5de10c7f265a617d8fe54"
+
 os-homedir@^1.0.0, os-homedir@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/os-homedir/-/os-homedir-1.0.2.tgz#ffbc4988336e0e833de0c168c7ef152121aa7fb3"
@@ -2423,10 +2710,6 @@ os-locale@^1.4.0:
   dependencies:
     lcid "^1.0.0"
 
-os-shim@^0.1.2:
-  version "0.1.3"
-  resolved "https://registry.yarnpkg.com/os-shim/-/os-shim-0.1.3.tgz#6b62c3791cf7909ea35ed46e17658bb417cb3917"
-
 os-tmpdir@^1.0.0, os-tmpdir@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/os-tmpdir/-/os-tmpdir-1.0.2.tgz#bbe67406c79aa85c5cfec766fe5734555dfa1274"
@@ -2438,10 +2721,26 @@ osenv@0, osenv@^0.1.4:
     os-homedir "^1.0.0"
     os-tmpdir "^1.0.0"
 
+p-limit@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-1.1.0.tgz#b07ff2d9a5d88bec806035895a2bab66a27988bc"
+
+p-locate@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-2.0.0.tgz#20a0103b222a70c8fd39cc2e580680f3dde5ec43"
+  dependencies:
+    p-limit "^1.1.0"
+
 pako@~0.2.0:
   version "0.2.9"
   resolved "https://registry.yarnpkg.com/pako/-/pako-0.2.9.tgz#f3f7522f4ef782348da8161bad9ecfd51bf83a75"
 
+parents@^1.0.0, parents@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/parents/-/parents-1.0.1.tgz#fedd4d2bf193a77745fe71e371d73c3307d9c751"
+  dependencies:
+    path-platform "~0.11.15"
+
 parse-asn1@^5.0.0:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/parse-asn1/-/parse-asn1-5.1.0.tgz#37c4f9b7ed3ab65c74817b5f2480937fbf97c712"
@@ -2479,7 +2778,7 @@ parse-passwd@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/parse-passwd/-/parse-passwd-1.0.0.tgz#6d5b934a456993b23d37f40a382d6f1666a8e5c6"
 
-path-browserify@0.0.0:
+path-browserify@0.0.0, path-browserify@~0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/path-browserify/-/path-browserify-0.0.0.tgz#a0b870729aae214005b7d5032ec2cbbb0fb4451a"
 
@@ -2489,6 +2788,10 @@ path-exists@^2.0.0:
   dependencies:
     pinkie-promise "^2.0.0"
 
+path-exists@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-3.0.0.tgz#ce0ebeaa5f78cb18925ea7d810d7b59b010fd515"
+
 path-is-absolute@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/path-is-absolute/-/path-is-absolute-1.0.1.tgz#174b9268735534ffbc7ace6bf53a5a9e1b5c5f5f"
@@ -2497,6 +2800,10 @@ path-parse@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.5.tgz#3c1adf871ea9cd6c9431b6ea2bd74a0ff055c4c1"
 
+path-platform@~0.11.15:
+  version "0.11.15"
+  resolved "https://registry.yarnpkg.com/path-platform/-/path-platform-0.11.15.tgz#e864217f74c36850f0852b78dc7bf7d4a5721bf2"
+
 path-root-regex@^0.1.0:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/path-root-regex/-/path-root-regex-0.1.2.tgz#bfccdc8df5b12dc52c8b43ec38d18d72c04ba96d"
@@ -2525,7 +2832,7 @@ performance-now@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/performance-now/-/performance-now-0.2.0.tgz#33ef30c5c77d4ea21c5a53869d91b56d8f2555e5"
 
-pify@^2.0.0:
+pify@^2.0.0, pify@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/pify/-/pify-2.3.0.tgz#ed141a6ac043a849ea588498e7dca8b15330e90c"
 
@@ -2539,11 +2846,11 @@ pinkie@^2.0.0:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/pinkie/-/pinkie-2.0.4.tgz#72556b80cfa0d48a974e80e77248e80ed4f7f870"
 
-pkg-dir@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-1.0.0.tgz#7a4b508a8d5bb2d629d447056ff4e9c9314cf3d4"
+pkg-dir@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-2.0.0.tgz#f6d5d1109e19d63edf428e0bd57e12777615334b"
   dependencies:
-    find-up "^1.0.0"
+    find-up "^2.1.0"
 
 preserve@^0.2.0:
   version "0.2.0"
@@ -2561,7 +2868,7 @@ process-nextick-args@~1.0.6:
   version "1.0.7"
   resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-1.0.7.tgz#150e20b756590ad3f91093f25a4f2ad8bff30ba3"
 
-process@^0.11.0:
+process@^0.11.0, process@~0.11.0:
   version "0.11.9"
   resolved "https://registry.yarnpkg.com/process/-/process-0.11.9.tgz#7bd5ad21aa6253e7da8682264f1e11d11c0318c1"
 
@@ -2571,11 +2878,12 @@ promise@^7.1.1:
   dependencies:
     asap "~2.0.3"
 
-prop-types@^15.5.7, prop-types@~15.5.7:
-  version "15.5.8"
-  resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.5.8.tgz#6b7b2e141083be38c8595aa51fc55775c7199394"
+prop-types@^15.5.10:
+  version "15.5.10"
+  resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.5.10.tgz#2797dfc3126182e3a95e3dfbb2e893ddd7456154"
   dependencies:
     fbjs "^0.8.9"
+    loose-envify "^1.3.1"
 
 prr@~0.0.0:
   version "0.0.0"
@@ -2599,7 +2907,7 @@ punycode@1.3.2:
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.3.2.tgz#9653a036fb7c1ee42342f2325cceefea3926c48d"
 
-punycode@^1.2.4, punycode@^1.4.1:
+punycode@^1.2.4, punycode@^1.3.2, punycode@^1.4.1:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.4.1.tgz#c0d5a63b2718800ad8e1eb0fa5269c84dd41845e"
 
@@ -2607,7 +2915,7 @@ qs@~6.4.0:
   version "6.4.0"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.4.0.tgz#13e26d28ad6b0ffaa91312cd3bf708ed351e7233"
 
-querystring-es3@^0.2.0:
+querystring-es3@^0.2.0, querystring-es3@~0.2.0:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/querystring-es3/-/querystring-es3-0.2.1.tgz#9ec61f79049875707d69414596fd907a4d711e73"
 
@@ -2635,23 +2943,30 @@ rc@^1.1.7:
     minimist "^1.2.0"
     strip-json-comments "~2.0.1"
 
-react-dom@^15.4.2, react-dom@^15.5.4:
-  version "15.5.4"
-  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-15.5.4.tgz#ba0c28786fd52ed7e4f2135fe0288d462aef93da"
+react-dom@^15.6.1:
+  version "15.6.1"
+  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-15.6.1.tgz#2cb0ed4191038e53c209eb3a79a23e2a4cf99470"
   dependencies:
     fbjs "^0.8.9"
     loose-envify "^1.1.0"
     object-assign "^4.1.0"
-    prop-types "~15.5.7"
+    prop-types "^15.5.10"
 
-react@^15.4.2, react@^15.5.4:
-  version "15.5.4"
-  resolved "https://registry.yarnpkg.com/react/-/react-15.5.4.tgz#fa83eb01506ab237cdc1c8c3b1cea8de012bf047"
+react@^15.6.1:
+  version "15.6.1"
+  resolved "https://registry.yarnpkg.com/react/-/react-15.6.1.tgz#baa8434ec6780bde997cdc380b79cd33b96393df"
   dependencies:
+    create-react-class "^15.6.0"
     fbjs "^0.8.9"
     loose-envify "^1.1.0"
     object-assign "^4.1.0"
-    prop-types "^15.5.7"
+    prop-types "^15.5.10"
+
+read-only-stream@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/read-only-stream/-/read-only-stream-2.0.0.tgz#2724fd6a8113d73764ac288d4386270c1dbf17f0"
+  dependencies:
+    readable-stream "^2.0.2"
 
 read-pkg-up@^1.0.1:
   version "1.0.1"
@@ -2677,7 +2992,7 @@ read-pkg@^1.0.0:
     isarray "0.0.1"
     string_decoder "~0.10.x"
 
-"readable-stream@^2.0.0 || ^1.1.13", readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.5, readable-stream@^2.1.4, readable-stream@^2.1.5, readable-stream@^2.2.2, readable-stream@^2.2.6:
+"readable-stream@^2.0.0 || ^1.1.13", readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.5, readable-stream@^2.1.4, readable-stream@^2.1.5, readable-stream@^2.2.6:
   version "2.2.9"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.2.9.tgz#cf78ec6f4a6d1eb43d26488cac97f042e74b7fc8"
   dependencies:
@@ -2698,6 +3013,17 @@ readable-stream@~1.1.9:
     isarray "0.0.1"
     string_decoder "~0.10.x"
 
+readable-stream@~2.0.0:
+  version "2.0.6"
+  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.0.6.tgz#8f90341e68a53ccc928788dacfcd11b36eb9b78e"
+  dependencies:
+    core-util-is "~1.0.0"
+    inherits "~2.0.1"
+    isarray "~1.0.0"
+    process-nextick-args "~1.0.6"
+    string_decoder "~0.10.x"
+    util-deprecate "~1.0.1"
+
 readdirp@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-2.1.0.tgz#4ed0ad060df3073300c48440373f72d1cc642d78"
@@ -2707,6 +3033,15 @@ readdirp@^2.0.0:
     readable-stream "^2.0.2"
     set-immediate-shim "^1.0.1"
 
+receptor@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/receptor/-/receptor-1.0.0.tgz#bf54477e0387e44bebf3855120bbda5adea08f8b"
+  dependencies:
+    element-closest "^2.0.1"
+    keyboardevent-key-polyfill "^1.0.2"
+    matches-selector "^1.0.0"
+    object-assign "^4.1.0"
+
 rechoir@^0.6.2:
   version "0.6.2"
   resolved "https://registry.yarnpkg.com/rechoir/-/rechoir-0.6.2.tgz#85204b54dba82d5742e28c96756ef43af50e3384"
@@ -2825,7 +3160,15 @@ resolve-dir@^0.1.0:
     expand-tilde "^1.2.2"
     global-modules "^0.2.3"
 
-resolve@^1.1.6, resolve@^1.1.7:
+resolve-id-refs@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/resolve-id-refs/-/resolve-id-refs-0.1.0.tgz#3126624b887489da8fc0ae889632f8413ac6c3ec"
+
+resolve@1.1.7:
+  version "1.1.7"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.1.7.tgz#203114d82ad2c5ed9e8e0411b3932875e889e97b"
+
+resolve@^1.1.3, resolve@^1.1.4, resolve@^1.1.6, resolve@^1.1.7:
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.3.2.tgz#1f0442c9e0cbb8136e87b9305f932f46c7f28235"
   dependencies:
@@ -2883,12 +3226,28 @@ setimmediate@^1.0.4, setimmediate@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/setimmediate/-/setimmediate-1.0.5.tgz#290cbb232e306942d7d7ea9b83732ab7856f8285"
 
-sha.js@^2.3.6:
+sha.js@^2.3.6, sha.js@~2.4.4:
   version "2.4.8"
   resolved "https://registry.yarnpkg.com/sha.js/-/sha.js-2.4.8.tgz#37068c2c476b6baf402d14a49c67f597921f634f"
   dependencies:
     inherits "^2.0.1"
 
+shasum@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/shasum/-/shasum-1.0.2.tgz#e7012310d8f417f4deb5712150e5678b87ae565f"
+  dependencies:
+    json-stable-stringify "~0.0.0"
+    sha.js "~2.4.4"
+
+shell-quote@^1.6.1:
+  version "1.6.1"
+  resolved "https://registry.yarnpkg.com/shell-quote/-/shell-quote-1.6.1.tgz#f4781949cce402697127430ea3b3c5476f481767"
+  dependencies:
+    array-filter "~0.0.0"
+    array-map "~0.0.0"
+    array-reduce "~0.0.0"
+    jsonify "~0.0.0"
+
 sigmund@~1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/sigmund/-/sigmund-1.0.1.tgz#3ff21f198cad2175f9f3b781853fd94d0d19b590"
@@ -2925,13 +3284,6 @@ sparkles@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/sparkles/-/sparkles-1.0.0.tgz#1acbbfb592436d10bbe8f785b7cc6f82815012c3"
 
-spawn-sync@^1.0.15:
-  version "1.0.15"
-  resolved "https://registry.yarnpkg.com/spawn-sync/-/spawn-sync-1.0.15.tgz#b00799557eb7fb0c8376c29d44e8a1ea67e57476"
-  dependencies:
-    concat-stream "^1.4.7"
-    os-shim "^0.1.2"
-
 spdx-correct@~1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-1.0.2.tgz#4b3073d933ff51f3912f03ac5519498a4150db40"
@@ -2967,18 +3319,25 @@ stdout-stream@^1.4.0:
   dependencies:
     readable-stream "^2.0.1"
 
-stream-browserify@^2.0.1:
+stream-browserify@^2.0.0, stream-browserify@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/stream-browserify/-/stream-browserify-2.0.1.tgz#66266ee5f9bdb9940a4e4514cafb43bb71e5c9db"
   dependencies:
     inherits "~2.0.1"
     readable-stream "^2.0.2"
 
+stream-combiner2@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/stream-combiner2/-/stream-combiner2-1.1.1.tgz#fb4d8a1420ea362764e21ad4780397bebcb41cbe"
+  dependencies:
+    duplexer2 "~0.1.0"
+    readable-stream "^2.0.2"
+
 stream-consume@~0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/stream-consume/-/stream-consume-0.1.0.tgz#a41ead1a6d6081ceb79f65b061901b6d8f3d1d0f"
 
-stream-http@^2.3.1:
+stream-http@^2.0.0, stream-http@^2.3.1:
   version "2.7.0"
   resolved "https://registry.yarnpkg.com/stream-http/-/stream-http-2.7.0.tgz#cec1f4e3b494bc4a81b451808970f8b20b4ed5f6"
   dependencies:
@@ -2988,6 +3347,13 @@ stream-http@^2.3.1:
     to-arraybuffer "^1.0.0"
     xtend "^4.0.0"
 
+stream-splicer@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/stream-splicer/-/stream-splicer-2.0.0.tgz#1b63be438a133e4b671cc1935197600175910d83"
+  dependencies:
+    inherits "^2.0.1"
+    readable-stream "^2.0.2"
+
 string-width@^1.0.1, string-width@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/string-width/-/string-width-1.0.2.tgz#118bdf5b8cdc51a2a7e70d211e07e2b0b9b107d3"
@@ -2996,7 +3362,7 @@ string-width@^1.0.1, string-width@^1.0.2:
     is-fullwidth-code-point "^1.0.0"
     strip-ansi "^3.0.0"
 
-string_decoder@^0.10.25, string_decoder@~0.10.x:
+string_decoder@^0.10.25, string_decoder@~0.10.0, string_decoder@~0.10.x:
   version "0.10.31"
   resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-0.10.31.tgz#62e203bc41766c6c28c9fc84301dab1c5310fa94"
 
@@ -3039,6 +3405,12 @@ strip-json-comments@~2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a"
 
+subarg@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/subarg/-/subarg-1.0.0.tgz#f62cf17581e996b48fc965699f54c06ae268b8d2"
+  dependencies:
+    minimist "^1.1.0"
+
 supports-color@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
@@ -3049,6 +3421,12 @@ supports-color@^3.1.0:
   dependencies:
     has-flag "^1.0.0"
 
+syntax-error@^1.1.1:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/syntax-error/-/syntax-error-1.3.0.tgz#1ed9266c4d40be75dc55bf9bb1cb77062bb96ca1"
+  dependencies:
+    acorn "^4.0.3"
+
 tapable@^0.2.5, tapable@~0.2.5:
   version "0.2.6"
   resolved "https://registry.yarnpkg.com/tapable/-/tapable-0.2.6.tgz#206be8e188860b514425375e6f1ae89bfb01fd8d"
@@ -3088,6 +3466,10 @@ through2@^2.0.0:
     readable-stream "^2.1.5"
     xtend "~4.0.1"
 
+"through@>=2.2.7 <3":
+  version "2.3.8"
+  resolved "https://registry.yarnpkg.com/through/-/through-2.3.8.tgz#0dd4c9ffaabc357960b1b724115d7e0e86a2e1f5"
+
 tildify@^1.0.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/tildify/-/tildify-1.2.0.tgz#dcec03f55dca9b7aa3e5b04f21817eb56e63588a"
@@ -3098,6 +3480,12 @@ time-stamp@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/time-stamp/-/time-stamp-1.0.1.tgz#9f4bd23559c9365966f3302dbba2b07c6b99b151"
 
+timers-browserify@^1.0.1:
+  version "1.4.2"
+  resolved "https://registry.yarnpkg.com/timers-browserify/-/timers-browserify-1.4.2.tgz#c9c58b575be8407375cb5e2462dacee74359f41d"
+  dependencies:
+    process "~0.11.0"
+
 timers-browserify@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/timers-browserify/-/timers-browserify-2.0.2.tgz#ab4883cf597dcd50af211349a00fbca56ac86b86"
@@ -3126,7 +3514,7 @@ trim-right@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/trim-right/-/trim-right-1.0.1.tgz#cb2e1203067e0c8de1f614094b9fe45704ea6003"
 
-tty-browserify@0.0.0:
+tty-browserify@0.0.0, tty-browserify@~0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6"
 
@@ -3140,7 +3528,7 @@ tweetnacl@^0.14.3, tweetnacl@~0.14.0:
   version "0.14.5"
   resolved "https://registry.yarnpkg.com/tweetnacl/-/tweetnacl-0.14.5.tgz#5ae68177f192d4456269d108afa93ff8743f4f64"
 
-typedarray@^0.0.6:
+typedarray@~0.0.5:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
 
@@ -3165,6 +3553,10 @@ uid-number@^0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/uid-number/-/uid-number-0.0.6.tgz#0ea10e8035e8eb5b8e4449f06da1c730663baa81"
 
+umd@^3.0.0:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/umd/-/umd-3.0.1.tgz#8ae556e11011f63c2596708a8837259f01b3d60e"
+
 unc-path-regex@^0.1.0:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/unc-path-regex/-/unc-path-regex-0.1.2.tgz#e73dd3d7b0d7c5ed86fbac6b0ae7d8c6a69d50fa"
@@ -3173,7 +3565,7 @@ unique-stream@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/unique-stream/-/unique-stream-1.0.0.tgz#d59a4a75427447d9aa6c91e70263f8d26a4b104b"
 
-url@^0.11.0:
+url@^0.11.0, url@~0.11.0:
   version "0.11.0"
   resolved "https://registry.yarnpkg.com/url/-/url-0.11.0.tgz#3838e97cfc60521eb73c525a8e55bfdd9e2e28f1"
   dependencies:
@@ -3184,22 +3576,26 @@ user-home@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/user-home/-/user-home-1.1.1.tgz#2b5be23a32b63a7c9deb8d0f28d485724a3df190"
 
-uswds@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/uswds/-/uswds-1.0.0.tgz#ef881ae87b1de745a650aecf11fff87106920f52"
+uswds@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/uswds/-/uswds-1.2.1.tgz#df350f5b55ed211301369445cfa285f24231dded"
   dependencies:
-    bourbon "^4.2.6"
-    bourbon-neat "https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz"
+    array-filter "^1.0.0"
+    array-foreach "^1.0.2"
+    browserify "^13.0.0"
     classlist-polyfill "^1.0.3"
-    cross-spawn "^2.1.5"
+    domready "^1.0.8"
+    elem-dataset "^1.1.1"
     lodash.debounce "^4.0.7"
-    normalize.css "^3.0.3"
+    object-assign "^4.1.1"
+    receptor "^1.0.0"
+    resolve-id-refs "^0.1.0"
 
 util-deprecate@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
 
-util@0.10.3, util@^0.10.3:
+util@0.10.3, util@^0.10.3, util@~0.10.1:
   version "0.10.3"
   resolved "https://registry.yarnpkg.com/util/-/util-0.10.3.tgz#7afb1afe50805246489e3db7fe0ed379336ac0f9"
   dependencies:
@@ -3262,7 +3658,7 @@ vinyl@^0.5.0:
     clone-stats "^0.0.1"
     replace-ext "0.0.1"
 
-vm-browserify@0.0.4:
+vm-browserify@0.0.4, vm-browserify@~0.0.1:
   version "0.0.4"
   resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-0.0.4.tgz#5d7ea45bbef9e4a6ff65f95438e0a87c357d5a73"
   dependencies:
@@ -3316,7 +3712,7 @@ which-module@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/which-module/-/which-module-1.0.0.tgz#bba63ca861948994ff307736089e3b96026c2a4f"
 
-which@1, which@^1.2.12, which@^1.2.8, which@^1.2.9:
+which@1, which@^1.2.12, which@^1.2.9:
   version "1.2.14"
   resolved "https://registry.yarnpkg.com/which/-/which-1.2.14.tgz#9a87c4378f03e827cecaf1acdf56c736c01c14e5"
   dependencies:
diff --git a/packages/core/dist/components/Badge/Badge.css b/packages/core/dist/components/Badge/Badge.css
index a10b8a9fbf..d9e00ba31a 100644
--- a/packages/core/dist/components/Badge/Badge.css
+++ b/packages/core/dist/components/Badge/Badge.css
@@ -1 +1 @@
-.ds-c-badge{background-color:#02bfe7;border-radius:3px;color:#fff;display:inline-block;font-size:14px;line-height:1.3;margin-right:5px;padding:3px 6px}.ds-c-badge:only-of-type{margin-right:0}
\ No newline at end of file
+.ds-c-badge{background-color:#5b616b;border-radius:9999px;color:#fff;display:inline-block;font-size:14px;line-height:1.3;margin-right:4px;padding:4px 8px}.ds-c-badge:only-of-type{margin-right:0}.ds-c-badge--info{background-color:#0071bc}.ds-c-badge--success{background-color:#2e8540}.ds-c-badge--warn{background-color:#fdb81e;color:#212121}.ds-c-badge--alert{background-color:#e31c3d}
\ No newline at end of file
diff --git a/packages/core/dist/components/ChoiceList/Choice.js b/packages/core/dist/components/ChoiceList/Choice.js
index 2a17c3b071..e3e2ef211c 100644
--- a/packages/core/dist/components/ChoiceList/Choice.js
+++ b/packages/core/dist/components/ChoiceList/Choice.js
@@ -29,6 +29,7 @@ function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in ob
 
 /**
  * A `Choice` component can be used to render a checkbox or radio button.
+ *
  * Any _undocumented_ props that you pass to this component will be passed
  * to the `input` element, so you can use this to set additional attributes if
  * necessary.
diff --git a/packages/core/dist/components/ChoiceList/ChoiceList.js b/packages/core/dist/components/ChoiceList/ChoiceList.js
index f3723dbe18..c226020f7d 100644
--- a/packages/core/dist/components/ChoiceList/ChoiceList.js
+++ b/packages/core/dist/components/ChoiceList/ChoiceList.js
@@ -49,13 +49,13 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
 
 /**
  * A `ChoiceList` component can be used to render a `select` menu, radio
- * button group, or checkbox group, and their corresponding `label` or `legend`.
+ * button group, or checkbox group.
  *
  * You can manually pass in the `type` prop, but the real power of this component
  * is unleashed when you let it determine the type of fields for you. It takes
  * into account accessibility and usability best practices, so you can pass in
- * an array of choices and let it determine whether the choices should be
- * presented as radio buttons, checkboxes, or a `select` menu.
+ * an array of choices and let it determine what type of field would be best for
+ * the user.
  */
 var ChoiceList = exports.ChoiceList = function (_React$PureComponent) {
   _inherits(ChoiceList, _React$PureComponent);
diff --git a/packages/core/dist/components/ChoiceList/Select.js b/packages/core/dist/components/ChoiceList/Select.js
index 1553a09059..4e32e93914 100644
--- a/packages/core/dist/components/ChoiceList/Select.js
+++ b/packages/core/dist/components/ChoiceList/Select.js
@@ -84,7 +84,9 @@ Select.propTypes = {
    */
   multiple: function multiple(props, propName, componentName) {
     if (props[propName]) {
+      /* eslint-disable quotes */
       return new Error('\'' + propName + '\' supplied to \'' + componentName + '\'. [A11Y]: Users often don\u2019t' + ' understand how to select multiple items from dropdowns. Use checkboxes instead.');
+      /* eslint-enable */
     }
   },
   name: _propTypes2.default.string.isRequired,
diff --git a/packages/core/dist/components/List/List.css b/packages/core/dist/components/List/List.css
index c5eb9aee5d..b83857ec2a 100644
--- a/packages/core/dist/components/List/List.css
+++ b/packages/core/dist/components/List/List.css
@@ -1 +1 @@
-.ds-c-list{margin-bottom:1em;margin-top:1em;padding-left:1.94em}.ds-c-list li{line-height:1.5;margin-bottom:.5em}.ds-c-list li:last-child{margin-bottom:0}.ds-c-list--bare{list-style:none;margin:0;padding:0}
\ No newline at end of file
+.ds-c-list{margin-bottom:16px;margin-top:16px;padding-left:32px}.ds-c-list li{line-height:1.5;margin-bottom:8px}.ds-c-list li:last-child{margin-bottom:0}.ds-c-list--bare{list-style:none;margin:0;padding:0}
\ No newline at end of file
diff --git a/packages/core/dist/components/Table/Table.css b/packages/core/dist/components/Table/Table.css
index 1c415274c1..cc4af1673c 100644
--- a/packages/core/dist/components/Table/Table.css
+++ b/packages/core/dist/components/Table/Table.css
@@ -1 +1 @@
-.ds-c-table{border-collapse:collapse;border-spacing:0;margin:0;min-width:100%}.ds-c-table thead td,.ds-c-table thead th{background-color:#f1f1f1}.ds-c-table th{text-align:left}.ds-c-table tbody th{font-weight:400}.ds-c-table td,.ds-c-table th{background-color:#fff;border:1px solid #5b616b;padding:1.5rem}.ds-c-table--borderless thead tr{background-color:transparent}.ds-c-table--borderless thead th{border-top:0}.ds-c-table--borderless td,.ds-c-table--borderless th{border-left:0;border-right:0}
\ No newline at end of file
+.ds-c-table{border-collapse:collapse;border-spacing:0;margin:0;min-width:100%}.ds-c-table td{background-color:#fff}.ds-c-table th,.ds-c-table thead td{background-color:#f1f1f1;text-align:left}.ds-c-table tbody th{font-weight:400}.ds-c-table td,.ds-c-table th{border:1px solid #5b616b;padding:1.5rem}.ds-c-table--borderless thead tr{background-color:transparent}.ds-c-table--borderless thead th{border-top:0}.ds-c-table--borderless td,.ds-c-table--borderless th{border-left:0;border-right:0}.ds-c-table__caption{font-weight:700;margin-bottom:8px;text-align:left}
\ No newline at end of file
diff --git a/packages/core/dist/index.css b/packages/core/dist/index.css
index b4446130a5..586e25860a 100644
--- a/packages/core/dist/index.css
+++ b/packages/core/dist/index.css
@@ -1 +1 @@
-/*! Design System - Core v1.0.0-alpha.11 */@font-face{font-family:Bitter;font-style:normal;font-weight:400;src:url(fonts/Bitter-Regular.eot);src:url(fonts/Bitter-Regular.eot?#iefix) format("embedded-opentype"),url(fonts/Bitter-Regular.woff2) format("woff2"),url(fonts/Bitter-Regular.woff) format("woff"),url(fonts/Bitter-Regular.ttf) format("truetype")}@font-face{font-family:Bitter;font-style:normal;font-weight:700;src:url(fonts/Bitter-Bold.eot);src:url(fonts/Bitter-Bold.eot?#iefix) format("embedded-opentype"),url(fonts/Bitter-Bold.woff2) format("woff2"),url(fonts/Bitter-Bold.woff) format("woff"),url(fonts/Bitter-Bold.ttf) format("truetype")}@font-face{font-family:Bitter;font-style:italic;font-weight:400;src:url(fonts/Bitter-Italic.eot);src:url(fonts/Bitter-Italic.eot?#iefix) format("embedded-opentype"),url(fonts/Bitter-Italic.woff2) format("woff2"),url(fonts/Bitter-Italic.woff) format("woff"),url(fonts/Bitter-Italic.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;src:url(fonts/OpenSans-Regular-webfont.eot);src:url(fonts/OpenSans-Regular-webfont.eot?#iefix) format("embedded-opentype"),url(fonts/OpenSans-Regular-webfont.woff2) format("woff2"),url(fonts/OpenSans-Regular-webfont.woff) format("woff"),url(fonts/OpenSans-Regular-webfont.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:italic;font-weight:400;src:url(fonts/OpenSans-Italic-webfont.eot);src:url(fonts/OpenSans-Italic-webfont.eot?#iefix) format("embedded-opentype"),url(fonts/OpenSans-Italic-webfont.woff2) format("woff2"),url(fonts/OpenSans-Italic-webfont.woff) format("woff"),url(fonts/OpenSans-Italic-webfont.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:normal;font-weight:600;src:url(fonts/OpenSans-Semibold-webfont.eot);src:url(fonts/OpenSans-Semibold-webfont.eot?#iefix) format("embedded-opentype"),url(fonts/OpenSans-Semibold-webfont.woff2) format("woff2"),url(fonts/OpenSans-Semibold-webfont.woff) format("woff"),url(fonts/OpenSans-Semibold-webfont.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:normal;font-weight:700;src:url(fonts/OpenSans-Bold-webfont.eot);src:url(fonts/OpenSans-Bold-webfont.eot?#iefix) format("embedded-opentype"),url(fonts/OpenSans-Bold-webfont.woff2) format("woff2"),url(fonts/OpenSans-Bold-webfont.woff) format("woff"),url(fonts/OpenSans-Bold-webfont.ttf) format("truetype")}.ds-base{color:#212121}.ds-base,.ds-base--inverse{font-family:Open Sans,Helvetica,sans-serif;font-size:16px;line-height:1.5}.ds-base--inverse{background-color:#112e51;color:#fff}.ds-display,.ds-h1,.ds-h2,.ds-h3,.ds-h4,.ds-h5,.ds-h6,.ds-title{line-height:1.3;margin:0}.ds-display,.ds-h1,.ds-h2,.ds-h3,.ds-h4{font-weight:700}.ds-h1,.ds-h2,.ds-h3,.ds-h4,.ds-h5,.ds-h6{margin-bottom:.5em;margin-top:1.5em}.ds-h1:first-child,.ds-h2:first-child,.ds-h3:first-child,.ds-h4:first-child,.ds-h5:first-child,.ds-h6:first-child{margin-top:0}.ds-h1:last-child,.ds-h2:last-child,.ds-h3:last-child,.ds-h4:last-child,.ds-h5:last-child,.ds-h6:last-child{margin-bottom:0}.ds-display{font-size:60px}.ds-title{font-size:48px;font-weight:400}.ds-h1{font-size:36px}.ds-h2{font-size:24px}.ds-h3{font-size:21px}.ds-h4{font-size:18px}.ds-h5{font-size:16px}.ds-h5,.ds-h6{font-weight:400;text-transform:uppercase}.ds-h6{color:#757575;font-size:14px;letter-spacing:1px}.ds-base--inverse .ds-h6{color:#bac5cf}.ds-text,.ds-text--lead{line-height:1.5;margin-bottom:1em;margin-top:1em}.ds-text--lead:first-child,.ds-text:first-child{margin-top:0}.ds-text--lead:last-child,.ds-text:last-child{margin-bottom:0}.ds-text{font-size:16px}.ds-text--lead{font-size:18px}.ds-c-alert{background-color:#e1f3f8;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASoAAAEqCAMAAACV5O0dAAACf1BMVEX///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAnoH6uAAAA1XRSTlMABAwUHCQsNDxEDic/WHGJorrT6/z/AR5HcJjB6sKZHwg9d6PM9M2keD4JTorF+ceLTxlgnNfYMH7L/gdJluJXrjGT7RNuzwJIqmja238i9fap/aw3KrC0G58dEIj3EXPudFvhJr28Bvh7BUDVO1/oraYP4986gwMhxsRZ8fDDGsldyjbm4Oc4Q2G1kLeCuxJV3Cvl6S817O/yRk1TWvtR89m4jgrOI4SdSm2bgSmSC2MoILEYhlCyFnY5lciUhbYVr7NLnoBU0VZFq9SgeZHkmg1M0I1bEDoHAAAKgUlEQVR4AezJMwIDQQAAwL21jVP8/z+mjNGF0w54Jx1EmFDGheCMEoxgd7x/UmljnQ8x5XIhpxi8s0YrCX5Ybf0wTnN50rxYDv2qgh+z3mx3e3LoAduWI4AC6Im9lHuibyM/z7Zt27Zt27bfNDOEq+ru6uo9hP32HV3w7v2Hj58+wxq++ffLfx50i4enl/c3UJuPr58/BQnw8/WBogKDgkMoVEhwUCBUExoWHkFNRISHhSr0FBn1jhp6FxWpxlZ0TCw1FxsTDZOLi0+gThLi42BaiUnJHtSRR3JSIszoZUoqdZeW8hlmExf0lIZ4mv4NzCQjJpOGyQr/DmbxQ7aNhsrJzYMZ5BdQAoXfQ3ZFfjZKIae4BDIrLcuiNMq/VEBWoZWxlEpV9UtIqaaW0qmtgXzq6imlhu8gl8agJkqqvLkFEmkNoMTa2iGLuGLKLeR5KaTQ8Tul1xkJ41V00RS6e2CwX3tpEn39MNJXAzk0DVv6IAwzNExTGXkBg4yO0WTGf4MRXhZThPEJv38c4DcxThGKX0J3k1MUoGoaDpuuogAzRdDZ7BwFmPeBE3zmKcDCInQ13UQBQpbglKUQCtC0DP0kelGIFThphUKsDkInPWsUYx1OWqcYG5vQRUYABdmCk7YoyHYddLCzS1GS4KQkirK3D80dHFKFKh71Q2Otx1Sjipkn0NRpOVWposcZNHR+QXWqaFuGZlJyqFIVQ/7WbIpUq4r8G5o4z1GvKqQDGji9oHpVtF1CuNZyqljFpiUIdnBMNat4lQehdg6pahVjv4dAGbtUt4pzGRCm9JoqV/G6FIIM3lDtKt4MQoxbql7FWwixTPWruAwB+j2sUOXRD7eVdNIKVewsgZvu7mmNKt7fwT3dtEoVu+EWX1qnih1ww8OVlaquHuCyr6ZopSpOfQVXPdJaVXyEiz7lWK0q5xNcUlpLq1WxthSuyKb1qpgNF5zTilX8n727YG5bXcI4/tgODhc2Ze45genoQtm5zKfMzOhMuQ0MlJmZMcxMZWbGD3QbJsdaRX6VibS/DxD4hxzp1e4NGHaqvzNT9T8Fo3JJvTwYlEfq5cKgdWSBfBiUTxZYB0Pi08gCBTCogCyQFg8jCskKBxfCkIUHyQqFMKBII0vMhyHzyRJaEdiidpJFikvAVlJMFtkZBa5Sskxi4fWwMoaw64WJZJlSMGXuJ4fbnwmeBHK8BLB4tkuq7R5wHCMSx8BQrhEJrRz6okn8FA1dY70kfvKOhZ50ErXSoSOCRL0IBFZBol4FAirzkqjnLeNeEBIFCKDSR42ErxLtq6JmRBXa5V5GzYhlbrSnDwneg12ulSRaWOmCf9XUiqiGf7dJ8F6GVt6kVsTNO/DnLok2lsKf0STa6A4/7pHwI1z+/eO6jzYyr5BKvzwYdcyMhyfPU6dYFo/WNpJCNx+thWmn+1Nn+Ctae6yyVCyC4ckZ6gRP0UqJj9R5FKwpwF6y3i+D0dItle9sLYLkGXWC52jpBanzAMHykjrBwFYzGc+TOqMQLK+oE+yPQnOHOv3+v/WHsdkucq8US6pkNNddUrXvNZopJ0kVQDl33pmkmsA9KCSpotEkUVIFkohG80hSBTQPDd5IqsDeoEGxpAqsGA1+lVSB/Yo6cPeUVIH1dKPOW5JUOt6izmRJpWcy6ryTVHreoc57SaXnPWqlaJJKj5aCGqtIUulahRp/kFT6/oAaMZJKXwxqfJBU+j6gxm5JpW83alyRVPqu4Kc7JKkY7gC4IKk4LgDoLak4enOnpEqqkQA+SiqOjwA+SSqOTwB+k1QcvwEYQKoV2yHVAACTSLXHdkg1CUAqqfbZDqlSARepF2mDVOSCm9RLdNsglRsessDvirp+Kg9CyAq+LxMixrbxtSulCkEoMdh+hjFDKMIkFU8YwiUVTzgiJBVPBCIlFU8kvkkqnm+Sip9KfgCZIuXXOleEvFjgCpeXoFxh8o8NVyhCJBVPCDySiscDt6TiccMlqXhcQKqk4kjl3tySVJO4t0wl1QDujXhJ9Rv3eIek+sQ9NCSpPnKPokmqkdwDjpKqN/fYrKS6wD2MLanuMI/4S6or3AdHJNVu7uNIkuoD9yE3SRXDfXRSUv2B+0CupFrFfMxbUmkpzOEBkuo9dySFpHrHHXQiqSZzx+dIqrfMoUySqqebOepLUv3KHSAnqYq5Ywkl1RvusEtJNY85QlVSJXIH80qqaO64Z0k1gTtEXFKVM0fTS6rX3IUHkiqZu0ZDUl1kLmeRVPujmCt/JNVA7iIpSfWcuZ5MUv0ymLn0TlI95a5SlFR/ZS7olFTL4plrXyXVfe4yYUkVzlxRLam6cxefS6qlzHX6kurmHfh1m9TRvkf3bWM2DJrdt43o7xqpUwH/qkmVGT/ioEzcjxmkSjX8c61UVSoSSkWqarXShXb0ITVGQLERpEYftMe9jFSYOhiKDZ5KKixzozXF1433Qrm9pEIV2lfpIwVyoVwuKeCrRAAF6mcYK3GMFChAIGVeSdXAW4aAKiRVgwoEFiGpGkRAR7qkqpMOPWO9kqqGdyx0RUuqGtHQV64RSSqtnPluJdUxcHi2S6rtHrAkSKoE8GTud3qq/ZlgKnV6qlJwRe10dqqdUWAr0pycSiuCAYVOTlUII+LTnJsqLR6GrHNuqnUwKNepqXJh1Kn+zkzV/xQMu+HMVDfQAdOdmGo6OmLhSuelWrkQHRI7w2mpZsSig3KclioHHeXa7axUu13osOxUJ6VKzYYJI52UaiNM2eKcVFtgTmaWU1JlZcKkBZvIrGIoV0xmbVoA05I0MukolDtKJmlJCIIjZNI2KLeNTDqCoMhQfwWIT83VtQwER0o6mXMmE0plniFz0lMQJAvTyJx+2VAoux+Zk7YQQTNlP5kzrXhkeJkS4SOLp5E556YgiML+SbZ16SyCalYq2dSViwiywz6ypcXrEHS3epIN3bwGBTZ6yXZm3IASfch2JkCRPl6ylRkToMyRnmQjN29Aoesa2cbia1Dq6lSyiSvroFjSZbKFSxeh3IXzZAPnzsICq85QlzdmCixx6iR1cce3wiIpx6hL+/1/YZ0jPuqyfHtgqUMH/18ePDS6FYVRAN2xnf1sm7Gebdu1bbc/vPNO6nu+c7MWNfXtKwy2/4Va+vQRhms6oIYOmqBC4D018+4tFGl8Q628fgVlXq7EqY3NFxao9PwZNfHUD8WePKYWHp1CvbGHFC/2ACIcNeQo28E0pLh/j4Kl7kKQO7dPKNStzE3I4rhBka5fgzyXVxTn6hIiNV2cU5TziyZIddp3QjFO+k4h2eHBJkXYPDiEdM49CrDnhA62tzap1ObWNnThKK5TmfWiAzqxrdRRiboVG3TTs7hMwy0v9kBHc/MLAzTQwML8HLQ1PTNLg8zOTENzE5NT/O+mJidgBvmx8Xb+R+3jY3mYRr5QLPG/KBULeZhNOpPN8Z/KZTNpmNTIaCLJfySZGB2Budl6+/oH+FcG+vt6bSgPTc0trW3t/APtba0tzU0oMxWVVdU1tXX8RXW1NdVVlRUoY16fPxAMhSPRWJz8UTwWjYRDwYDf54VcClisNrvD6XJ7PG6X02G3WS0Q5DvmKXzffMJwPwAAAABJRU5ErkJggg==');background-image:url('data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Capa_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%22216px%22%20height%3D%22146px%22%20viewBox%3D%220%200%20216%20146%22%20enable-background%3D%22new%200%200%20216%20146%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20d%3D%22M162.18%2C41.592c-5.595-9.586-13.185-17.176-22.771-22.771c-9.588-5.595-20.055-8.392-31.408-8.392%20c-11.352%2C0-21.822%2C2.797-31.408%2C8.392c-9.587%2C5.594-17.177%2C13.184-22.772%2C22.771C48.225%2C51.179%2C45.428%2C61.649%2C45.428%2C73%20c0%2C11.352%2C2.798%2C21.82%2C8.392%2C31.408c5.595%2C9.585%2C13.185%2C17.176%2C22.772%2C22.771c9.587%2C5.595%2C20.056%2C8.392%2C31.408%2C8.392%20c11.352%2C0%2C21.822-2.797%2C31.408-8.392c9.586-5.594%2C17.176-13.185%2C22.771-22.771c5.594-9.587%2C8.391-20.057%2C8.391-31.408%20C170.57%2C61.648%2C167.773%2C51.178%2C162.18%2C41.592z%20M97.572%2C26.071c0-0.761%2C0.244-1.385%2C0.733-1.874c0.489-0.488%2C1.114-0.733%2C1.874-0.733%20h15.644c0.76%2C0%2C1.385%2C0.245%2C1.872%2C0.733c0.488%2C0.489%2C0.734%2C1.113%2C0.734%2C1.874v13.036c0%2C0.76-0.246%2C1.385-0.734%2C1.873%20c-0.487%2C0.489-1.112%2C0.733-1.872%2C0.733h-15.644c-0.76%2C0-1.385-0.244-1.874-0.733c-0.489-0.488-0.733-1.113-0.733-1.873V26.071z%20%20M128.857%2C112.107c0%2C0.76-0.246%2C1.385-0.733%2C1.872c-0.487%2C0.489-1.112%2C0.733-1.874%2C0.733h-36.5c-0.761%2C0-1.385-0.244-1.874-0.733%20c-0.489-0.488-0.733-1.113-0.733-1.873V99.07c0-0.762%2C0.244-1.385%2C0.733-1.874c0.489-0.488%2C1.114-0.733%2C1.874-0.733h7.822V70.392%20H89.75c-0.761%2C0-1.385-0.244-1.874-0.733c-0.489-0.488-0.733-1.113-0.733-1.874V54.75c0-0.761%2C0.244-1.385%2C0.733-1.874%20c0.489-0.489%2C1.114-0.733%2C1.874-0.733h26.073c0.76%2C0%2C1.385%2C0.244%2C1.872%2C0.733c0.488%2C0.489%2C0.734%2C1.113%2C0.734%2C1.874v41.714h7.82%20c0.761%2C0%2C1.386%2C0.245%2C1.874%2C0.733c0.487%2C0.488%2C0.733%2C1.113%2C0.733%2C1.874V112.107z%22%2F%3E%3C%2Fsvg%3E');background-position:8px 15.2px;background-repeat:no-repeat;background-size:40px;border:1px solid #9bdaf1;-webkit-box-sizing:border-box;box-sizing:border-box;color:#212121;min-height:56px;padding:16px}.ds-c-alert a{color:#205493}.ds-c-alert a:focus,.ds-c-alert a:hover{color:#112e51}.ds-c-alert ul:last-child{margin-bottom:0}.ds-c-alert ul:first-child{margin-top:0}.ds-c-alert__body{padding-left:40px}.ds-c-alert__heading{font-size:18px;font-weight:700;margin-bottom:4px;margin-top:0}.ds-c-alert__text{margin-bottom:0;margin-top:0}.ds-c-alert--error{background-color:#f9dede;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASoAAAEqCAMAAACV5O0dAAAC4lBMVEX///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD9upd0AAAA9nRSTlMABAwUHCQsNDxEDic/WHGJorrT6/z/AR5HcJjB6sKZHwg9d6PM9M2keD4JTorF+ceLTxlgnNfYMH7L/gdJluJXrjGT7RNuzwJIqmja238i9fap/aw3KrC0G58dEIj3EXPudFvhJr28Bvh7BUDVO1/oraYP4986gwMhxsRZ8fAayco25uc4XWGQt7sS3Cvl6S817O/yRk1TWvtRQ/OBMijZfAq4VPqOVjM5zkFQI1VcXoRjZmptdYadjZKUmpuhKcO/viDksQsYLrJLFnZKYmmVtoevgp6Xs6XRyODW3UWr1BWgZWx5kYWojEzSFyUtUm+PwHoNtX0RNC9mAAAMEUlEQVR4AezBA3bAQBQAwJ9sbLtu6ti8/7H6XNubzsBvQpCIohmW43mOZWgKkQT8u0UQJVlRNd0wLfsByzR0TVVkSRRgwxzX84Mwsl8p2tn1vT0HNmb/4PDoOLbfIT45PTu/gG1Al1dJan9ImuUFAryVVd3Yn6StqxIw1fXDaH+qceg7wM00L6v9JdZlngAb0zW39YB0ZxCEUbhjl/K9sVGKzd+Oc23bjG3bq80mBt3zLOGUztj4fmi0f3zMjVoTk1PQbmpygoSbnpmFIbMz0yTW3PzCYRh0eGF+TuZmXroM465ckren02e3wYptV2XN6bXJ67DmxsgykmLFTQ9W+fwBkiAYAgPh5cRd5KQHFnzRGHEWT9wAG8mDKeLqQnoKrGSyu4ilXB7s5HPET6EIlkrczqF8tgKmktUaMVI/DcYaTeJiOgrezu+IEwut9WCvPUb2pToQodsjy9b2IcRgSDYtuuWDGN7V22TNnbsQ5d5OsuT+AwjzcB3ZsCsKgaK7yLhHjyHSkwgZ9vQZhHr+gox6WYFYlVdkztxRiPba2DX03kC4t+/IiGunId77Ahnw4SMc8OkzafflK5zwbUia1b/DEdd/kFY/k3DG4V+k0e8/cIincbAu+eCU85u1lYJzNLX67YNzzrdIg59/4CDvr4ZLSMJJlX//2bsH70izLQrguyoea6dtq8ZKnt22lXnp17bGk/XatsNK27ZtjG3zeRlvZbWVfPek7j29pr7fn7CLqZyzDyJs2kz+TGW2QkRNms6frd/HI4KaTKYNk7PuzM7xLPvOrMm0YUQTREzHXFowLy8MQ+G8ebQgtyMi5Nl8K0kthMD8RbQg/1lExmLaUB4iv6MNixERY2jFixBZQivGIAKGhWjFUogspRWhYSi2DgNoxzKILKMdAzqgmMLLaUkfiKygJcvDKJ5BtKUkRP5CWwahWB6lNXUgspLW9IccVmXSmtUQ+TWtyVwFsUAG7VkDkbW0JyMAqXW0aD1ENtCidRCq1YIWbYTIJlrUohZEOqbTprsgspk2pXeERHNaVRMiebSqOQTm0q7GEFlHu+bC2ISytGsLRB6iXWUnwNRWWrYNIttp2VYY6kPbdkBkJ23rAyOpubRtF0R207bcVJjIonX3QKQ5rcuCgT0hWtccIm1oXWgPPEveS/vaQGQc7dubDK/W04FxENlHB9bDo/AIOrAfIs/TgRFheNOLLtSDyHK60AuexLxEF6pCpC9deCkGXoylE/dBZCKdGAsPDoToREOIHKQToQMoWg26kQ6R++lGDRTpyRS6MQAimXQj5UkUJZ+OzIDIIjqSjyIk0pVmkPgznUlE4Q7RlRaQqE1nDqFQOSl0JgCBjnQmJQeF2UV3DkPgCN3ZhUIc6Ul3JkCgAt3peQQ3t4UOPQKBbnRoC24qmEaHDkDgKB1KC+JmStGl2yEw7dZY7Aqk06WjEKhEl9IDgikvC6ZBIIlOrcSNHaNTiRA4TqcO4YaOzKNTCyAwh07NO4EbOUm3TkFgLt3qiht5nG7Nh8BpunWf99l5i+6EwBk6liD8809/9rkUHTuL64Rn0rENEKhJx9JSca3+dG0TBBrTtV/jWufo2jMQeJWuvYZrHO5J13pBYDFdq1YRV5tP516HwC/p3HFc7Q06dzcEttK58rjKn6fQubEQqEHnRiTjSqPo3psQaEn3puFKW+jeGxB4i+4Nx5Xuo3tvQ2A83XsHVzhABS0hUI4KDmj3nb0FgQwqaKD7uULeC4F3qKAGLhtKBWUg8AQVDMUl7ajhXQi8Rw3tcNESavgTBEZSwxJctJ0a3odAGjVsx0XVqeEDCDSjhuq4IPgANRyEQAtqeCCI8z6kivthrjd1fIjzGlPFTJgLUkdjnPcRVYRg7g/U8RHO+5g6kmGsHXV8jAJ4NkQdqTDWhDpCz6JANyq5DcZaU0k3FHiYSj6Bsd9SycMoUJNKYmFsFJXURIFPqWQVjPWhkk9RIINKWsNYSSrJQIGZVPJbGHuYVPy+fIJaRklqebWcADCVWu6AsdHUMlXz5c9ZMPYZtZQE8Ci1zIaxz6nlUQBfUMtCGHuGWr4A8CW1/BXGelHLlwDqU8tpGBtOLfUBlKOWMzBWl1rKAWhELaVg7EtqaQQgk1oqw1h5askEAlTzFIx9SjUBBKnmKxj7mmqCiKGab2DsNaqJQSzV/A7GzlFNLOKoZieM7aeaOMRTzW4Yq0c18Uigmq9hrDrVJCCRal6DsY+pJhFJVHMOxhpRTRK+pZq/wdgQqvlWM6oXYKysZlRJVPM0jM2kmiQkUs13MBaimkQkUE0uTCVTTwLiqeY9mKpIPfGIo5qRMDWYeuIQSzVpMPU99cQihmqawlQJ6olBkGoegKkfqCeIAPU8C0M/Uk8AyKSaMAwlUE2m7l+gXWAokar/3CpHNUdgaAFV/2Van2oqwNApqqmv+g9bdoOhn6jmS/nQkEqJ6otUHRp6lGqmwdAYqo6ilaSaRBhqQDUl5WOzKiWq/6CaqfJhbJUS1cpUc0L3R9j5MPQUtczUXRzhnTC0hVoylGeW+sPQNmr5VGfJTV6iepZaauqs+MhLVB+jlod1FnLlJapVqKWbzpq3vJhwOZWEnlUeL/kAZnKo5WOc9xG1PAQTwadJ5UqKxlTzz47w7Id/UU1jnPch9czY8lP8EQ+Wzn1sHvV86LGUyfdA0OOEpa+61wI533ave+a+JV6rjnztPFao+oZ6Leb11fD6876vgdcScd8Bj9X0vne8/mjtG+61bcw3zeNxFt+IZI8nf3zlvR6S8h33eJ7MV62ix11z32teTyn6fm3hQKfMe/X/XcqDu87Wm0cBGwc6sYsKFp38M7yaNpEKzlo4JizR7O8w8J/H6V6ChRPVEhthpFIKXbtP//C57OjPf+laVwvn9CXqwtDrFLBwTh/H6Nidt3wv7yHc2Eo69hcY+gsdW4kbC6T7UV0tPYCbKOVH5bVjMpjmR3WltKDHYWc/qi24uSM9/agu63kEhdjlR3XZLhQmJ8WP6qKUHBTqkB/VRYdQuEQ/Ks/bivl+VOfloyhPpvhRFUh5EkWq4UdVoAaKdiBE+lGFDsCDsaQf1Vh4EfOSH9VLMfCklx9VL3gTHhHtUY0Iw6P10R7VeniVvDe6o9qbDM/2hKI5qtAeGMiK5qiyYCI1N3qjyk2FkT7RG1UfGNoarVFthakJZaMzqrITYGxudEY1FwLNozGq5pDomB59UaV3hEitFtEWVYtaEFoXbVGtg1QgI7qiyghAbFVmNEWVuQqQezSaouqPYhkUPVENQvGEl0dLVMvDKKYOA2jNwzBUh9YM6IBiGxaiLXkwdJK2hIYhAsbQlja3Ti3hGETEYlrywDIYiZ1JSxYjMp7NpyUTgzBxiJbkP4sI6ZhLS/r+Fp4Fd9OS3I6ImCYjaMminaezczzYM/t/E2nJ5CaIoPjf8//l3GNinUEABdAbJ8+6sW3btm3bSW3b1hK6uG6h/2t8mJmchRxlvXgMTY1+oqJePYfGPm5SSXM70NwHHxX0/g10sF9N5Qy/gy6iVPzOdPKlmkoZ7oZu9n1UyPt30NHnTSpj7g109fETFfFqBzq70UIlvHgO3T2+SQU8eQwD9JdTeuX9MMSx9C3Y/WMYpCOXUivsgHHuzFFam3dgqBtPKKmbN2Cwq9copWtXYbjEKUpoKhFmsF+hZC5fgkkSLlIqF87DNOf6fJTG8Fk/mOnMaUrilA0mOz6iFA7nYb6GAwrPuw8hzMRXU2xTrRDF3i4FVr4DgWxvzVFQm5UbEEvQOoW0tgrxLK9QOCvLEFLi0iKFsriUCFHN585RGHO58xDZ9NQwhTA8NQ3RBU9QABPBkMHoyDBNNTwyClkE1Q3SNIN1QZBJQF8sTRHbFwDZZHf30nC93dmQUUdnVz4NlN/V2QFptba10yDtba2QXFNzC3XX0twEFdQ0NKZRR2mNDTVQRk1tXT11UV9XWwPVVFRWVVNT1VWVFVBUcUlpGTVSVlpSDLUF5OTm5fO/5Ofl5gTgZEhMSk5JTeM/SEtNSU5KxAkTHhEZFR0Tyz8UGxMdFRkRjhPMYrXZHU6X2+P18Ts+r8ftcjrsNqsFAhCHn39AYFBwSGhYWGhIcFBggL8fBPIVh3N6NXOFoY0AAAAASUVORK5CYII=');background-image:url('data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Capa_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%22216px%22%20height%3D%22146px%22%20viewBox%3D%220%200%20216%20146%22%20enable-background%3D%22new%200%200%20216%20146%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20d%3D%22M162.18%2C41.592c-5.595-9.586-13.185-17.176-22.771-22.771c-9.588-5.595-20.055-8.392-31.408-8.392%20c-11.352%2C0-21.821%2C2.797-31.408%2C8.392c-9.587%2C5.594-17.177%2C13.184-22.772%2C22.771C48.225%2C51.179%2C45.428%2C61.649%2C45.428%2C73%20c0%2C11.351%2C2.798%2C21.82%2C8.392%2C31.408c5.595%2C9.584%2C13.185%2C17.176%2C22.772%2C22.771c9.587%2C5.595%2C20.056%2C8.392%2C31.408%2C8.392%20c11.352%2C0%2C21.822-2.797%2C31.408-8.392c9.586-5.594%2C17.176-13.185%2C22.771-22.771c5.594-9.588%2C8.391-20.058%2C8.391-31.408%20C170.57%2C61.649%2C167.773%2C51.178%2C162.18%2C41.592z%20M118.43%2C112.025c0%2C0.761-0.246%2C1.398-0.734%2C1.914s-1.086%2C0.773-1.793%2C0.773H100.26%20c-0.706%2C0-1.331-0.271-1.874-0.814c-0.543-0.543-0.814-1.168-0.814-1.873V96.546c0-0.706%2C0.271-1.331%2C0.814-1.874%20c0.543-0.543%2C1.168-0.814%2C1.874-0.814h15.643c0.707%2C0%2C1.306%2C0.258%2C1.793%2C0.773c0.488%2C0.518%2C0.734%2C1.154%2C0.734%2C1.915V112.025z%20%20M118.266%2C83.999c-0.055%2C0.543-0.339%2C1.019-0.854%2C1.426c-0.517%2C0.407-1.154%2C0.61-1.914%2C0.61h-15.073%20c-0.761%2C0-1.413-0.203-1.956-0.61c-0.543-0.407-0.815-0.883-0.815-1.426l-1.385-50.595c0-0.653%2C0.271-1.141%2C0.814-1.467%20c0.544-0.434%2C1.196-0.652%2C1.956-0.652h17.926c0.761%2C0%2C1.412%2C0.217%2C1.955%2C0.652c0.543%2C0.326%2C0.813%2C0.815%2C0.813%2C1.467L118.266%2C83.999z%20%22%2F%3E%3C%2Fsvg%3E');border-color:#e59393}.ds-c-alert--warn{background-color:#fff1d2;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVwAAAFCCAQAAAAXw61MAAAMHklEQVR4Ae3dA3hlSxpG4TWdHhvXY9u2bdu2bdu2bdu2bXvmKu18Y2P/3fdUnV2d9byPjS9c+VNEC8aROR1X5M489Y/uzBU5HUcOiyWyIOLQXJv38yvyX/yK93NtDh3kcGeEPbgPPyUTfsp92CPI4c4Ap+a5bCZFm3kupw5yuEvFLdhKdtJWbhHkcJeEw/Jcsouey2GDHG53HIdPkUPgUxwnyOF2xfn5JTmEfsn5gxxuN5ySVbIAq5wyqMtwxeH4ElmQL3G40IHDFU8jC/S0IIfbHFckC3bFIIfbFMflt2TBfsdxgxxuQ7ybNPDuIIfbDJckjVwyyOE2wQa+RBr5EhuCHG4D3IA0dIOwcA5XHJ4fkYZ+xOHDgjlccXfS2N3DQjlccUx+Txr7PccMC+RwxeNJB48PC+NwxQnZQjrYwgmDFjRc8TLSycuCFjJccWbWSCdrnDloAcMV7yUdvTeow3DNvObfsYdr5jX/jj9cM6/5d/zhmnnNv+MP18xr/h1/uGZe82+/4Zp5zb8O18xr/u03XDOv+dfhmnnNv12Ga+Y1/zpcM6/5t8NwzbzmX4dr5jX/LnS4Zt4fkxn5sfm3MFxxDzIz9wha8HDNvOZfh2vmNf/2G66Z1/zrcM285t9+wzXzmn8drpnX/NtvuGZe86/DNfOaf6vDFTckA7hh0AKGa+Y1/zpcM6/5t4wIjsXvySB+z7GCSIGZ1/zrcM285t8ZDNfMa/51uGZe82+Vw30fGdD7HK6Zd0DmX8y8IzL/mnmHZP418w7J/GvmHZL5dz1n3v3J4PZfv/nXzDsk86+ZdyDmX4f7crKbeLnDNfMOw/xr5h2D+dfhcimym7mUwzXzmn+HYOYdkvnXzDsk86+Zd0jmXzPvkMy/Zt4hmX/NvEMy/5p558z863A5y7CZt26NszhcM6/51+Gaec2/DtfMa/7FzGv+HZKZ1/w7JDOv+XdIZl7z7yw53CeQdegJDtfMa/6dITOv+XdIZl7z75DMvObfIZl5zb8Od2aZ98tknfvyrPKvwzXzmn/NvObfGXG49yR/pns6XDOv+Xc2zLzmX4c7m8y7lfydtnJCh7u+M+/neDCX4OwNXIIH8znzb52Zt+pgbsuGxr95vi0Hm39rzLw1P+LEoT1OzPfNvxVm3ooDOX3og5PwC/PvOhsuK40y71NDPzysUf5dcbjrLfNeP/TDZcy/08y8FWft++Ol+XeambfinKEfzmf+nWbmrbhQ6IdLmH+nmXkrLhP64Urm33UzXE7UNPNeNfTDdZrm3xM53AEy75C/VbiZ17/TzLwVtwz9cAevf9fLcN9PmrpT6Id7kabeH8Zn5q24T+iHh3j9O83MW/HQ0A+PI1PMv2Rw3Ig09/jQD88gzd0ojM3MW/GM0A8v8vp3mpm34kWhH17j9e80M2/Fq0M/vM3r32lm3oq3hn74gNe/08y8szt84VNkivmXDItXkE4+EfrhK6STV4RRmXkrvhj64XtkivnXzFvx7dBP5VjS/GvmrfhJ6IcDyRTzr5m34nehH3aQKeZfM2/F5tALhyXTzL9m3poNoQ+OTqaZf828NUcMfbAfmWb+NfPW7BH64CRkmvnXzFtz3NAHpyPTzL9m3pqThz44B5lm/jXz1pwh9MGFyDTzr5m35lyhDy5Dppl/zbw1Fwl9cDUyzfxLhsGlydJcNvTBDcjSXDqMwsxbc/XQB7ci08y/Zt6aG4Q+uAuZZv4lQ+AI/IQs0a1CH9yPLNFPOEIYgZm35s6hDx5Bppl/zbw19w198CQyzfxLBsATyZI9LPTBc8iSPTHMn5l3Zi2fl5Fp5l8zb80zQx+8gUwz/5KZ46yskaV7ceiDd5GlW+OsYd7MvDWvCX3wETLN/GvmrXlb6IPPkWnmXzPvzD4D8Q0yzfxr5q35ZOiDH5Fp5l8zb82XQh/8hkwz/5p5a74T+mATmWb+NfPW/DT0wAZSYf4189b8PvTAEUmF+dfMW7Ml9MAepML8a+atWgntcTxSYf6da+bN7BwptMcpyNzMM/+aeav2DO1xZlJh/jXzVh0/tMd5SYX518xbdYrQHhcnFeZfM2/VmUJ7XJFUmH/NvFXnDu1xbVJh/iWzwr3ITF00tMdNyUzdy+H+T+zB/mSmLhfa4/akwvxr5q26xpz+sMj8a+atumFojweTCvOvmbfq1qE9HksqzL9m3qq7hPZ4Oqkw/5p5q+4X2uOFpML8a+atenhoj1eTCvPvXDLvV8jMPTG0x1vJzH1lHvnXzFv1rDl9w2T+NfNWvSS0xydJhfnXzFv12tAeXyYV5l8zb9XbQ3t8lwxgf/ZwuE8kQ/hAaI+fkwrzr5m36lOhPQ4gFeZfM2/Vl0N7bCcV5l8zb9V3Q2schtSYf8kS8QEyjJ+F1jgaGcgHwvKYeav2D62xL6kx/5p5q7aF1jgxqTH/kiXhxmQwG0NbnJYM5sZhOcy8dUcJbXF2UmP+NfPW7RXa4oKkxvxr5q07wXx+XDX/mnnrThna4qqkxvxr5q07c2iL65Ma8y/pjleSIZ0ntMUtyZBeGXoz89ZdLLTFnUmN+dfMW3f50Bb3JTXmX9IVlyHDumZoi4eTYV0m9GTmrbuRv22ZT/4189bdJrTFs0mN+XdGmddGxKtJjfnXzFv31tASh+V3pMb8a+atW+UUoR1uQ6rMv5h5qfsFZwxtcFPWSJX5l3TBidlKGN8ab+bSnICNYTE4HCfjenye7Ba2cuL+wzXz1m3n9wuyRnae+dfMOyTzr5l3SOZfM++QzL9m3iGZf828QzL/mnmHZP418w7J/Ns68x5AtC4dwB7jDvdJROvWk0I7Zt4hmX/NvEMy/5p5h2T+NfMOyfxr5h2S+dfMOyTzr5l3SOZfM++QzL9m3iGZf828QzL/mnmHZP418w7J/GvmHZL5lywQZyP/g3S2ZQ/XzLvKZ/j4gnyGVfNv++GaeV/DaVhZcGc8Da8x/7Ybrpl3B9cLbXA9dph/2wzXzPvI0A6PNP/WmXnrvsPhQjscju+Yf3sP995kt/f00BZPJ7u9e/cerpn3ZqEtbmb+rTLz1l08tMXFzb9VZt4hh2v+NfMOOVzzr5l3yOGaf828Qw7X/GvmHXK45l8zr8OdW/7tMNybkDE53Bm4yZKGyxH4qcPdZQ73p4ck/5p5hxyu+dfMO+Rwzb9m3iGHa/418w45XPOvmXfI4Zp/zbwOd9nO1m+4H3S4C+NwPxh2npl3yOGaf3cl837V4S6Uw/3qzudfM++QwzX/mnmHHK7518w75HDNv2beIYdr/jXzDjlc86+Zd8jhmn9JGa8i43K4A3hVqDLzDjlc86+Zd8jhmn9JCZcl43O4A7hsqDDzDjlc86+Zd8jhmn/NvEMO1/xr5h1yuOZfM++QwzX/mnmHHK7518w75HDNv2beIYdr/jXzDjlc86+Zt2pWr+6Yf828VbN658z8a+atav+y5GH5Dqkx/5p561q/5ftQUmX+NfPWtX09/ZpsI1XmXzPvznoNp2ElLA4rnIZXkzrMv5h5d8Uqn+HjC/IZVkmB+bcw3CcTaSaeXBuumXcA5l8z75DMv2beIZl/zbxDMv+aeYdk/jXzDsn8a+YdkvnXzDsk8y/5O+5DpBm7z38ZLnuaeWfP/Ltn+Asz75DMv+TP2MfMOwTz7z7/Otz7EmkA9/2n4bKRHxNpAD9m4z+GeyUiDeJK/xjue4g0iPeEQOAURBrIKYLhYUiGCALPI9JAnhcIvI9IA3lfIPBdIg3kuwFW2EakgWxjBY5LpMEcF05DpMGcBo7AGpEGssYRCPyASAP5QSDwTiIN5J0BH4TScJ4UCNyKSAO5VcB/uqThnC0QAp8k0iA+GQIhcDUiDeJq/xjuCt8n0gC+z8o/H0vekUgDuGP45+Eemf2JNHP7c+R/GW7g/kSaufuHfx/uCu8n0oy9n5X/GG5gb35GpJn6GXuH/zLcwHnZRqQZ2sZ5w/8YbuAuRJqhu4T/M9zAc4g0M88JE8MN3IzNRJqJzdwsFIYbOAPfIdIMfIczhOJwA0fltURastdy1FAa7j9wQ75IpCX5IjcM/wv5vzg3L2ELkTrawks498QyM4k9uBtfYJU0Jq3yBe7GHmEKKeJQ7MO5uA7343m8fIGk53E/rsO52IdDhZo/ALck8MBl9HzEAAAAAElFTkSuQmCC');background-image:url('data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Capa_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%22216px%22%20height%3D%22146px%22%20viewBox%3D%220%200%20216%20146%22%20enable-background%3D%22new%200%200%20216%20146%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20d%3D%22M179.695%2C125.388L117.126%2C10.673c-0.924-1.684-2.2-3.015-3.832-3.992c-1.628-0.978-3.394-1.467-5.295-1.467%20c-1.901%2C0-3.667%2C0.49-5.296%2C1.467s-2.906%2C2.308-3.829%2C3.992L36.303%2C125.388c-1.901%2C3.423-1.847%2C6.845%2C0.163%2C10.267%20c0.924%2C1.574%2C2.187%2C2.824%2C3.789%2C3.746c1.603%2C0.924%2C3.327%2C1.387%2C5.174%2C1.387H170.57c1.849%2C0%2C3.572-0.463%2C5.175-1.387%20c1.603-0.922%2C2.864-2.172%2C3.789-3.746C181.544%2C132.232%2C181.598%2C128.811%2C179.695%2C125.388z%20M118.43%2C117.24%20c0%2C0.76-0.259%2C1.398-0.773%2C1.914c-0.516%2C0.516-1.127%2C0.773-1.834%2C0.773H100.18c-0.706%2C0-1.317-0.257-1.833-0.773%20c-0.516-0.517-0.774-1.154-0.774-1.914v-15.48c0-0.76%2C0.258-1.397%2C0.774-1.914c0.516-0.516%2C1.126-0.773%2C1.833-0.773h15.642%20c0.707%2C0%2C1.318%2C0.257%2C1.834%2C0.773c0.515%2C0.517%2C0.773%2C1.154%2C0.773%2C1.914V117.24z%20M118.268%2C86.77%20c-0.056%2C0.543-0.341%2C0.991-0.856%2C1.344c-0.517%2C0.354-1.154%2C0.529-1.915%2C0.529h-15.073c-0.76%2C0-1.412-0.176-1.955-0.529%20c-0.544-0.354-0.815-0.801-0.815-1.346l-1.385-37.231c0-0.761%2C0.272-1.331%2C0.815-1.711c0.706-0.597%2C1.358-0.896%2C1.956-0.896h17.924%20c0.598%2C0%2C1.25%2C0.298%2C1.956%2C0.896c0.543%2C0.38%2C0.813%2C0.896%2C0.813%2C1.548L118.268%2C86.77z%22%2F%3E%3C%2Fsvg%3E');border-color:#f9c642}.ds-c-alert--success{background-color:#e7f4e4;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASoAAAEqCAMAAACV5O0dAAACnVBMVEX///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD6Mnm8AAAA33RSTlMABAwUHCQsNDxEDic/WHGJorrT6/z/AR5HcJjB6sKZHwg9d6PM9M2keD4JTorF+ceLTxlgnNfYMH7L/gdJluJXrjGT7RNuzwJIqmja238i9fap/aw3KrC0G58dEIj3EXPudFvhJr28Bvh7BUDVO1/oraYP4986gwMhxsRZ8fAayco25uc4XWGQt7sS3Cvl6S817O/yRk1TWvtRQ/PZuI4KziOEnYEpw2MgsSibGN2Gdkw5C7ZtULJcFlT6lUqvRUueQdEzMmoXVpKPZXyr1C4t0Keg3nmRJeQVjGQN4IXS6f4WAQAADDVJREFUeAHt3fVfVNkfx/H3zFzCrnkj7NpdO7boYGN7rTGBxWWFXcfFVkz8snZ3C9hd293d3fm3fB/bJsztc871+TP5+mUYzj2fD0QSCIa0pOSU1Bo1UlOSk7RQMIB7blCzVu06devVb9CwUZi3CTdq2KB+vbp1ateqCR9La5yecd/9TZigJk2bZaQ3T4PPtGjZqnWbtjShbbv2HTp2gj+EOnd5IEJLIl27dQ9BbT169upNm/Tp1bMHFJXZt1+Utor265sJ1WT1HzCQjhg4oH+WQp0GDW5LB7UdPEiNWkOGZtNx2UOHQHLDho+gS0YMHwZpjRw1OkIXRUaPGgkZtRgzlq7Tx3SCbIb1bUJPNBkXgkzGD51Az0wckARZpEwK01OxyVMgg6nTKIDpyRDdjF5hCiGWkwuR5T04kcLI7zITosp6KJtCKXi4BYQ0q5DCKZwF8RQ9QiE9mgSxzO4bp6Dy5zwGgRT3ocDmzoMohuVQbNFmeRDC/EYU3oJB8N7MhZTCosXwWO0llMTSEngpsCxGaYTHLYdnVqykVFY1h0dWl1Iya+rACy1yKKGcFnDd/8oopcdnwGVr11FS6zfAVRvjlFZ8E9wzshultnk5XLJ4CyW3dRtcMb4Ppbe9CC7YsZMK2LUbjtuzl0rYVwKHFe+nIiYcgKMO5lMZkUNw0OEjVEh4ExwzJkalRDMcK0XlONTqcIzKic6HAw4eoYLCR2G74nwqKX4MNtuzn4oqnwJb7dhLZWUnw0bjd1Jh68bDNnkVVFpFHmyyvJKKq1wOexyn8o7DFpvoA5tgg5IIfSBSAstyF9AXFuTCohMn6RMnT8CaRfSNRbCkJ31kPiw4VU4fKT8F0wJl9JWyAMw6TZ85DZM6xugzsY4wJa+QvlOYBzMm0YcmwYTD9KXDMGxbE/pSk20w6gx96gwMKqZvFcOQrAr6VkUWjDhLHzsLA85F6GORc0hY2nn62vk0JOoCfe4CEnRiHX1u3QkkZg59bw4SEiql75WGkIjN5D2bkYCLEfKeyEVUrz1J3tMe1cqMkuQ90UxUp5IqMqES1UilmkxIRdUuUU0mXEKVLkepJhOil1GVK1SVCVdQhatxquPaOloTv4q7u041hCc/cSwP6PHkuEdowXXcVbCAStCfwr8GZdO0giDuJoNKGPA0btDjGQcudgUKqYDy/rjFszGaVBjAnT2nRKlU3Ga+6VbP4c6ep/z2z8MdvBC298/Qq0dULQWsNtnqyIu4kycUKFWCuxh0hKY8hDvprXAp4CVzrRriDp6Sv9RTqMLRl2lGiopv/0qfQpW6R2jCK7jNif2yl9qAajxpplVBFm41X/lSwKtxGjcIt3pG8lJTkIBR+TTsNdzi6ThltmYKEvL6RBrVtgVudlTuUmuRoGMTaNQbuNmb/igFvNWWBjXDTUbukrnUHhjQ0WirdWm40QbKa98eGJJaTmP2qPKf4n0pMKiklIYsw40a+qgUsMFYq7dxg4s+KmViHsJFFeadFbwDUyppxBj8p73PSiF3v9kHiJZKWupdmPUeDViKf83wXSm8TyNm4B8fUEbZQ2BBExrwAf7xof9K4VEa8CH+0U7GUpmw5CMa0A5/C4Ypnb2ZsOZjGhAO4i+v+7AUPqERr+Mv4+QrtRtWfUojxpn4LFVKYSyN+BR/+YxyafQ5LHs6RiM+w5+WR2iba5+FpSiFdBoSWY4/FNEeC+sWLwY6TRlzJuJoqS9gXaexNKYIf+hOO+wchX998SUd08SOUthMg7rjDx1og69m4gazr4eFLtUxSoM64A9f07IjG3GLednOlEqGDa5+Q6O+xh/KaNXLR3GbIdnilupNw8rwh/20KNIdcKXVrh1eleJ+AHjRcqknAfOt5ChFvghgN62Jvwq40mrXVA9LcTeAdFqSnw640mqBp6WYbnlK6sTXAfOt5CnFngC+pQUTjgGutFpwzttS/BbAdzSvbTHgSqv1XpfidwBG07TyjqhWZrYdpS57XYqjATSlWftTAfOt5CrFpgB0mlRaAphvJVkp6gDKac6aDYArrdbVEqAUy4EAzdm3FjDfSrpSZABBNx6syNxrvlSRGKUYRMiVo13TrXaKUoohaOaPTMy3krAUNSTRuOzPAVda7fxemFJMQjKNGwQTdhtv9YNApZiMFBo2DTDfStZSTEEqjdrXA660+iFJpFJMRQ0a9THgRqslYpViDTxJo36EG62WnBKrFJ80nmoBYH8r8UvxSdSgQQ3gQquBwpViDaTSoJ/gfKuB44UrxVSk0KCfYX8rCUoxBck0aBws+ry6VoUilmIykmjQYFhu1ajqUitELMUkaDToGuxvJUEpagjRoOgvjrb69aKYpRhCkEZ1hv2txC/FIAI0amnQ/lbil2LAzDHEADjVamlzYUuVmzrcir5lfyvRS1E3d2T6q+ZIq28ELsWmJg/idVtafdHo5lKNBS7F0QC+oxitxC7F7wB8SyFaXRO7FL8F0JMitLqWK3Yp9gSQTgFaCV+K6QB20/tW24Uvxd0AXqTHrZpwuyZ8Kb4IAPu9brVSglL78YcyetwK4pdimeXrSLrmj1L82volN13zRSl2sOHqpK75oRS723EhV9d8UIpFtlzz1jX1S0WW2zM8QNdUL8XP7BpJoWuKl+Kntg060TW1S3GcfeNzdE3pUnzdxqFMuqZyqXDQzlFfuqZuKbazd4Ccrilbih/aPJZQ11QtxQ/sHnapa4qW4gzbR6jqmpqlljowmFfXVCzF9k6Me9Y1BUtxjCNDxHVNvVK86Mxoel1TrtTbTi080DXFSnGZY2s0dE2tUtzj3HIWXVOq1Lo0B1f+6JpCpdjM0UVSuqZOKb7h7HoyXVOmVNsWDi+90zVFSvE1x1cp6poapTjI+QWduqZEqYIsF9a+6poCpfiKK8uEdU3+UkxxZ0W1rklfqqFbi891TfJSfMi1dfq6Jn4pE+v08TwFaCVUKV7CnT1HAVoJVYrP4c4ChQK0EqpUYQB3kUEBWglUihm4m2CBAK0EKlUQxF1dpwCthCnF67i7q3EBWglTKn4VVbhCAVoJUopXUJXLUQFaCVIqehlVukQBWglRipdQtVQK0EqIUkxFNSoFaCVEqUpUJzMqQCsBSkUzUa32dKGV8KXYHtW7GHGhlfClIheRgM10oZXgpbgZiQiVutBK8FKlISRkDl1oJXQpzkFiTqxzoZXQpdadQIIu0IVWApfiBSQq7bwLrQQudT4NCTsXcaGVsKUi52DAWbrQStBSPAsjsipcaCVoqYosGFJMF1oJWYrFMOiMC62ELHUGRm1r4kIrAUs12QbDDtNhS0tws7U6vXcYJkyiw2IPZuE/s38L03uTYEZeIZ3WcAj+kfk7BVCYB1M6xui06NhJrQ4kvTHnUz1KAcQ6wqTT9JnTMCtQRl8pC8C0U+X0kfJTsKAnfWQ+LFlE31gEa06cpE+cPAGLchfQFxbkwrKSCH0gUgIbbKIPbIItjlN5x2GP5ZVUXOVy2CSvgkqryINtxq+jwnaOh42Ss6msvTtgqynlVNT+PbDZsTiVlF8M2x0NU0FHDsIB86NUTuwwHJFB5YyBQzKiVEpsDByzKUyFHDkMBx2KUBn5B+GoAxOoiP3FcFjJPiph7x44bvcuKmDnDrigaDul12c8XLFtKyW3ZTFcsnwzpdZtJNyzKU5pxTfCVRvWU1Lr1sJlMx6nlMr+B9e1yKGEclrAC3XWUDKlq+GR5qsolZUr4Jnl48KURmxZAF4qWUpJLKkNjy1eRCksnAnvDVpA4TWaDyHkNYtSbDnDIIp5cymwPsUQyGNz8imoeN/ZEEvSoxTSI0UQz6xCCqdwFoTU4uECCqXg4RYQ1cwu+RRGfpeZEFluToxCiOXkQnTJ0ymA6cmQwZTJMXoqNnkKZJE0YCI9M3FAEmQSGteEnmgyLgTZdBqj03X6mE6Q0chRoyN0UWT0qJGQ1rDhI+iSEcOHQXJDhmbTcdlDh0AFWYMGt6WD2g4elAVlZPUfMJCOGDigfxZUk9m3X5S2ivbrmwlF9ejZqzdt0rtXzx5QW6hzlwcitCTyQJfOIfhDi5atWrdpSxPatmndqmUL+Exa4/SM++5vwgQ1uf++jPTGafCxmrVq16lbr36Dho3CvE24UcMG9evVrVO7Vk3cc4NAMKQlJaek1qiRmpKcpIWCAQjk/12fm21v3GQqAAAAAElFTkSuQmCC');background-image:url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20id%3D%22Capa_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%22216px%22%20height%3D%22216px%22%20viewBox%3D%220%200%20216%20216%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20d%3D%22M162.18%2C41.592c-5.595-9.586-13.185-17.176-22.771-22.771c-9.588-5.595-20.055-8.392-31.408-8.392%20c-11.352%2C0-21.822%2C2.797-31.408%2C8.392c-9.587%2C5.594-17.177%2C13.184-22.772%2C22.771C48.225%2C51.179%2C45.428%2C61.649%2C45.428%2C73%20c0%2C11.352%2C2.798%2C21.82%2C8.392%2C31.408c5.595%2C9.585%2C13.185%2C17.176%2C22.772%2C22.771c9.587%2C5.595%2C20.056%2C8.392%2C31.408%2C8.392%20c11.352%2C0%2C21.822-2.797%2C31.408-8.392c9.586-5.594%2C17.176-13.185%2C22.771-22.771c5.594-9.587%2C8.391-20.057%2C8.391-31.408%20C170.57%2C61.648%2C167.773%2C51.178%2C162.18%2C41.592z%20M148.572%2C63.468l-44.239%2C44.239c-1.032%2C1.032-2.281%2C1.549-3.748%2C1.549%20c-1.412%2C0-2.634-0.517-3.666-1.549L67.425%2C78.215c-0.977-0.979-1.466-2.199-1.466-3.666c0-1.521%2C0.488-2.771%2C1.466-3.749%20l7.414-7.332c1.033-1.032%2C2.254-1.548%2C3.667-1.548s2.635%2C0.516%2C3.667%2C1.548l18.413%2C18.413l33.241-33.16%20c1.032-1.032%2C2.254-1.548%2C3.666-1.548c1.411%2C0%2C2.635%2C0.516%2C3.666%2C1.548l7.414%2C7.333c0.979%2C0.977%2C1.467%2C2.226%2C1.467%2C3.747%20C150.04%2C61.268%2C149.552%2C62.49%2C148.572%2C63.468z%22%2F%3E%3C%2Fsvg%3E');border-color:#94bfa2}.ds-c-badge{background-color:#02bfe7;border-radius:3px;color:#fff;display:inline-block;font-size:14px;line-height:1.3;margin-right:5px;padding:3px 6px}.ds-c-badge:only-of-type{margin-right:0}.ds-c-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:1px solid #0071bc;border-radius:3px;color:#0071bc;cursor:pointer;display:inline-block;font-family:Open Sans,Helvetica,sans-serif;font-size:16px;font-weight:700;line-height:1.3;padding:12px;text-align:center;text-decoration:none}.ds-c-button:focus,.ds-c-button:hover{border-color:#205493;color:#205493}.ds-c-button:active{border-color:#112e51;color:#112e51}.ds-c-button--big{font-size:21px;padding-left:24px;padding-right:24px}.ds-c-button--small{font-size:14px;font-weight:400;padding:8px}.ds-c-button--primary{background-color:#0071bc;color:#fff}.ds-c-button--primary:focus,.ds-c-button--primary:hover{background-color:#205493;color:#fff}.ds-c-button--primary:active{background-color:#112e51}.ds-c-button--transparent,.ds-c-button--transparent-inverse,.ds-c-button--transparent-inverse:active,.ds-c-button--transparent-inverse:focus,.ds-c-button--transparent-inverse:hover,.ds-c-button--transparent:active,.ds-c-button--transparent:focus,.ds-c-button--transparent:hover{border-color:transparent}.ds-c-button--danger{background-color:#e31c3d;border-color:#e31c3d;color:#fff}.ds-c-button--danger:focus,.ds-c-button--danger:hover{background-color:#cd2026;border-color:#cd2026;color:#fff}.ds-c-button--danger:active{background-color:#981b1e;border-color:#981b1e}.ds-c-button--success{background-color:#2e8540;border-color:#2e8540;color:#fff}.ds-c-button--success:focus,.ds-c-button--success:hover{background-color:#2a7a3b;border-color:#2a7a3b;color:#fff}.ds-c-button--success:active{background-color:#266e35;border-color:#266e35}.ds-c-button--disabled,.ds-c-button:disabled{pointer-events:none}.ds-c-button--disabled,.ds-c-button--disabled:active,.ds-c-button--disabled:focus,.ds-c-button--disabled:hover,.ds-c-button:disabled,.ds-c-button:disabled:active,.ds-c-button:disabled:focus,.ds-c-button:disabled:hover{background-color:#d6d7d9;border-color:#d6d7d9;color:#323a45}.ds-c-button--inverse,.ds-c-button--inverse:active,.ds-c-button--inverse:focus,.ds-c-button--inverse:hover{border-color:#fff}.ds-c-button--inverse,.ds-c-button--transparent-inverse{color:#fff}.ds-c-button--inverse:active,.ds-c-button--inverse:focus,.ds-c-button--inverse:hover,.ds-c-button--transparent-inverse:active,.ds-c-button--transparent-inverse:focus,.ds-c-button--transparent-inverse:hover{color:#fff;opacity:.8}.ds-c-button--inverse:active,.ds-c-button--transparent-inverse:active{opacity:.6}.ds-c-button--disabled-inverse,.ds-c-button--disabled-inverse:disabled{background-color:#081627;border-color:#081627;color:#bac5cf;pointer-events:none}.ds-c-button--disabled-inverse:active,.ds-c-button--disabled-inverse:disabled:active,.ds-c-button--disabled-inverse:disabled:focus,.ds-c-button--disabled-inverse:disabled:hover,.ds-c-button--disabled-inverse:focus,.ds-c-button--disabled-inverse:hover{background-color:#112e51;border-color:#112e51;color:#bac5cf}.ds-c-button>svg{fill:currentColor;height:1em;margin-bottom:-.1em;margin-top:-.1em;position:relative;top:-.1em;vertical-align:middle;width:1em}.ds-c-fieldset{border:0;margin:24px 0 0;min-width:0;padding:0}.ds-c-choice{margin-left:-100%;opacity:0;position:absolute}.ds-c-choice+label{cursor:pointer;display:block;font-weight:400;margin:8px 0;max-width:31em;min-height:32px;padding-left:40px;padding-top:4px;position:relative}.ds-c-choice+label:before{background-color:#fff;border:2px solid #212121;-webkit-box-sizing:border-box;box-sizing:border-box;content:"\a0";height:32px;left:0;line-height:32px;position:absolute;text-indent:.15em;top:0;width:32px}.ds-c-choice--inverse+label:before{background-color:#112e51;border-color:#fff}.ds-c-choice:focus+label:before{-webkit-box-shadow:0 0 0 2px #fff,0 0 2px 4px #3e94cf;box-shadow:0 0 0 2px #fff,0 0 2px 4px #3e94cf}.ds-c-choice--inverse:focus+label:before{-webkit-box-shadow:0 0 0 2px #112e51,0 0 2px 4px #59bcff;box-shadow:0 0 0 2px #112e51,0 0 2px 4px #59bcff}.ds-c-choice:checked+label:before{background-color:#0071bc;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAJCAQAAACssQXfAAAAiklEQVR4AT3PNUFGARAA4MO1AFRgQVrgTEgNXBZ0Z0aLQI0XANf594932LlLROjQHgmhM9mVwlhkMJO/4S7noMjghKEIPcmuUNNyGpa8uzUcYdA1qjjJ+ntwY8Q16jiIBCte0fSmUUr2Mio3W/BJqwQt2xHaZFhXhBnPqFr7D6eRKVMereeIv5++AKLreD06aLBkAAAAAElFTkSuQmCC');background-image:url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%20216%20146%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M168.86%2037.966l-11.08-11.08c-1.52-1.52-3.367-2.28-5.54-2.28-2.172%200-4.02.76-5.54%202.28L93.254%2080.414%2069.3%2056.38c-1.52-1.522-3.367-2.282-5.54-2.282-2.172%200-4.02.76-5.54%202.28L47.14%2067.46c-1.52%201.522-2.28%203.37-2.28%205.542%200%202.172.76%204.02%202.28%205.54l29.493%2029.493%2011.08%2011.08c1.52%201.52%203.368%202.28%205.54%202.28%202.173%200%204.02-.76%205.54-2.28l11.082-11.08L168.86%2049.05c1.52-1.52%202.283-3.37%202.283-5.54%200-2.174-.76-4.02-2.28-5.54z%22%2F%3E%3C%2Fsvg%3E');background-position:50%;background-repeat:no-repeat;background-size:24px;border-color:#0071bc}.ds-c-choice:disabled+label{color:#757575}.ds-c-choice:disabled+label:before{background-color:#d6d7d9;border:1px solid #aeb0b5;cursor:not-allowed}.ds-c-choice--inverse:disabled+label{color:#bac5cf}.ds-c-choice--inverse:disabled+label:before{background-color:rgba(186,197,207,.15);-webkit-box-shadow:0 0 0 1px #bac5cf;box-shadow:0 0 0 1px #bac5cf}.ds-c-choice[type=radio]+label:before{border-radius:100%}.ds-c-field--select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAAAn0lEQVQ4je3SwRECIQxA0T97Enpwx3a2TOlCXV0qceyBAuIBRmWBLB6dMZxC8jgkwD9eccATcBi1y+IIeEaAkQeCIMwKs9xS1509+JRo7E0EYYHwkdaZ5Zr1BHDZRcnMighHMMwKK8mZXSy0WFlJpP7ejNFJi22Q2ozW51JfR76NLqIxhbTYBqmxDhLZ0vwfKovjPvUTgIGJieEb8tvxBHgowtBhwYKpAAAAAElFTkSuQmCC');background-image:url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2226%22%20height%3D%2226%22%20viewBox%3D%220%200%2026%2026%22%3E%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M14.5022482%2020.7706835L25.368705%209.89253597C25.7895683%209.48920863%2026%208.99235612%2026%208.39028777c0-.60206835-.2104317-1.09892086-.631295-1.5022482l-1.2508992-1.26843525C23.7086331%205.21043165%2023.2059353%205%2022.6155576%205c-.5786871%200-1.0872303.20458633-1.5197842.61960432L13%2013.7270683%204.89253597%205.61960432C4.4833633%205.21043165%203.98066547%205%203.39028777%205c-.57868705%200-1.08723022.20458633-1.51978417.61960432L.61960432%206.88803957C.21043166%207.29721223%200%207.79991007%200%208.39028777c0%20.5903777.20458633%201.09307554.61960432%201.5022482L11.4802158%2020.7706835c.432554.4091726.9410971.6196043%201.5197842.6196043.5903777%200%201.0930755-.2045864%201.5022482-.6196043z%22%2F%3E%3C%2Fsvg%3E');background-position:right 14px center;background-repeat:no-repeat;background-size:14px}.ds-c-field--select[multiple]{background-image:none}.ds-c-label{display:block;font-size:16px;font-weight:400;margin-bottom:0;margin-top:24px;max-width:460px;padding:0}.ds-c-fieldset>.ds-c-label:first-child{margin-top:0}.ds-c-field__hint{color:#757575;display:block}.ds-c-field__hint--inverse{color:#bac5cf}.ds-c-list{margin-bottom:1em;margin-top:1em;padding-left:1.94em}.ds-c-list li{line-height:1.5;margin-bottom:.5em}.ds-c-list li:last-child{margin-bottom:0}.ds-c-list--bare{list-style:none;margin:0;padding:0}.ds-c-table{border-collapse:collapse;border-spacing:0;margin:0;min-width:100%}.ds-c-table thead td,.ds-c-table thead th{background-color:#f1f1f1}.ds-c-table th{text-align:left}.ds-c-table tbody th{font-weight:400}.ds-c-table td,.ds-c-table th{background-color:#fff;border:1px solid #5b616b;padding:1.5rem}.ds-c-table--borderless thead tr{background-color:transparent}.ds-c-table--borderless thead th{border-top:0}.ds-c-table--borderless td,.ds-c-table--borderless th{border-left:0;border-right:0}.ds-c-tabs{display:-webkit-box;display:-ms-flexbox;display:flex}.ds-c-tabs,.ds-c-tabs__panel{border-bottom:1px solid #d6d7d9}.ds-c-tabs__panel{background-color:#fff;border-left:1px solid #d6d7d9;border-right:1px solid #d6d7d9;padding:24px}.ds-c-tabs__panel[aria-hidden=true]{display:none!important}.ds-c-tabs__item{background-color:#fff;border-bottom:1px solid #d6d7d9;border-left:1px solid #d6d7d9;border-top:1px solid #d6d7d9;color:#212121;cursor:pointer;display:inline-block;font-size:14px;font-weight:700;line-height:1;margin-bottom:-1px;padding:16px 8px;position:relative;text-decoration:none;-webkit-transition:border-bottom-color .3s cubic-bezier(1,0,0,1);transition:border-bottom-color .3s cubic-bezier(1,0,0,1)}@media (min-width:544px){.ds-c-tabs__item{padding-left:16px;padding-right:16px}}@media (min-width:768px){.ds-c-tabs__item{font-size:16px;padding-left:24px;padding-right:24px}}.ds-c-tabs__item:last-child{border-right:1px solid #d6d7d9}.ds-c-tabs__item:after{background-color:#0071bc;content:"";height:4px;left:-1px;opacity:0;position:absolute;right:-1px;top:-1px;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transition:opacity .3s cubic-bezier(1,0,0,1),-webkit-transform .3s cubic-bezier(1,0,0,1);transition:opacity .3s cubic-bezier(1,0,0,1),-webkit-transform .3s cubic-bezier(1,0,0,1);transition:opacity .3s cubic-bezier(1,0,0,1),transform .3s cubic-bezier(1,0,0,1);transition:opacity .3s cubic-bezier(1,0,0,1),transform .3s cubic-bezier(1,0,0,1),-webkit-transform .3s cubic-bezier(1,0,0,1)}.ds-c-tabs__item[aria-selected=true]{border-bottom-color:#fff;color:#0071bc;pointer-events:none}.ds-c-tabs__item[aria-selected=true]:after{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}.ds-c-tabs__item:focus,.ds-c-tabs__item:hover{color:#0071bc}.ds-c-tabs__item:active{color:#205493}.ds-c-tabs__item>svg{fill:currentColor;height:1em;margin-bottom:-.1em;margin-top:-.1em;position:relative;top:-.1em;vertical-align:middle;width:1em}.ds-c-field{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid #212121;border-radius:3px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#212121;display:block;font-size:16px;line-height:1.3;margin:4px 0;max-width:460px;outline:none;padding:12px;width:100%}.ds-c-field:disabled{background-color:#d6d7d9;border-width:0}.ds-c-field:focus{-webkit-box-shadow:0 0 3px #3e94cf,0 0 7px #3e94cf;box-shadow:0 0 3px #3e94cf,0 0 7px #3e94cf}.ds-c-field--inverse{border-color:#000}.ds-c-field--inverse:focus{-webkit-box-shadow:0 0 3px #59bcff,0 0 7px #59bcff;box-shadow:0 0 3px #59bcff,0 0 7px #59bcff}.ds-c-field--error{border:3px solid #e31c3d}.ds-c-field--success{border:3px solid #4aa564}.ds-c-vertical-nav{list-style:none;margin:0;padding:0}.ds-c-vertical-nav>.ds-c-vertical-nav__item{background-color:transparent;border-top:1px solid #5b616b}.ds-c-vertical-nav>.ds-c-vertical-nav__item:first-child{border-top:0}.ds-c-vertical-nav__item{position:relative}.ds-c-vertical-nav__link{border-left:4px solid transparent;color:#212121;display:block;line-height:1.3;padding:8px 16px;text-decoration:none}.ds-c-vertical-nav__link--current{border-left-color:#0071bc;color:#0071bc;font-weight:700}.ds-c-vertical-nav__link--parent{margin-right:40px}a.ds-c-vertical-nav__link:hover{background-color:#f1f1f1;color:#0071bc;text-decoration:none}.ds-c-vertical-nav__subnav{list-style:none;margin:0;padding:0}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__item{font-size:14px}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__link{line-height:1.3;padding-left:24px}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__link--current{border-color:transparent}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__subnav .ds-c-vertical-nav__link{padding-left:32px}.ds-c-vertical-nav__subnav-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAAAn0lEQVQ4je3SwRECIQxA0T97Enpwx3a2TOlCXV0qceyBAuIBRmWBLB6dMZxC8jgkwD9eccATcBi1y+IIeEaAkQeCIMwKs9xS1509+JRo7E0EYYHwkdaZ5Zr1BHDZRcnMighHMMwKK8mZXSy0WFlJpP7ejNFJi22Q2ozW51JfR76NLqIxhbTYBqmxDhLZ0vwfKovjPvUTgIGJieEb8tvxBHgowtBhwYKpAAAAAElFTkSuQmCC');background-image:url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2226%22%20height%3D%2226%22%20viewBox%3D%220%200%2026%2026%22%3E%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M14.5022482%2020.7706835L25.368705%209.89253597C25.7895683%209.48920863%2026%208.99235612%2026%208.39028777c0-.60206835-.2104317-1.09892086-.631295-1.5022482l-1.2508992-1.26843525C23.7086331%205.21043165%2023.2059353%205%2022.6155576%205c-.5786871%200-1.0872303.20458633-1.5197842.61960432L13%2013.7270683%204.89253597%205.61960432C4.4833633%205.21043165%203.98066547%205%203.39028777%205c-.57868705%200-1.08723022.20458633-1.51978417.61960432L.61960432%206.88803957C.21043166%207.29721223%200%207.79991007%200%208.39028777c0%20.5903777.20458633%201.09307554.61960432%201.5022482L11.4802158%2020.7706835c.432554.4091726.9410971.6196043%201.5197842.6196043.5903777%200%201.0930755-.2045864%201.5022482-.6196043z%22%2F%3E%3C%2Fsvg%3E');background-position:50%;background-repeat:no-repeat;background-size:14px;border:0;cursor:pointer;font-size:inherit;line-height:1.3;padding-bottom:8px;padding-top:8px;position:absolute;right:0;text-indent:-9999px;top:0;width:40px}.ds-c-vertical-nav__subnav-toggle:hover{background-color:#f1f1f1}.ds-c-vertical-nav__subnav-toggle[aria-expanded=true]{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAAAkklEQVQ4y+3SMRKCMBRF0bsLtsAS0I1kGCsVZeW/1cGWMaGIIxCSH1Lr68/MKy78zk4IQltCeiwOh+W6l9w/pIAtiWeXUrKD3SIkw1JEYSEZGHKs25CGJmBvzjkCaCxFAA5x1irEs1fADIhKYkzWKEa2TJb3UgTg+GUW49MZcTwU4tkTxzgHXGOosilXGGr+mzcBgEfC5p/5oAUAAAAASUVORK5CYII=');background-image:url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2226%22%20height%3D%2226%22%20viewBox%3D%220%200%2026%2026%22%3E%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M14.5022482%204.61960432L25.368705%2015.4977518C25.7895683%2015.9010791%2026%2016.3979317%2026%2017c0%20.6020683-.2104317%201.0989209-.631295%201.5022482l-1.2508992%201.2684353c-.4091727.4091726-.9118705.6196043-1.5022482.6196043-.5786871%200-1.0872303-.2045864-1.5197842-.6196043L13%2011.6632194l-8.10746403%208.1074641c-.40917266.4091726-.9118705.6196043-1.5022482.6196043-.57868705%200-1.08723022-.2045864-1.51978417-.6196043L.61960432%2018.5022482C.21043166%2018.0930755%200%2017.5903777%200%2017c0-.5903777.20458633-1.0930755.61960432-1.5022482L11.4802158%204.61960432C11.9127698%204.21043165%2012.4213129%204%2013%204c.5903777%200%201.0930755.20458633%201.5022482.61960432z%22%2F%3E%3C%2Fsvg%3E')}.ds-u-fill--primary{background-color:#0071bc!important}.ds-u-fill--primary-darker{background-color:#205493!important}.ds-u-fill--primary-darkest{background-color:#112e51!important}.ds-u-fill--primary-alt{background-color:#02bfe7!important}.ds-u-fill--primary-alt-dark{background-color:#00a6d2!important}.ds-u-fill--primary-alt-darkest{background-color:#046b99!important}.ds-u-fill--primary-alt-light{background-color:#9bdaf1!important}.ds-u-fill--primary-alt-lightest{background-color:#e1f3f8!important}.ds-u-fill--secondary{background-color:#e31c3d!important}.ds-u-fill--secondary-dark{background-color:#cd2026!important}.ds-u-fill--secondary-darkest{background-color:#981b1e!important}.ds-u-fill--secondary-light{background-color:#e59393!important}.ds-u-fill--secondary-lightest{background-color:#f9dede!important}.ds-u-fill--gray{background-color:#5b616b!important}.ds-u-fill--gray-dark{background-color:#323a45!important}.ds-u-fill--gray-light{background-color:#aeb0b5!important}.ds-u-fill--gray-lighter{background-color:#d6d7d9!important}.ds-u-fill--gray-lightest{background-color:#f1f1f1!important}.ds-u-fill--gold{background-color:#fdb81e!important}.ds-u-fill--gold-light{background-color:#f9c642!important}.ds-u-fill--gold-lighter{background-color:#fad980!important}.ds-u-fill--gold-lightest{background-color:#fff1d2!important}.ds-u-fill--green{background-color:#2e8540!important}.ds-u-fill--green-light{background-color:#4aa564!important}.ds-u-fill--green-lighter{background-color:#94bfa2!important}.ds-u-fill--green-lightest{background-color:#e7f4e4!important}.ds-u-fill--error{background-color:#e31c3d!important}.ds-u-fill--error-dark{background-color:#cd2026!important}.ds-u-fill--error-darkest{background-color:#981b1e!important}.ds-u-fill--error-light{background-color:#e59393!important}.ds-u-fill--error-lighter{background-color:#efb9b9!important}.ds-u-fill--error-lightest{background-color:#f9dede!important}.ds-u-fill--warn{background-color:#fdb81e!important}.ds-u-fill--warn-light{background-color:#f9c642!important}.ds-u-fill--warn-lighter{background-color:#fad980!important}.ds-u-fill--warn-lightest{background-color:#fff1d2!important}.ds-u-fill--success{background-color:#2e8540!important}.ds-u-fill--success-light{background-color:#4aa564!important}.ds-u-fill--success-lighter{background-color:#94bfa2!important}.ds-u-fill--success-lightest{background-color:#e7f4e4!important}.ds-u-fill--base{background-color:#212121!important}.ds-u-fill--background,.ds-u-fill--white{background-color:#fff!important}.ds-u-fill--background-inverse{background-color:#112e51!important}.ds-u-fill--transparent{background-color:transparent!important}.ds-u-border--1{border:1px solid #d6d7d9!important}.ds-u-border-top--1{border-top:1px solid #d6d7d9!important}.ds-u-border-right--1{border-right:1px solid #d6d7d9!important}.ds-u-border-bottom--1{border-bottom:1px solid #d6d7d9!important}.ds-u-border-left--1,.ds-u-border-x--1{border-left:1px solid #d6d7d9!important}.ds-u-border-x--1{border-right:1px solid #d6d7d9!important}.ds-u-border-y--1{border-bottom:1px solid #d6d7d9!important;border-top:1px solid #d6d7d9!important}.ds-u-border--2{border:2px solid #d6d7d9!important}.ds-u-border-top--2{border-top:2px solid #d6d7d9!important}.ds-u-border-right--2{border-right:2px solid #d6d7d9!important}.ds-u-border-bottom--2{border-bottom:2px solid #d6d7d9!important}.ds-u-border-left--2,.ds-u-border-x--2{border-left:2px solid #d6d7d9!important}.ds-u-border-x--2{border-right:2px solid #d6d7d9!important}.ds-u-border-y--2{border-bottom:2px solid #d6d7d9!important;border-top:2px solid #d6d7d9!important}.ds-u-border--0{border:0!important}.ds-u-border-top--0{border-top:0!important}.ds-u-border-right--0{border-right:0!important}.ds-u-border-bottom--0{border-bottom:0!important}.ds-u-border-left--0,.ds-u-border-x--0{border-left:0!important}.ds-u-border-x--0{border-right:0!important}.ds-u-border-y--0{border-bottom:0!important;border-top:0!important}.ds-u-border--inverse{border-color:#fff!important}.ds-u-border--error{border-color:#e31c3d!important}.ds-u-border--error-light{border-color:#e59393!important}.ds-u-border--error-lighter{border-color:#efb9b9!important}.ds-u-border--warn{border-color:#fdb81e!important}.ds-u-border--warn-light{border-color:#f9c642!important}.ds-u-border--warn-lighter{border-color:#fad980!important}.ds-u-border--success{border-color:#2e8540!important}.ds-u-border--success-light{border-color:#4aa564!important}.ds-u-border--success-lighter{border-color:#94bfa2!important}.ds-u-radius{border-radius:3px}.ds-u-radius--pill{border-radius:9999px}.ds-u-radius--circle{border-radius:100%}.ds-u-color--primary{color:#0071bc!important}.ds-u-color--primary-darker{color:#205493!important}.ds-u-color--primary-darkest{color:#112e51!important}.ds-u-color--gray{color:#5b616b!important}.ds-u-color--muted{color:#757575!important}.ds-u-color--error{color:#e31c3d!important}.ds-u-color--error-dark{color:#cd2026!important}.ds-u-color--error-light{color:#e59393!important}.ds-u-color--success{color:#2e8540!important}.ds-u-color--base{color:#212121!important}.ds-u-color--base-inverse{color:#fff!important}.ds-u-color--muted-inverse{color:#bac5cf!important}.ds-u-color--black{color:#000!important}.ds-u-color--white{color:#fff!important}.ds-u-display--block{display:block!important}.ds-u-display--inline-block{display:inline-block!important}.ds-u-display--none{display:none!important}.ds-u-visibility--hidden{visibility:hidden!important}.ds-u-visibility--visible{visibility:visible!important}.ds-u-visibility--screen-reader{border:0;clip:rect(0,0,0,0);height:1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal}@media (min-width:544px){.ds-u-sm-display--block{display:block!important}.ds-u-sm-display--inline-block{display:inline-block!important}.ds-u-sm-display--none{display:none!important}.ds-u-sm-visibility--hidden{visibility:hidden!important}.ds-u-sm-visibility--visible{visibility:visible!important}}@media (min-width:768px){.ds-u-md-display--block{display:block!important}.ds-u-md-display--inline-block{display:inline-block!important}.ds-u-md-display--none{display:none!important}.ds-u-md-visibility--hidden{visibility:hidden!important}.ds-u-md-visibility--visible{visibility:visible!important}}@media (min-width:1024px){.ds-u-lg-display--block{display:block!important}.ds-u-lg-display--inline-block{display:inline-block!important}.ds-u-lg-display--none{display:none!important}.ds-u-lg-visibility--hidden{visibility:hidden!important}.ds-u-lg-visibility--visible{visibility:visible!important}}@media (min-width:1280px){.ds-u-xl-display--block{display:block!important}.ds-u-xl-display--inline-block{display:inline-block!important}.ds-u-xl-display--none{display:none!important}.ds-u-xl-visibility--hidden{visibility:hidden!important}.ds-u-xl-visibility--visible{visibility:visible!important}}.ds-u-float--left{float:left!important}.ds-u-float--right{float:right!important}.ds-u-float--none{float:none!important}@media (min-width:544px){.ds-u-sm-float--left{float:left!important}.ds-u-sm-float--right{float:right!important}.ds-u-sm-float--none{float:none!important}}@media (min-width:768px){.ds-u-md-float--left{float:left!important}.ds-u-md-float--right{float:right!important}.ds-u-md-float--none{float:none!important}}@media (min-width:1024px){.ds-u-lg-float--left{float:left!important}.ds-u-lg-float--right{float:right!important}.ds-u-lg-float--none{float:none!important}}@media (min-width:1280px){.ds-u-xl-float--left{float:left!important}.ds-u-xl-float--right{float:right!important}.ds-u-xl-float--none{float:none!important}}.ds-u-sans{font-family:Open Sans,Helvetica,sans-serif!important}.ds-u-serif{font-family:Bitter,Georgia,serif!important}.ds-u-font-size--small{font-size:14px!important}.ds-u-font-size--base{font-size:16px!important}.ds-u-font-size--lead{font-size:18px!important}.ds-u-font-size--display{font-size:60px!important}.ds-u-font-size--title{font-size:48px!important}.ds-u-font-size--h1{font-size:36px!important}.ds-u-font-size--h2{font-size:24px!important}.ds-u-font-size--h3{font-size:21px!important}.ds-u-font-size--h4{font-size:18px!important}@media (min-width:544px){.ds-u-sm-font-size--small{font-size:14px!important}.ds-u-sm-font-size--base{font-size:16px!important}.ds-u-sm-font-size--lead{font-size:18px!important}.ds-u-sm-font-size--display{font-size:60px!important}.ds-u-sm-font-size--title{font-size:48px!important}.ds-u-sm-font-size--h1{font-size:36px!important}.ds-u-sm-font-size--h2{font-size:24px!important}.ds-u-sm-font-size--h3{font-size:21px!important}.ds-u-sm-font-size--h4{font-size:18px!important}}@media (min-width:768px){.ds-u-md-font-size--small{font-size:14px!important}.ds-u-md-font-size--base{font-size:16px!important}.ds-u-md-font-size--lead{font-size:18px!important}.ds-u-md-font-size--display{font-size:60px!important}.ds-u-md-font-size--title{font-size:48px!important}.ds-u-md-font-size--h1{font-size:36px!important}.ds-u-md-font-size--h2{font-size:24px!important}.ds-u-md-font-size--h3{font-size:21px!important}.ds-u-md-font-size--h4{font-size:18px!important}}@media (min-width:1024px){.ds-u-lg-font-size--small{font-size:14px!important}.ds-u-lg-font-size--base{font-size:16px!important}.ds-u-lg-font-size--lead{font-size:18px!important}.ds-u-lg-font-size--display{font-size:60px!important}.ds-u-lg-font-size--title{font-size:48px!important}.ds-u-lg-font-size--h1{font-size:36px!important}.ds-u-lg-font-size--h2{font-size:24px!important}.ds-u-lg-font-size--h3{font-size:21px!important}.ds-u-lg-font-size--h4{font-size:18px!important}}@media (min-width:1280px){.ds-u-xl-font-size--small{font-size:14px!important}.ds-u-xl-font-size--base{font-size:16px!important}.ds-u-xl-font-size--lead{font-size:18px!important}.ds-u-xl-font-size--display{font-size:60px!important}.ds-u-xl-font-size--title{font-size:48px!important}.ds-u-xl-font-size--h1{font-size:36px!important}.ds-u-xl-font-size--h2{font-size:24px!important}.ds-u-xl-font-size--h3{font-size:21px!important}.ds-u-xl-font-size--h4{font-size:18px!important}}.ds-u-font-style--normal{font-style:normal!important}.ds-u-font-style--italic{font-style:italic!important}.ds-u-font-weight--normal{font-weight:400!important}.ds-u-font-weight--semibold{font-weight:600!important}.ds-u-font-weight--bold{font-weight:700!important}.ds-u-leading--base{line-height:1.5!important}.ds-u-leading--lead{line-height:1.7!important}.ds-u-leading--heading{line-height:1.3!important}.ds-u-leading--reset{line-height:1!important}.ds-u-margin--0{margin:0!important}.ds-u-margin-top--0{margin-top:0!important}.ds-u-margin-right--0{margin-right:0!important}.ds-u-margin-bottom--0{margin-bottom:0!important}.ds-u-margin-left--0,.ds-u-margin-x--0{margin-left:0!important}.ds-u-margin-x--0{margin-right:0!important}.ds-u-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-margin--1{margin:8px!important}.ds-u-margin-top--1{margin-top:8px!important}.ds-u-margin-right--1{margin-right:8px!important}.ds-u-margin-bottom--1{margin-bottom:8px!important}.ds-u-margin-left--1,.ds-u-margin-x--1{margin-left:8px!important}.ds-u-margin-x--1{margin-right:8px!important}.ds-u-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-margin--2{margin:16px!important}.ds-u-margin-top--2{margin-top:16px!important}.ds-u-margin-right--2{margin-right:16px!important}.ds-u-margin-bottom--2{margin-bottom:16px!important}.ds-u-margin-left--2,.ds-u-margin-x--2{margin-left:16px!important}.ds-u-margin-x--2{margin-right:16px!important}.ds-u-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-margin--3{margin:24px!important}.ds-u-margin-top--3{margin-top:24px!important}.ds-u-margin-right--3{margin-right:24px!important}.ds-u-margin-bottom--3{margin-bottom:24px!important}.ds-u-margin-left--3,.ds-u-margin-x--3{margin-left:24px!important}.ds-u-margin-x--3{margin-right:24px!important}.ds-u-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-margin--4{margin:32px!important}.ds-u-margin-top--4{margin-top:32px!important}.ds-u-margin-right--4{margin-right:32px!important}.ds-u-margin-bottom--4{margin-bottom:32px!important}.ds-u-margin-left--4,.ds-u-margin-x--4{margin-left:32px!important}.ds-u-margin-x--4{margin-right:32px!important}.ds-u-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-margin--5{margin:40px!important}.ds-u-margin-top--5{margin-top:40px!important}.ds-u-margin-right--5{margin-right:40px!important}.ds-u-margin-bottom--5{margin-bottom:40px!important}.ds-u-margin-left--5,.ds-u-margin-x--5{margin-left:40px!important}.ds-u-margin-x--5{margin-right:40px!important}.ds-u-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-margin--6{margin:48px!important}.ds-u-margin-top--6{margin-top:48px!important}.ds-u-margin-right--6{margin-right:48px!important}.ds-u-margin-bottom--6{margin-bottom:48px!important}.ds-u-margin-left--6,.ds-u-margin-x--6{margin-left:48px!important}.ds-u-margin-x--6{margin-right:48px!important}.ds-u-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-margin--7{margin:56px!important}.ds-u-margin-top--7{margin-top:56px!important}.ds-u-margin-right--7{margin-right:56px!important}.ds-u-margin-bottom--7{margin-bottom:56px!important}.ds-u-margin-left--7,.ds-u-margin-x--7{margin-left:56px!important}.ds-u-margin-x--7{margin-right:56px!important}.ds-u-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}@media (min-width:544px){.ds-u-sm-margin--0{margin:0!important}.ds-u-sm-margin-top--0{margin-top:0!important}.ds-u-sm-margin-right--0{margin-right:0!important}.ds-u-sm-margin-bottom--0{margin-bottom:0!important}.ds-u-sm-margin-left--0,.ds-u-sm-margin-x--0{margin-left:0!important}.ds-u-sm-margin-x--0{margin-right:0!important}.ds-u-sm-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-sm-margin--1{margin:8px!important}.ds-u-sm-margin-top--1{margin-top:8px!important}.ds-u-sm-margin-right--1{margin-right:8px!important}.ds-u-sm-margin-bottom--1{margin-bottom:8px!important}.ds-u-sm-margin-left--1,.ds-u-sm-margin-x--1{margin-left:8px!important}.ds-u-sm-margin-x--1{margin-right:8px!important}.ds-u-sm-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-sm-margin--2{margin:16px!important}.ds-u-sm-margin-top--2{margin-top:16px!important}.ds-u-sm-margin-right--2{margin-right:16px!important}.ds-u-sm-margin-bottom--2{margin-bottom:16px!important}.ds-u-sm-margin-left--2,.ds-u-sm-margin-x--2{margin-left:16px!important}.ds-u-sm-margin-x--2{margin-right:16px!important}.ds-u-sm-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-sm-margin--3{margin:24px!important}.ds-u-sm-margin-top--3{margin-top:24px!important}.ds-u-sm-margin-right--3{margin-right:24px!important}.ds-u-sm-margin-bottom--3{margin-bottom:24px!important}.ds-u-sm-margin-left--3,.ds-u-sm-margin-x--3{margin-left:24px!important}.ds-u-sm-margin-x--3{margin-right:24px!important}.ds-u-sm-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-sm-margin--4{margin:32px!important}.ds-u-sm-margin-top--4{margin-top:32px!important}.ds-u-sm-margin-right--4{margin-right:32px!important}.ds-u-sm-margin-bottom--4{margin-bottom:32px!important}.ds-u-sm-margin-left--4,.ds-u-sm-margin-x--4{margin-left:32px!important}.ds-u-sm-margin-x--4{margin-right:32px!important}.ds-u-sm-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-sm-margin--5{margin:40px!important}.ds-u-sm-margin-top--5{margin-top:40px!important}.ds-u-sm-margin-right--5{margin-right:40px!important}.ds-u-sm-margin-bottom--5{margin-bottom:40px!important}.ds-u-sm-margin-left--5,.ds-u-sm-margin-x--5{margin-left:40px!important}.ds-u-sm-margin-x--5{margin-right:40px!important}.ds-u-sm-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-sm-margin--6{margin:48px!important}.ds-u-sm-margin-top--6{margin-top:48px!important}.ds-u-sm-margin-right--6{margin-right:48px!important}.ds-u-sm-margin-bottom--6{margin-bottom:48px!important}.ds-u-sm-margin-left--6,.ds-u-sm-margin-x--6{margin-left:48px!important}.ds-u-sm-margin-x--6{margin-right:48px!important}.ds-u-sm-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-sm-margin--7{margin:56px!important}.ds-u-sm-margin-top--7{margin-top:56px!important}.ds-u-sm-margin-right--7{margin-right:56px!important}.ds-u-sm-margin-bottom--7{margin-bottom:56px!important}.ds-u-sm-margin-left--7,.ds-u-sm-margin-x--7{margin-left:56px!important}.ds-u-sm-margin-x--7{margin-right:56px!important}.ds-u-sm-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}@media (min-width:768px){.ds-u-md-margin--0{margin:0!important}.ds-u-md-margin-top--0{margin-top:0!important}.ds-u-md-margin-right--0{margin-right:0!important}.ds-u-md-margin-bottom--0{margin-bottom:0!important}.ds-u-md-margin-left--0,.ds-u-md-margin-x--0{margin-left:0!important}.ds-u-md-margin-x--0{margin-right:0!important}.ds-u-md-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-md-margin--1{margin:8px!important}.ds-u-md-margin-top--1{margin-top:8px!important}.ds-u-md-margin-right--1{margin-right:8px!important}.ds-u-md-margin-bottom--1{margin-bottom:8px!important}.ds-u-md-margin-left--1,.ds-u-md-margin-x--1{margin-left:8px!important}.ds-u-md-margin-x--1{margin-right:8px!important}.ds-u-md-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-md-margin--2{margin:16px!important}.ds-u-md-margin-top--2{margin-top:16px!important}.ds-u-md-margin-right--2{margin-right:16px!important}.ds-u-md-margin-bottom--2{margin-bottom:16px!important}.ds-u-md-margin-left--2,.ds-u-md-margin-x--2{margin-left:16px!important}.ds-u-md-margin-x--2{margin-right:16px!important}.ds-u-md-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-md-margin--3{margin:24px!important}.ds-u-md-margin-top--3{margin-top:24px!important}.ds-u-md-margin-right--3{margin-right:24px!important}.ds-u-md-margin-bottom--3{margin-bottom:24px!important}.ds-u-md-margin-left--3,.ds-u-md-margin-x--3{margin-left:24px!important}.ds-u-md-margin-x--3{margin-right:24px!important}.ds-u-md-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-md-margin--4{margin:32px!important}.ds-u-md-margin-top--4{margin-top:32px!important}.ds-u-md-margin-right--4{margin-right:32px!important}.ds-u-md-margin-bottom--4{margin-bottom:32px!important}.ds-u-md-margin-left--4,.ds-u-md-margin-x--4{margin-left:32px!important}.ds-u-md-margin-x--4{margin-right:32px!important}.ds-u-md-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-md-margin--5{margin:40px!important}.ds-u-md-margin-top--5{margin-top:40px!important}.ds-u-md-margin-right--5{margin-right:40px!important}.ds-u-md-margin-bottom--5{margin-bottom:40px!important}.ds-u-md-margin-left--5,.ds-u-md-margin-x--5{margin-left:40px!important}.ds-u-md-margin-x--5{margin-right:40px!important}.ds-u-md-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-md-margin--6{margin:48px!important}.ds-u-md-margin-top--6{margin-top:48px!important}.ds-u-md-margin-right--6{margin-right:48px!important}.ds-u-md-margin-bottom--6{margin-bottom:48px!important}.ds-u-md-margin-left--6,.ds-u-md-margin-x--6{margin-left:48px!important}.ds-u-md-margin-x--6{margin-right:48px!important}.ds-u-md-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-md-margin--7{margin:56px!important}.ds-u-md-margin-top--7{margin-top:56px!important}.ds-u-md-margin-right--7{margin-right:56px!important}.ds-u-md-margin-bottom--7{margin-bottom:56px!important}.ds-u-md-margin-left--7,.ds-u-md-margin-x--7{margin-left:56px!important}.ds-u-md-margin-x--7{margin-right:56px!important}.ds-u-md-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}@media (min-width:1024px){.ds-u-lg-margin--0{margin:0!important}.ds-u-lg-margin-top--0{margin-top:0!important}.ds-u-lg-margin-right--0{margin-right:0!important}.ds-u-lg-margin-bottom--0{margin-bottom:0!important}.ds-u-lg-margin-left--0,.ds-u-lg-margin-x--0{margin-left:0!important}.ds-u-lg-margin-x--0{margin-right:0!important}.ds-u-lg-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-lg-margin--1{margin:8px!important}.ds-u-lg-margin-top--1{margin-top:8px!important}.ds-u-lg-margin-right--1{margin-right:8px!important}.ds-u-lg-margin-bottom--1{margin-bottom:8px!important}.ds-u-lg-margin-left--1,.ds-u-lg-margin-x--1{margin-left:8px!important}.ds-u-lg-margin-x--1{margin-right:8px!important}.ds-u-lg-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-lg-margin--2{margin:16px!important}.ds-u-lg-margin-top--2{margin-top:16px!important}.ds-u-lg-margin-right--2{margin-right:16px!important}.ds-u-lg-margin-bottom--2{margin-bottom:16px!important}.ds-u-lg-margin-left--2,.ds-u-lg-margin-x--2{margin-left:16px!important}.ds-u-lg-margin-x--2{margin-right:16px!important}.ds-u-lg-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-lg-margin--3{margin:24px!important}.ds-u-lg-margin-top--3{margin-top:24px!important}.ds-u-lg-margin-right--3{margin-right:24px!important}.ds-u-lg-margin-bottom--3{margin-bottom:24px!important}.ds-u-lg-margin-left--3,.ds-u-lg-margin-x--3{margin-left:24px!important}.ds-u-lg-margin-x--3{margin-right:24px!important}.ds-u-lg-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-lg-margin--4{margin:32px!important}.ds-u-lg-margin-top--4{margin-top:32px!important}.ds-u-lg-margin-right--4{margin-right:32px!important}.ds-u-lg-margin-bottom--4{margin-bottom:32px!important}.ds-u-lg-margin-left--4,.ds-u-lg-margin-x--4{margin-left:32px!important}.ds-u-lg-margin-x--4{margin-right:32px!important}.ds-u-lg-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-lg-margin--5{margin:40px!important}.ds-u-lg-margin-top--5{margin-top:40px!important}.ds-u-lg-margin-right--5{margin-right:40px!important}.ds-u-lg-margin-bottom--5{margin-bottom:40px!important}.ds-u-lg-margin-left--5,.ds-u-lg-margin-x--5{margin-left:40px!important}.ds-u-lg-margin-x--5{margin-right:40px!important}.ds-u-lg-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-lg-margin--6{margin:48px!important}.ds-u-lg-margin-top--6{margin-top:48px!important}.ds-u-lg-margin-right--6{margin-right:48px!important}.ds-u-lg-margin-bottom--6{margin-bottom:48px!important}.ds-u-lg-margin-left--6,.ds-u-lg-margin-x--6{margin-left:48px!important}.ds-u-lg-margin-x--6{margin-right:48px!important}.ds-u-lg-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-lg-margin--7{margin:56px!important}.ds-u-lg-margin-top--7{margin-top:56px!important}.ds-u-lg-margin-right--7{margin-right:56px!important}.ds-u-lg-margin-bottom--7{margin-bottom:56px!important}.ds-u-lg-margin-left--7,.ds-u-lg-margin-x--7{margin-left:56px!important}.ds-u-lg-margin-x--7{margin-right:56px!important}.ds-u-lg-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}@media (min-width:1280px){.ds-u-xl-margin--0{margin:0!important}.ds-u-xl-margin-top--0{margin-top:0!important}.ds-u-xl-margin-right--0{margin-right:0!important}.ds-u-xl-margin-bottom--0{margin-bottom:0!important}.ds-u-xl-margin-left--0,.ds-u-xl-margin-x--0{margin-left:0!important}.ds-u-xl-margin-x--0{margin-right:0!important}.ds-u-xl-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-xl-margin--1{margin:8px!important}.ds-u-xl-margin-top--1{margin-top:8px!important}.ds-u-xl-margin-right--1{margin-right:8px!important}.ds-u-xl-margin-bottom--1{margin-bottom:8px!important}.ds-u-xl-margin-left--1,.ds-u-xl-margin-x--1{margin-left:8px!important}.ds-u-xl-margin-x--1{margin-right:8px!important}.ds-u-xl-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-xl-margin--2{margin:16px!important}.ds-u-xl-margin-top--2{margin-top:16px!important}.ds-u-xl-margin-right--2{margin-right:16px!important}.ds-u-xl-margin-bottom--2{margin-bottom:16px!important}.ds-u-xl-margin-left--2,.ds-u-xl-margin-x--2{margin-left:16px!important}.ds-u-xl-margin-x--2{margin-right:16px!important}.ds-u-xl-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-xl-margin--3{margin:24px!important}.ds-u-xl-margin-top--3{margin-top:24px!important}.ds-u-xl-margin-right--3{margin-right:24px!important}.ds-u-xl-margin-bottom--3{margin-bottom:24px!important}.ds-u-xl-margin-left--3,.ds-u-xl-margin-x--3{margin-left:24px!important}.ds-u-xl-margin-x--3{margin-right:24px!important}.ds-u-xl-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-xl-margin--4{margin:32px!important}.ds-u-xl-margin-top--4{margin-top:32px!important}.ds-u-xl-margin-right--4{margin-right:32px!important}.ds-u-xl-margin-bottom--4{margin-bottom:32px!important}.ds-u-xl-margin-left--4,.ds-u-xl-margin-x--4{margin-left:32px!important}.ds-u-xl-margin-x--4{margin-right:32px!important}.ds-u-xl-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-xl-margin--5{margin:40px!important}.ds-u-xl-margin-top--5{margin-top:40px!important}.ds-u-xl-margin-right--5{margin-right:40px!important}.ds-u-xl-margin-bottom--5{margin-bottom:40px!important}.ds-u-xl-margin-left--5,.ds-u-xl-margin-x--5{margin-left:40px!important}.ds-u-xl-margin-x--5{margin-right:40px!important}.ds-u-xl-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-xl-margin--6{margin:48px!important}.ds-u-xl-margin-top--6{margin-top:48px!important}.ds-u-xl-margin-right--6{margin-right:48px!important}.ds-u-xl-margin-bottom--6{margin-bottom:48px!important}.ds-u-xl-margin-left--6,.ds-u-xl-margin-x--6{margin-left:48px!important}.ds-u-xl-margin-x--6{margin-right:48px!important}.ds-u-xl-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-xl-margin--7{margin:56px!important}.ds-u-xl-margin-top--7{margin-top:56px!important}.ds-u-xl-margin-right--7{margin-right:56px!important}.ds-u-xl-margin-bottom--7{margin-bottom:56px!important}.ds-u-xl-margin-left--7,.ds-u-xl-margin-x--7{margin-left:56px!important}.ds-u-xl-margin-x--7{margin-right:56px!important}.ds-u-xl-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}.ds-u-measure--narrow{max-width:21em!important}.ds-u-measure--base{max-width:31em!important}.ds-u-measure--wide{max-width:41em!important}.ds-u-overflow--hidden{overflow:hidden!important}.ds-u-overflow--scroll{overflow:scroll!important}.ds-u-overflow--auto{overflow:auto!important}.ds-u-clearfix:after,.ds-u-clearfix:before{content:"";display:table}.ds-u-clearfix:after{clear:both}.ds-u-padding--0{padding:0!important}.ds-u-padding-top--0{padding-top:0!important}.ds-u-padding-right--0{padding-right:0!important}.ds-u-padding-bottom--0{padding-bottom:0!important}.ds-u-padding-left--0,.ds-u-padding-x--0{padding-left:0!important}.ds-u-padding-x--0{padding-right:0!important}.ds-u-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-padding--1{padding:8px!important}.ds-u-padding-top--1{padding-top:8px!important}.ds-u-padding-right--1{padding-right:8px!important}.ds-u-padding-bottom--1{padding-bottom:8px!important}.ds-u-padding-left--1,.ds-u-padding-x--1{padding-left:8px!important}.ds-u-padding-x--1{padding-right:8px!important}.ds-u-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-padding--2{padding:16px!important}.ds-u-padding-top--2{padding-top:16px!important}.ds-u-padding-right--2{padding-right:16px!important}.ds-u-padding-bottom--2{padding-bottom:16px!important}.ds-u-padding-left--2,.ds-u-padding-x--2{padding-left:16px!important}.ds-u-padding-x--2{padding-right:16px!important}.ds-u-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-padding--3{padding:24px!important}.ds-u-padding-top--3{padding-top:24px!important}.ds-u-padding-right--3{padding-right:24px!important}.ds-u-padding-bottom--3{padding-bottom:24px!important}.ds-u-padding-left--3,.ds-u-padding-x--3{padding-left:24px!important}.ds-u-padding-x--3{padding-right:24px!important}.ds-u-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-padding--4{padding:32px!important}.ds-u-padding-top--4{padding-top:32px!important}.ds-u-padding-right--4{padding-right:32px!important}.ds-u-padding-bottom--4{padding-bottom:32px!important}.ds-u-padding-left--4,.ds-u-padding-x--4{padding-left:32px!important}.ds-u-padding-x--4{padding-right:32px!important}.ds-u-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-padding--5{padding:40px!important}.ds-u-padding-top--5{padding-top:40px!important}.ds-u-padding-right--5{padding-right:40px!important}.ds-u-padding-bottom--5{padding-bottom:40px!important}.ds-u-padding-left--5,.ds-u-padding-x--5{padding-left:40px!important}.ds-u-padding-x--5{padding-right:40px!important}.ds-u-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-padding--6{padding:48px!important}.ds-u-padding-top--6{padding-top:48px!important}.ds-u-padding-right--6{padding-right:48px!important}.ds-u-padding-bottom--6{padding-bottom:48px!important}.ds-u-padding-left--6,.ds-u-padding-x--6{padding-left:48px!important}.ds-u-padding-x--6{padding-right:48px!important}.ds-u-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-padding--7{padding:56px!important}.ds-u-padding-top--7{padding-top:56px!important}.ds-u-padding-right--7{padding-right:56px!important}.ds-u-padding-bottom--7{padding-bottom:56px!important}.ds-u-padding-left--7,.ds-u-padding-x--7{padding-left:56px!important}.ds-u-padding-x--7{padding-right:56px!important}.ds-u-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}@media (min-width:544px){.ds-u-sm-padding--0{padding:0!important}.ds-u-sm-padding-top--0{padding-top:0!important}.ds-u-sm-padding-right--0{padding-right:0!important}.ds-u-sm-padding-bottom--0{padding-bottom:0!important}.ds-u-sm-padding-left--0,.ds-u-sm-padding-x--0{padding-left:0!important}.ds-u-sm-padding-x--0{padding-right:0!important}.ds-u-sm-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-sm-padding--1{padding:8px!important}.ds-u-sm-padding-top--1{padding-top:8px!important}.ds-u-sm-padding-right--1{padding-right:8px!important}.ds-u-sm-padding-bottom--1{padding-bottom:8px!important}.ds-u-sm-padding-left--1,.ds-u-sm-padding-x--1{padding-left:8px!important}.ds-u-sm-padding-x--1{padding-right:8px!important}.ds-u-sm-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-sm-padding--2{padding:16px!important}.ds-u-sm-padding-top--2{padding-top:16px!important}.ds-u-sm-padding-right--2{padding-right:16px!important}.ds-u-sm-padding-bottom--2{padding-bottom:16px!important}.ds-u-sm-padding-left--2,.ds-u-sm-padding-x--2{padding-left:16px!important}.ds-u-sm-padding-x--2{padding-right:16px!important}.ds-u-sm-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-sm-padding--3{padding:24px!important}.ds-u-sm-padding-top--3{padding-top:24px!important}.ds-u-sm-padding-right--3{padding-right:24px!important}.ds-u-sm-padding-bottom--3{padding-bottom:24px!important}.ds-u-sm-padding-left--3,.ds-u-sm-padding-x--3{padding-left:24px!important}.ds-u-sm-padding-x--3{padding-right:24px!important}.ds-u-sm-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-sm-padding--4{padding:32px!important}.ds-u-sm-padding-top--4{padding-top:32px!important}.ds-u-sm-padding-right--4{padding-right:32px!important}.ds-u-sm-padding-bottom--4{padding-bottom:32px!important}.ds-u-sm-padding-left--4,.ds-u-sm-padding-x--4{padding-left:32px!important}.ds-u-sm-padding-x--4{padding-right:32px!important}.ds-u-sm-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-sm-padding--5{padding:40px!important}.ds-u-sm-padding-top--5{padding-top:40px!important}.ds-u-sm-padding-right--5{padding-right:40px!important}.ds-u-sm-padding-bottom--5{padding-bottom:40px!important}.ds-u-sm-padding-left--5,.ds-u-sm-padding-x--5{padding-left:40px!important}.ds-u-sm-padding-x--5{padding-right:40px!important}.ds-u-sm-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-sm-padding--6{padding:48px!important}.ds-u-sm-padding-top--6{padding-top:48px!important}.ds-u-sm-padding-right--6{padding-right:48px!important}.ds-u-sm-padding-bottom--6{padding-bottom:48px!important}.ds-u-sm-padding-left--6,.ds-u-sm-padding-x--6{padding-left:48px!important}.ds-u-sm-padding-x--6{padding-right:48px!important}.ds-u-sm-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-sm-padding--7{padding:56px!important}.ds-u-sm-padding-top--7{padding-top:56px!important}.ds-u-sm-padding-right--7{padding-right:56px!important}.ds-u-sm-padding-bottom--7{padding-bottom:56px!important}.ds-u-sm-padding-left--7,.ds-u-sm-padding-x--7{padding-left:56px!important}.ds-u-sm-padding-x--7{padding-right:56px!important}.ds-u-sm-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}@media (min-width:768px){.ds-u-md-padding--0{padding:0!important}.ds-u-md-padding-top--0{padding-top:0!important}.ds-u-md-padding-right--0{padding-right:0!important}.ds-u-md-padding-bottom--0{padding-bottom:0!important}.ds-u-md-padding-left--0,.ds-u-md-padding-x--0{padding-left:0!important}.ds-u-md-padding-x--0{padding-right:0!important}.ds-u-md-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-md-padding--1{padding:8px!important}.ds-u-md-padding-top--1{padding-top:8px!important}.ds-u-md-padding-right--1{padding-right:8px!important}.ds-u-md-padding-bottom--1{padding-bottom:8px!important}.ds-u-md-padding-left--1,.ds-u-md-padding-x--1{padding-left:8px!important}.ds-u-md-padding-x--1{padding-right:8px!important}.ds-u-md-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-md-padding--2{padding:16px!important}.ds-u-md-padding-top--2{padding-top:16px!important}.ds-u-md-padding-right--2{padding-right:16px!important}.ds-u-md-padding-bottom--2{padding-bottom:16px!important}.ds-u-md-padding-left--2,.ds-u-md-padding-x--2{padding-left:16px!important}.ds-u-md-padding-x--2{padding-right:16px!important}.ds-u-md-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-md-padding--3{padding:24px!important}.ds-u-md-padding-top--3{padding-top:24px!important}.ds-u-md-padding-right--3{padding-right:24px!important}.ds-u-md-padding-bottom--3{padding-bottom:24px!important}.ds-u-md-padding-left--3,.ds-u-md-padding-x--3{padding-left:24px!important}.ds-u-md-padding-x--3{padding-right:24px!important}.ds-u-md-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-md-padding--4{padding:32px!important}.ds-u-md-padding-top--4{padding-top:32px!important}.ds-u-md-padding-right--4{padding-right:32px!important}.ds-u-md-padding-bottom--4{padding-bottom:32px!important}.ds-u-md-padding-left--4,.ds-u-md-padding-x--4{padding-left:32px!important}.ds-u-md-padding-x--4{padding-right:32px!important}.ds-u-md-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-md-padding--5{padding:40px!important}.ds-u-md-padding-top--5{padding-top:40px!important}.ds-u-md-padding-right--5{padding-right:40px!important}.ds-u-md-padding-bottom--5{padding-bottom:40px!important}.ds-u-md-padding-left--5,.ds-u-md-padding-x--5{padding-left:40px!important}.ds-u-md-padding-x--5{padding-right:40px!important}.ds-u-md-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-md-padding--6{padding:48px!important}.ds-u-md-padding-top--6{padding-top:48px!important}.ds-u-md-padding-right--6{padding-right:48px!important}.ds-u-md-padding-bottom--6{padding-bottom:48px!important}.ds-u-md-padding-left--6,.ds-u-md-padding-x--6{padding-left:48px!important}.ds-u-md-padding-x--6{padding-right:48px!important}.ds-u-md-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-md-padding--7{padding:56px!important}.ds-u-md-padding-top--7{padding-top:56px!important}.ds-u-md-padding-right--7{padding-right:56px!important}.ds-u-md-padding-bottom--7{padding-bottom:56px!important}.ds-u-md-padding-left--7,.ds-u-md-padding-x--7{padding-left:56px!important}.ds-u-md-padding-x--7{padding-right:56px!important}.ds-u-md-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}@media (min-width:1024px){.ds-u-lg-padding--0{padding:0!important}.ds-u-lg-padding-top--0{padding-top:0!important}.ds-u-lg-padding-right--0{padding-right:0!important}.ds-u-lg-padding-bottom--0{padding-bottom:0!important}.ds-u-lg-padding-left--0,.ds-u-lg-padding-x--0{padding-left:0!important}.ds-u-lg-padding-x--0{padding-right:0!important}.ds-u-lg-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-lg-padding--1{padding:8px!important}.ds-u-lg-padding-top--1{padding-top:8px!important}.ds-u-lg-padding-right--1{padding-right:8px!important}.ds-u-lg-padding-bottom--1{padding-bottom:8px!important}.ds-u-lg-padding-left--1,.ds-u-lg-padding-x--1{padding-left:8px!important}.ds-u-lg-padding-x--1{padding-right:8px!important}.ds-u-lg-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-lg-padding--2{padding:16px!important}.ds-u-lg-padding-top--2{padding-top:16px!important}.ds-u-lg-padding-right--2{padding-right:16px!important}.ds-u-lg-padding-bottom--2{padding-bottom:16px!important}.ds-u-lg-padding-left--2,.ds-u-lg-padding-x--2{padding-left:16px!important}.ds-u-lg-padding-x--2{padding-right:16px!important}.ds-u-lg-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-lg-padding--3{padding:24px!important}.ds-u-lg-padding-top--3{padding-top:24px!important}.ds-u-lg-padding-right--3{padding-right:24px!important}.ds-u-lg-padding-bottom--3{padding-bottom:24px!important}.ds-u-lg-padding-left--3,.ds-u-lg-padding-x--3{padding-left:24px!important}.ds-u-lg-padding-x--3{padding-right:24px!important}.ds-u-lg-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-lg-padding--4{padding:32px!important}.ds-u-lg-padding-top--4{padding-top:32px!important}.ds-u-lg-padding-right--4{padding-right:32px!important}.ds-u-lg-padding-bottom--4{padding-bottom:32px!important}.ds-u-lg-padding-left--4,.ds-u-lg-padding-x--4{padding-left:32px!important}.ds-u-lg-padding-x--4{padding-right:32px!important}.ds-u-lg-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-lg-padding--5{padding:40px!important}.ds-u-lg-padding-top--5{padding-top:40px!important}.ds-u-lg-padding-right--5{padding-right:40px!important}.ds-u-lg-padding-bottom--5{padding-bottom:40px!important}.ds-u-lg-padding-left--5,.ds-u-lg-padding-x--5{padding-left:40px!important}.ds-u-lg-padding-x--5{padding-right:40px!important}.ds-u-lg-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-lg-padding--6{padding:48px!important}.ds-u-lg-padding-top--6{padding-top:48px!important}.ds-u-lg-padding-right--6{padding-right:48px!important}.ds-u-lg-padding-bottom--6{padding-bottom:48px!important}.ds-u-lg-padding-left--6,.ds-u-lg-padding-x--6{padding-left:48px!important}.ds-u-lg-padding-x--6{padding-right:48px!important}.ds-u-lg-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-lg-padding--7{padding:56px!important}.ds-u-lg-padding-top--7{padding-top:56px!important}.ds-u-lg-padding-right--7{padding-right:56px!important}.ds-u-lg-padding-bottom--7{padding-bottom:56px!important}.ds-u-lg-padding-left--7,.ds-u-lg-padding-x--7{padding-left:56px!important}.ds-u-lg-padding-x--7{padding-right:56px!important}.ds-u-lg-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}@media (min-width:1280px){.ds-u-xl-padding--0{padding:0!important}.ds-u-xl-padding-top--0{padding-top:0!important}.ds-u-xl-padding-right--0{padding-right:0!important}.ds-u-xl-padding-bottom--0{padding-bottom:0!important}.ds-u-xl-padding-left--0,.ds-u-xl-padding-x--0{padding-left:0!important}.ds-u-xl-padding-x--0{padding-right:0!important}.ds-u-xl-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-xl-padding--1{padding:8px!important}.ds-u-xl-padding-top--1{padding-top:8px!important}.ds-u-xl-padding-right--1{padding-right:8px!important}.ds-u-xl-padding-bottom--1{padding-bottom:8px!important}.ds-u-xl-padding-left--1,.ds-u-xl-padding-x--1{padding-left:8px!important}.ds-u-xl-padding-x--1{padding-right:8px!important}.ds-u-xl-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-xl-padding--2{padding:16px!important}.ds-u-xl-padding-top--2{padding-top:16px!important}.ds-u-xl-padding-right--2{padding-right:16px!important}.ds-u-xl-padding-bottom--2{padding-bottom:16px!important}.ds-u-xl-padding-left--2,.ds-u-xl-padding-x--2{padding-left:16px!important}.ds-u-xl-padding-x--2{padding-right:16px!important}.ds-u-xl-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-xl-padding--3{padding:24px!important}.ds-u-xl-padding-top--3{padding-top:24px!important}.ds-u-xl-padding-right--3{padding-right:24px!important}.ds-u-xl-padding-bottom--3{padding-bottom:24px!important}.ds-u-xl-padding-left--3,.ds-u-xl-padding-x--3{padding-left:24px!important}.ds-u-xl-padding-x--3{padding-right:24px!important}.ds-u-xl-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-xl-padding--4{padding:32px!important}.ds-u-xl-padding-top--4{padding-top:32px!important}.ds-u-xl-padding-right--4{padding-right:32px!important}.ds-u-xl-padding-bottom--4{padding-bottom:32px!important}.ds-u-xl-padding-left--4,.ds-u-xl-padding-x--4{padding-left:32px!important}.ds-u-xl-padding-x--4{padding-right:32px!important}.ds-u-xl-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-xl-padding--5{padding:40px!important}.ds-u-xl-padding-top--5{padding-top:40px!important}.ds-u-xl-padding-right--5{padding-right:40px!important}.ds-u-xl-padding-bottom--5{padding-bottom:40px!important}.ds-u-xl-padding-left--5,.ds-u-xl-padding-x--5{padding-left:40px!important}.ds-u-xl-padding-x--5{padding-right:40px!important}.ds-u-xl-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-xl-padding--6{padding:48px!important}.ds-u-xl-padding-top--6{padding-top:48px!important}.ds-u-xl-padding-right--6{padding-right:48px!important}.ds-u-xl-padding-bottom--6{padding-bottom:48px!important}.ds-u-xl-padding-left--6,.ds-u-xl-padding-x--6{padding-left:48px!important}.ds-u-xl-padding-x--6{padding-right:48px!important}.ds-u-xl-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-xl-padding--7{padding:56px!important}.ds-u-xl-padding-top--7{padding-top:56px!important}.ds-u-xl-padding-right--7{padding-right:56px!important}.ds-u-xl-padding-bottom--7{padding-bottom:56px!important}.ds-u-xl-padding-left--7,.ds-u-xl-padding-x--7{padding-left:56px!important}.ds-u-xl-padding-x--7{padding-right:56px!important}.ds-u-xl-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}.ds-u-text-align--center{text-align:center!important}.ds-u-text-align--left{text-align:left!important}.ds-u-text-align--right{text-align:right!important}@media (min-width:544px){.ds-u-sm-text-align--center{text-align:center!important}.ds-u-sm-text-align--left{text-align:left!important}.ds-u-sm-text-align--right{text-align:right!important}}@media (min-width:768px){.ds-u-md-text-align--center{text-align:center!important}.ds-u-md-text-align--left{text-align:left!important}.ds-u-md-text-align--right{text-align:right!important}}@media (min-width:1024px){.ds-u-lg-text-align--center{text-align:center!important}.ds-u-lg-text-align--left{text-align:left!important}.ds-u-lg-text-align--right{text-align:right!important}}@media (min-width:1280px){.ds-u-xl-text-align--center{text-align:center!important}.ds-u-xl-text-align--left{text-align:left!important}.ds-u-xl-text-align--right{text-align:right!important}}.ds-u-text-decoration--underline{text-decoration:underline!important}.ds-u-text-decoration--none{text-decoration:none!important}.ds-u-text-transform--uppercase{text-transform:uppercase!important}.ds-u-text-transform--lowercase{text-transform:lowercase!important}.ds-u-text-transform--capitalize{text-transform:capitalize!important}.ds-u-truncate{max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.ds-u-valign--top{vertical-align:top!important}.ds-u-valign--middle{vertical-align:middle!important}.ds-u-valign--bottom{vertical-align:bottom!important}
\ No newline at end of file
+/*! Design System - Core v1.0.0-rc.1 */@font-face{font-family:Bitter;font-style:normal;font-weight:400;src:url(fonts/Bitter-Regular.eot);src:url(fonts/Bitter-Regular.eot?#iefix) format("embedded-opentype"),url(fonts/Bitter-Regular.woff2) format("woff2"),url(fonts/Bitter-Regular.woff) format("woff"),url(fonts/Bitter-Regular.ttf) format("truetype")}@font-face{font-family:Bitter;font-style:normal;font-weight:700;src:url(fonts/Bitter-Bold.eot);src:url(fonts/Bitter-Bold.eot?#iefix) format("embedded-opentype"),url(fonts/Bitter-Bold.woff2) format("woff2"),url(fonts/Bitter-Bold.woff) format("woff"),url(fonts/Bitter-Bold.ttf) format("truetype")}@font-face{font-family:Bitter;font-style:italic;font-weight:400;src:url(fonts/Bitter-Italic.eot);src:url(fonts/Bitter-Italic.eot?#iefix) format("embedded-opentype"),url(fonts/Bitter-Italic.woff2) format("woff2"),url(fonts/Bitter-Italic.woff) format("woff"),url(fonts/Bitter-Italic.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;src:url(fonts/OpenSans-Regular-webfont.eot);src:url(fonts/OpenSans-Regular-webfont.eot?#iefix) format("embedded-opentype"),url(fonts/OpenSans-Regular-webfont.woff2) format("woff2"),url(fonts/OpenSans-Regular-webfont.woff) format("woff"),url(fonts/OpenSans-Regular-webfont.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:italic;font-weight:400;src:url(fonts/OpenSans-Italic-webfont.eot);src:url(fonts/OpenSans-Italic-webfont.eot?#iefix) format("embedded-opentype"),url(fonts/OpenSans-Italic-webfont.woff2) format("woff2"),url(fonts/OpenSans-Italic-webfont.woff) format("woff"),url(fonts/OpenSans-Italic-webfont.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:normal;font-weight:600;src:url(fonts/OpenSans-Semibold-webfont.eot);src:url(fonts/OpenSans-Semibold-webfont.eot?#iefix) format("embedded-opentype"),url(fonts/OpenSans-Semibold-webfont.woff2) format("woff2"),url(fonts/OpenSans-Semibold-webfont.woff) format("woff"),url(fonts/OpenSans-Semibold-webfont.ttf) format("truetype")}@font-face{font-family:Open Sans;font-style:normal;font-weight:700;src:url(fonts/OpenSans-Bold-webfont.eot);src:url(fonts/OpenSans-Bold-webfont.eot?#iefix) format("embedded-opentype"),url(fonts/OpenSans-Bold-webfont.woff2) format("woff2"),url(fonts/OpenSans-Bold-webfont.woff) format("woff"),url(fonts/OpenSans-Bold-webfont.ttf) format("truetype")}.ds-base{color:#212121}.ds-base,.ds-base--inverse{font-family:Open Sans,Helvetica,sans-serif;font-size:16px;line-height:1.5}.ds-base--inverse{background-color:#112e51;color:#fff}.ds-display,.ds-h1,.ds-h2,.ds-h3,.ds-h4,.ds-h5,.ds-h6,.ds-title{line-height:1.3;margin:0}.ds-display,.ds-h1,.ds-h2,.ds-h3,.ds-h4{font-weight:700}.ds-h1,.ds-h2,.ds-h3,.ds-h4,.ds-h5,.ds-h6{margin-bottom:.5em;margin-top:1.5em}.ds-h1:first-child,.ds-h2:first-child,.ds-h3:first-child,.ds-h4:first-child,.ds-h5:first-child,.ds-h6:first-child{margin-top:0}.ds-h1:last-child,.ds-h2:last-child,.ds-h3:last-child,.ds-h4:last-child,.ds-h5:last-child,.ds-h6:last-child{margin-bottom:0}.ds-display{font-size:60px}.ds-title{font-size:48px;font-weight:400}.ds-h1{font-size:36px}.ds-h2{font-size:24px}.ds-h3{font-size:21px}.ds-h4{font-size:18px}.ds-h5{font-size:16px}.ds-h5,.ds-h6{font-weight:400;text-transform:uppercase}.ds-h6{color:#757575;font-size:14px;letter-spacing:1px}.ds-base--inverse .ds-h6{color:#bac5cf}.ds-text,.ds-text--lead{line-height:1.5;margin-bottom:1em;margin-top:1em}.ds-text--lead:first-child,.ds-text:first-child{margin-top:0}.ds-text--lead:last-child,.ds-text:last-child{margin-bottom:0}.ds-text{font-size:16px}.ds-text--lead{font-size:18px}.ds-c-alert{background-color:#e1f3f8;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASoAAAEqCAMAAACV5O0dAAACf1BMVEX///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAnoH6uAAAA1XRSTlMABAwUHCQsNDxEDic/WHGJorrT6/z/AR5HcJjB6sKZHwg9d6PM9M2keD4JTorF+ceLTxlgnNfYMH7L/gdJluJXrjGT7RNuzwJIqmja238i9fap/aw3KrC0G58dEIj3EXPudFvhJr28Bvh7BUDVO1/oraYP4986gwMhxsRZ8fDDGsldyjbm4Oc4Q2G1kLeCuxJV3Cvl6S817O/yRk1TWvtR89m4jgrOI4SdSm2bgSmSC2MoILEYhlCyFnY5lciUhbYVr7NLnoBU0VZFq9SgeZHkmg1M0I1bEDoHAAAKgUlEQVR4AezJMwIDQQAAwL21jVP8/z+mjNGF0w54Jx1EmFDGheCMEoxgd7x/UmljnQ8x5XIhpxi8s0YrCX5Ybf0wTnN50rxYDv2qgh+z3mx3e3LoAduWI4AC6Im9lHuibyM/z7Zt27Zt27bfNDOEq+ru6uo9hP32HV3w7v2Hj58+wxq++ffLfx50i4enl/c3UJuPr58/BQnw8/WBogKDgkMoVEhwUCBUExoWHkFNRISHhSr0FBn1jhp6FxWpxlZ0TCw1FxsTDZOLi0+gThLi42BaiUnJHtSRR3JSIszoZUoqdZeW8hlmExf0lIZ4mv4NzCQjJpOGyQr/DmbxQ7aNhsrJzYMZ5BdQAoXfQ3ZFfjZKIae4BDIrLcuiNMq/VEBWoZWxlEpV9UtIqaaW0qmtgXzq6imlhu8gl8agJkqqvLkFEmkNoMTa2iGLuGLKLeR5KaTQ8Tul1xkJ41V00RS6e2CwX3tpEn39MNJXAzk0DVv6IAwzNExTGXkBg4yO0WTGf4MRXhZThPEJv38c4DcxThGKX0J3k1MUoGoaDpuuogAzRdDZ7BwFmPeBE3zmKcDCInQ13UQBQpbglKUQCtC0DP0kelGIFThphUKsDkInPWsUYx1OWqcYG5vQRUYABdmCk7YoyHYddLCzS1GS4KQkirK3D80dHFKFKh71Q2Otx1Sjipkn0NRpOVWposcZNHR+QXWqaFuGZlJyqFIVQ/7WbIpUq4r8G5o4z1GvKqQDGji9oHpVtF1CuNZyqljFpiUIdnBMNat4lQehdg6pahVjv4dAGbtUt4pzGRCm9JoqV/G6FIIM3lDtKt4MQoxbql7FWwixTPWruAwB+j2sUOXRD7eVdNIKVewsgZvu7mmNKt7fwT3dtEoVu+EWX1qnih1ww8OVlaquHuCyr6ZopSpOfQVXPdJaVXyEiz7lWK0q5xNcUlpLq1WxthSuyKb1qpgNF5zTilX8n727YG5bXcI4/tgODhc2Ze45genoQtm5zKfMzOhMuQ0MlJmZMcxMZWbGD3QbJsdaRX6VibS/DxD4hxzp1e4NGHaqvzNT9T8Fo3JJvTwYlEfq5cKgdWSBfBiUTxZYB0Pi08gCBTCogCyQFg8jCskKBxfCkIUHyQqFMKBII0vMhyHzyRJaEdiidpJFikvAVlJMFtkZBa5Sskxi4fWwMoaw64WJZJlSMGXuJ4fbnwmeBHK8BLB4tkuq7R5wHCMSx8BQrhEJrRz6okn8FA1dY70kfvKOhZ50ErXSoSOCRL0IBFZBol4FAirzkqjnLeNeEBIFCKDSR42ErxLtq6JmRBXa5V5GzYhlbrSnDwneg12ulSRaWOmCf9XUiqiGf7dJ8F6GVt6kVsTNO/DnLok2lsKf0STa6A4/7pHwI1z+/eO6jzYyr5BKvzwYdcyMhyfPU6dYFo/WNpJCNx+thWmn+1Nn+Ctae6yyVCyC4ckZ6gRP0UqJj9R5FKwpwF6y3i+D0dItle9sLYLkGXWC52jpBanzAMHykjrBwFYzGc+TOqMQLK+oE+yPQnOHOv3+v/WHsdkucq8US6pkNNddUrXvNZopJ0kVQDl33pmkmsA9KCSpotEkUVIFkohG80hSBTQPDd5IqsDeoEGxpAqsGA1+lVSB/Yo6cPeUVIH1dKPOW5JUOt6izmRJpWcy6ryTVHreoc57SaXnPWqlaJJKj5aCGqtIUulahRp/kFT6/oAaMZJKXwxqfJBU+j6gxm5JpW83alyRVPqu4Kc7JKkY7gC4IKk4LgDoLak4enOnpEqqkQA+SiqOjwA+SSqOTwB+k1QcvwEYQKoV2yHVAACTSLXHdkg1CUAqqfbZDqlSARepF2mDVOSCm9RLdNsglRsessDvirp+Kg9CyAq+LxMixrbxtSulCkEoMdh+hjFDKMIkFU8YwiUVTzgiJBVPBCIlFU8kvkkqnm+Sip9KfgCZIuXXOleEvFjgCpeXoFxh8o8NVyhCJBVPCDySiscDt6TiccMlqXhcQKqk4kjl3tySVJO4t0wl1QDujXhJ9Rv3eIek+sQ9NCSpPnKPokmqkdwDjpKqN/fYrKS6wD2MLanuMI/4S6or3AdHJNVu7uNIkuoD9yE3SRXDfXRSUv2B+0CupFrFfMxbUmkpzOEBkuo9dySFpHrHHXQiqSZzx+dIqrfMoUySqqebOepLUv3KHSAnqYq5Ywkl1RvusEtJNY85QlVSJXIH80qqaO64Z0k1gTtEXFKVM0fTS6rX3IUHkiqZu0ZDUl1kLmeRVPujmCt/JNVA7iIpSfWcuZ5MUv0ymLn0TlI95a5SlFR/ZS7olFTL4plrXyXVfe4yYUkVzlxRLam6cxefS6qlzHX6kurmHfh1m9TRvkf3bWM2DJrdt43o7xqpUwH/qkmVGT/ioEzcjxmkSjX8c61UVSoSSkWqarXShXb0ITVGQLERpEYftMe9jFSYOhiKDZ5KKixzozXF1433Qrm9pEIV2lfpIwVyoVwuKeCrRAAF6mcYK3GMFChAIGVeSdXAW4aAKiRVgwoEFiGpGkRAR7qkqpMOPWO9kqqGdyx0RUuqGtHQV64RSSqtnPluJdUxcHi2S6rtHrAkSKoE8GTud3qq/ZlgKnV6qlJwRe10dqqdUWAr0pycSiuCAYVOTlUII+LTnJsqLR6GrHNuqnUwKNepqXJh1Kn+zkzV/xQMu+HMVDfQAdOdmGo6OmLhSuelWrkQHRI7w2mpZsSig3KclioHHeXa7axUu13osOxUJ6VKzYYJI52UaiNM2eKcVFtgTmaWU1JlZcKkBZvIrGIoV0xmbVoA05I0MukolDtKJmlJCIIjZNI2KLeNTDqCoMhQfwWIT83VtQwER0o6mXMmE0plniFz0lMQJAvTyJx+2VAoux+Zk7YQQTNlP5kzrXhkeJkS4SOLp5E556YgiML+SbZ16SyCalYq2dSViwiywz6ypcXrEHS3epIN3bwGBTZ6yXZm3IASfch2JkCRPl6ylRkToMyRnmQjN29Aoesa2cbia1Dq6lSyiSvroFjSZbKFSxeh3IXzZAPnzsICq85QlzdmCixx6iR1cce3wiIpx6hL+/1/YZ0jPuqyfHtgqUMH/18ePDS6FYVRAN2xnf1sm7Gebdu1bbc/vPNO6nu+c7MWNfXtKwy2/4Va+vQRhms6oIYOmqBC4D018+4tFGl8Q628fgVlXq7EqY3NFxao9PwZNfHUD8WePKYWHp1CvbGHFC/2ACIcNeQo28E0pLh/j4Kl7kKQO7dPKNStzE3I4rhBka5fgzyXVxTn6hIiNV2cU5TziyZIddp3QjFO+k4h2eHBJkXYPDiEdM49CrDnhA62tzap1ObWNnThKK5TmfWiAzqxrdRRiboVG3TTs7hMwy0v9kBHc/MLAzTQwML8HLQ1PTNLg8zOTENzE5NT/O+mJidgBvmx8Xb+R+3jY3mYRr5QLPG/KBULeZhNOpPN8Z/KZTNpmNTIaCLJfySZGB2Budl6+/oH+FcG+vt6bSgPTc0trW3t/APtba0tzU0oMxWVVdU1tXX8RXW1NdVVlRUoY16fPxAMhSPRWJz8UTwWjYRDwYDf54VcClisNrvD6XJ7PG6X02G3WS0Q5DvmKXzffMJwPwAAAABJRU5ErkJggg==');background-image:url('data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Capa_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%22216px%22%20height%3D%22146px%22%20viewBox%3D%220%200%20216%20146%22%20enable-background%3D%22new%200%200%20216%20146%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20d%3D%22M162.18%2C41.592c-5.595-9.586-13.185-17.176-22.771-22.771c-9.588-5.595-20.055-8.392-31.408-8.392%20c-11.352%2C0-21.822%2C2.797-31.408%2C8.392c-9.587%2C5.594-17.177%2C13.184-22.772%2C22.771C48.225%2C51.179%2C45.428%2C61.649%2C45.428%2C73%20c0%2C11.352%2C2.798%2C21.82%2C8.392%2C31.408c5.595%2C9.585%2C13.185%2C17.176%2C22.772%2C22.771c9.587%2C5.595%2C20.056%2C8.392%2C31.408%2C8.392%20c11.352%2C0%2C21.822-2.797%2C31.408-8.392c9.586-5.594%2C17.176-13.185%2C22.771-22.771c5.594-9.587%2C8.391-20.057%2C8.391-31.408%20C170.57%2C61.648%2C167.773%2C51.178%2C162.18%2C41.592z%20M97.572%2C26.071c0-0.761%2C0.244-1.385%2C0.733-1.874c0.489-0.488%2C1.114-0.733%2C1.874-0.733%20h15.644c0.76%2C0%2C1.385%2C0.245%2C1.872%2C0.733c0.488%2C0.489%2C0.734%2C1.113%2C0.734%2C1.874v13.036c0%2C0.76-0.246%2C1.385-0.734%2C1.873%20c-0.487%2C0.489-1.112%2C0.733-1.872%2C0.733h-15.644c-0.76%2C0-1.385-0.244-1.874-0.733c-0.489-0.488-0.733-1.113-0.733-1.873V26.071z%20%20M128.857%2C112.107c0%2C0.76-0.246%2C1.385-0.733%2C1.872c-0.487%2C0.489-1.112%2C0.733-1.874%2C0.733h-36.5c-0.761%2C0-1.385-0.244-1.874-0.733%20c-0.489-0.488-0.733-1.113-0.733-1.873V99.07c0-0.762%2C0.244-1.385%2C0.733-1.874c0.489-0.488%2C1.114-0.733%2C1.874-0.733h7.822V70.392%20H89.75c-0.761%2C0-1.385-0.244-1.874-0.733c-0.489-0.488-0.733-1.113-0.733-1.874V54.75c0-0.761%2C0.244-1.385%2C0.733-1.874%20c0.489-0.489%2C1.114-0.733%2C1.874-0.733h26.073c0.76%2C0%2C1.385%2C0.244%2C1.872%2C0.733c0.488%2C0.489%2C0.734%2C1.113%2C0.734%2C1.874v41.714h7.82%20c0.761%2C0%2C1.386%2C0.245%2C1.874%2C0.733c0.487%2C0.488%2C0.733%2C1.113%2C0.733%2C1.874V112.107z%22%2F%3E%3C%2Fsvg%3E');background-position:8px 15.2px;background-repeat:no-repeat;background-size:40px;border:1px solid #9bdaf1;-webkit-box-sizing:border-box;box-sizing:border-box;color:#212121;min-height:56px;padding:16px}.ds-c-alert a{color:#205493}.ds-c-alert a:focus,.ds-c-alert a:hover{color:#112e51}.ds-c-alert ul:last-child{margin-bottom:0}.ds-c-alert ul:first-child{margin-top:0}.ds-c-alert__body{padding-left:40px}.ds-c-alert__heading{font-size:18px;font-weight:700;margin-bottom:4px;margin-top:0}.ds-c-alert__text{margin-bottom:0;margin-top:0}.ds-c-alert--error{background-color:#f9dede;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASoAAAEqCAMAAACV5O0dAAAC4lBMVEX///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD9upd0AAAA9nRSTlMABAwUHCQsNDxEDic/WHGJorrT6/z/AR5HcJjB6sKZHwg9d6PM9M2keD4JTorF+ceLTxlgnNfYMH7L/gdJluJXrjGT7RNuzwJIqmja238i9fap/aw3KrC0G58dEIj3EXPudFvhJr28Bvh7BUDVO1/oraYP4986gwMhxsRZ8fAayco25uc4XWGQt7sS3Cvl6S817O/yRk1TWvtRQ/OBMijZfAq4VPqOVjM5zkFQI1VcXoRjZmptdYadjZKUmpuhKcO/viDksQsYLrJLFnZKYmmVtoevgp6Xs6XRyODW3UWr1BWgZWx5kYWojEzSFyUtUm+PwHoNtX0RNC9mAAAMEUlEQVR4AezBA3bAQBQAwJ9sbLtu6ti8/7H6XNubzsBvQpCIohmW43mOZWgKkQT8u0UQJVlRNd0wLfsByzR0TVVkSRRgwxzX84Mwsl8p2tn1vT0HNmb/4PDoOLbfIT45PTu/gG1Al1dJan9ImuUFAryVVd3Yn6StqxIw1fXDaH+qceg7wM00L6v9JdZlngAb0zW39YB0ZxCEUbhjl/K9sVGKzd+Oc23bjG3bq80mBt3zLOGUztj4fmi0f3zMjVoTk1PQbmpygoSbnpmFIbMz0yTW3PzCYRh0eGF+TuZmXroM465ckren02e3wYptV2XN6bXJ67DmxsgykmLFTQ9W+fwBkiAYAgPh5cRd5KQHFnzRGHEWT9wAG8mDKeLqQnoKrGSyu4ilXB7s5HPET6EIlkrczqF8tgKmktUaMVI/DcYaTeJiOgrezu+IEwut9WCvPUb2pToQodsjy9b2IcRgSDYtuuWDGN7V22TNnbsQ5d5OsuT+AwjzcB3ZsCsKgaK7yLhHjyHSkwgZ9vQZhHr+gox6WYFYlVdkztxRiPba2DX03kC4t+/IiGunId77Ahnw4SMc8OkzafflK5zwbUia1b/DEdd/kFY/k3DG4V+k0e8/cIincbAu+eCU85u1lYJzNLX67YNzzrdIg59/4CDvr4ZLSMJJlX//2bsH70izLQrguyoea6dtq8ZKnt22lXnp17bGk/XatsNK27ZtjG3zeRlvZbWVfPek7j29pr7fn7CLqZyzDyJs2kz+TGW2QkRNms6frd/HI4KaTKYNk7PuzM7xLPvOrMm0YUQTREzHXFowLy8MQ+G8ebQgtyMi5Nl8K0kthMD8RbQg/1lExmLaUB4iv6MNixERY2jFixBZQivGIAKGhWjFUogspRWhYSi2DgNoxzKILKMdAzqgmMLLaUkfiKygJcvDKJ5BtKUkRP5CWwahWB6lNXUgspLW9IccVmXSmtUQ+TWtyVwFsUAG7VkDkbW0JyMAqXW0aD1ENtCidRCq1YIWbYTIJlrUohZEOqbTprsgspk2pXeERHNaVRMiebSqOQTm0q7GEFlHu+bC2ISytGsLRB6iXWUnwNRWWrYNIttp2VYY6kPbdkBkJ23rAyOpubRtF0R207bcVJjIonX3QKQ5rcuCgT0hWtccIm1oXWgPPEveS/vaQGQc7dubDK/W04FxENlHB9bDo/AIOrAfIs/TgRFheNOLLtSDyHK60AuexLxEF6pCpC9deCkGXoylE/dBZCKdGAsPDoToREOIHKQToQMoWg26kQ6R++lGDRTpyRS6MQAimXQj5UkUJZ+OzIDIIjqSjyIk0pVmkPgznUlE4Q7RlRaQqE1nDqFQOSl0JgCBjnQmJQeF2UV3DkPgCN3ZhUIc6Ul3JkCgAt3peQQ3t4UOPQKBbnRoC24qmEaHDkDgKB1KC+JmStGl2yEw7dZY7Aqk06WjEKhEl9IDgikvC6ZBIIlOrcSNHaNTiRA4TqcO4YaOzKNTCyAwh07NO4EbOUm3TkFgLt3qiht5nG7Nh8BpunWf99l5i+6EwBk6liD8809/9rkUHTuL64Rn0rENEKhJx9JSca3+dG0TBBrTtV/jWufo2jMQeJWuvYZrHO5J13pBYDFdq1YRV5tP516HwC/p3HFc7Q06dzcEttK58rjKn6fQubEQqEHnRiTjSqPo3psQaEn3puFKW+jeGxB4i+4Nx5Xuo3tvQ2A83XsHVzhABS0hUI4KDmj3nb0FgQwqaKD7uULeC4F3qKAGLhtKBWUg8AQVDMUl7ajhXQi8Rw3tcNESavgTBEZSwxJctJ0a3odAGjVsx0XVqeEDCDSjhuq4IPgANRyEQAtqeCCI8z6kivthrjd1fIjzGlPFTJgLUkdjnPcRVYRg7g/U8RHO+5g6kmGsHXV8jAJ4NkQdqTDWhDpCz6JANyq5DcZaU0k3FHiYSj6Bsd9SycMoUJNKYmFsFJXURIFPqWQVjPWhkk9RIINKWsNYSSrJQIGZVPJbGHuYVPy+fIJaRklqebWcADCVWu6AsdHUMlXz5c9ZMPYZtZQE8Ci1zIaxz6nlUQBfUMtCGHuGWr4A8CW1/BXGelHLlwDqU8tpGBtOLfUBlKOWMzBWl1rKAWhELaVg7EtqaQQgk1oqw1h5askEAlTzFIx9SjUBBKnmKxj7mmqCiKGab2DsNaqJQSzV/A7GzlFNLOKoZieM7aeaOMRTzW4Yq0c18Uigmq9hrDrVJCCRal6DsY+pJhFJVHMOxhpRTRK+pZq/wdgQqvlWM6oXYKysZlRJVPM0jM2kmiQkUs13MBaimkQkUE0uTCVTTwLiqeY9mKpIPfGIo5qRMDWYeuIQSzVpMPU99cQihmqawlQJ6olBkGoegKkfqCeIAPU8C0M/Uk8AyKSaMAwlUE2m7l+gXWAokar/3CpHNUdgaAFV/2Van2oqwNApqqmv+g9bdoOhn6jmS/nQkEqJ6otUHRp6lGqmwdAYqo6ilaSaRBhqQDUl5WOzKiWq/6CaqfJhbJUS1cpUc0L3R9j5MPQUtczUXRzhnTC0hVoylGeW+sPQNmr5VGfJTV6iepZaauqs+MhLVB+jlod1FnLlJapVqKWbzpq3vJhwOZWEnlUeL/kAZnKo5WOc9xG1PAQTwadJ5UqKxlTzz47w7Id/UU1jnPch9czY8lP8EQ+Wzn1sHvV86LGUyfdA0OOEpa+61wI533ave+a+JV6rjnztPFao+oZ6Leb11fD6876vgdcScd8Bj9X0vne8/mjtG+61bcw3zeNxFt+IZI8nf3zlvR6S8h33eJ7MV62ix11z32teTyn6fm3hQKfMe/X/XcqDu87Wm0cBGwc6sYsKFp38M7yaNpEKzlo4JizR7O8w8J/H6V6ChRPVEhthpFIKXbtP//C57OjPf+laVwvn9CXqwtDrFLBwTh/H6Nidt3wv7yHc2Eo69hcY+gsdW4kbC6T7UV0tPYCbKOVH5bVjMpjmR3WltKDHYWc/qi24uSM9/agu63kEhdjlR3XZLhQmJ8WP6qKUHBTqkB/VRYdQuEQ/Ks/bivl+VOfloyhPpvhRFUh5EkWq4UdVoAaKdiBE+lGFDsCDsaQf1Vh4EfOSH9VLMfCklx9VL3gTHhHtUY0Iw6P10R7VeniVvDe6o9qbDM/2hKI5qtAeGMiK5qiyYCI1N3qjyk2FkT7RG1UfGNoarVFthakJZaMzqrITYGxudEY1FwLNozGq5pDomB59UaV3hEitFtEWVYtaEFoXbVGtg1QgI7qiyghAbFVmNEWVuQqQezSaouqPYhkUPVENQvGEl0dLVMvDKKYOA2jNwzBUh9YM6IBiGxaiLXkwdJK2hIYhAsbQlja3Ti3hGETEYlrywDIYiZ1JSxYjMp7NpyUTgzBxiJbkP4sI6ZhLS/r+Fp4Fd9OS3I6ImCYjaMminaezczzYM/t/E2nJ5CaIoPjf8//l3GNinUEABdAbJ8+6sW3btm3bSW3b1hK6uG6h/2t8mJmchRxlvXgMTY1+oqJePYfGPm5SSXM70NwHHxX0/g10sF9N5Qy/gy6iVPzOdPKlmkoZ7oZu9n1UyPt30NHnTSpj7g109fETFfFqBzq70UIlvHgO3T2+SQU8eQwD9JdTeuX9MMSx9C3Y/WMYpCOXUivsgHHuzFFam3dgqBtPKKmbN2Cwq9copWtXYbjEKUpoKhFmsF+hZC5fgkkSLlIqF87DNOf6fJTG8Fk/mOnMaUrilA0mOz6iFA7nYb6GAwrPuw8hzMRXU2xTrRDF3i4FVr4DgWxvzVFQm5UbEEvQOoW0tgrxLK9QOCvLEFLi0iKFsriUCFHN585RGHO58xDZ9NQwhTA8NQ3RBU9QABPBkMHoyDBNNTwyClkE1Q3SNIN1QZBJQF8sTRHbFwDZZHf30nC93dmQUUdnVz4NlN/V2QFptba10yDtba2QXFNzC3XX0twEFdQ0NKZRR2mNDTVQRk1tXT11UV9XWwPVVFRWVVNT1VWVFVBUcUlpGTVSVlpSDLUF5OTm5fO/5Ofl5gTgZEhMSk5JTeM/SEtNSU5KxAkTHhEZFR0Tyz8UGxMdFRkRjhPMYrXZHU6X2+P18Ts+r8ftcjrsNqsFAhCHn39AYFBwSGhYWGhIcFBggL8fBPIVh3N6NXOFoY0AAAAASUVORK5CYII=');background-image:url('data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Capa_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%22216px%22%20height%3D%22146px%22%20viewBox%3D%220%200%20216%20146%22%20enable-background%3D%22new%200%200%20216%20146%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20d%3D%22M162.18%2C41.592c-5.595-9.586-13.185-17.176-22.771-22.771c-9.588-5.595-20.055-8.392-31.408-8.392%20c-11.352%2C0-21.821%2C2.797-31.408%2C8.392c-9.587%2C5.594-17.177%2C13.184-22.772%2C22.771C48.225%2C51.179%2C45.428%2C61.649%2C45.428%2C73%20c0%2C11.351%2C2.798%2C21.82%2C8.392%2C31.408c5.595%2C9.584%2C13.185%2C17.176%2C22.772%2C22.771c9.587%2C5.595%2C20.056%2C8.392%2C31.408%2C8.392%20c11.352%2C0%2C21.822-2.797%2C31.408-8.392c9.586-5.594%2C17.176-13.185%2C22.771-22.771c5.594-9.588%2C8.391-20.058%2C8.391-31.408%20C170.57%2C61.649%2C167.773%2C51.178%2C162.18%2C41.592z%20M118.43%2C112.025c0%2C0.761-0.246%2C1.398-0.734%2C1.914s-1.086%2C0.773-1.793%2C0.773H100.26%20c-0.706%2C0-1.331-0.271-1.874-0.814c-0.543-0.543-0.814-1.168-0.814-1.873V96.546c0-0.706%2C0.271-1.331%2C0.814-1.874%20c0.543-0.543%2C1.168-0.814%2C1.874-0.814h15.643c0.707%2C0%2C1.306%2C0.258%2C1.793%2C0.773c0.488%2C0.518%2C0.734%2C1.154%2C0.734%2C1.915V112.025z%20%20M118.266%2C83.999c-0.055%2C0.543-0.339%2C1.019-0.854%2C1.426c-0.517%2C0.407-1.154%2C0.61-1.914%2C0.61h-15.073%20c-0.761%2C0-1.413-0.203-1.956-0.61c-0.543-0.407-0.815-0.883-0.815-1.426l-1.385-50.595c0-0.653%2C0.271-1.141%2C0.814-1.467%20c0.544-0.434%2C1.196-0.652%2C1.956-0.652h17.926c0.761%2C0%2C1.412%2C0.217%2C1.955%2C0.652c0.543%2C0.326%2C0.813%2C0.815%2C0.813%2C1.467L118.266%2C83.999z%20%22%2F%3E%3C%2Fsvg%3E');border-color:#e59393}.ds-c-alert--warn{background-color:#fff1d2;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVwAAAFCCAQAAAAXw61MAAAMHklEQVR4Ae3dA3hlSxpG4TWdHhvXY9u2bdu2bdu2bdu2bXvmKu18Y2P/3fdUnV2d9byPjS9c+VNEC8aROR1X5M489Y/uzBU5HUcOiyWyIOLQXJv38yvyX/yK93NtDh3kcGeEPbgPPyUTfsp92CPI4c4Ap+a5bCZFm3kupw5yuEvFLdhKdtJWbhHkcJeEw/Jcsouey2GDHG53HIdPkUPgUxwnyOF2xfn5JTmEfsn5gxxuN5ySVbIAq5wyqMtwxeH4ElmQL3G40IHDFU8jC/S0IIfbHFckC3bFIIfbFMflt2TBfsdxgxxuQ7ybNPDuIIfbDJckjVwyyOE2wQa+RBr5EhuCHG4D3IA0dIOwcA5XHJ4fkYZ+xOHDgjlccXfS2N3DQjlccUx+Txr7PccMC+RwxeNJB48PC+NwxQnZQjrYwgmDFjRc8TLSycuCFjJccWbWSCdrnDloAcMV7yUdvTeow3DNvObfsYdr5jX/jj9cM6/5d/zhmnnNv+MP18xr/h1/uGZe82+/4Zp5zb8O18xr/u03XDOv+dfhmnnNv12Ga+Y1/zpcM6/5t8NwzbzmX4dr5jX/LnS4Zt4fkxn5sfm3MFxxDzIz9wha8HDNvOZfh2vmNf/2G66Z1/zrcM285t9+wzXzmn8drpnX/NtvuGZe86/DNfOaf6vDFTckA7hh0AKGa+Y1/zpcM6/5t4wIjsXvySB+z7GCSIGZ1/zrcM285t8ZDNfMa/51uGZe82+Vw30fGdD7HK6Zd0DmX8y8IzL/mnmHZP418w7J/GvmHZL5dz1n3v3J4PZfv/nXzDsk86+ZdyDmX4f7crKbeLnDNfMOw/xr5h2D+dfhcimym7mUwzXzmn+HYOYdkvnXzDsk86+Zd0jmXzPvkMy/Zt4hmX/NvEMy/5p558z863A5y7CZt26NszhcM6/51+Gaec2/DtfMa/7FzGv+HZKZ1/w7JDOv+XdIZl7z7yw53CeQdegJDtfMa/6dITOv+XdIZl7z75DMvObfIZl5zb8Od2aZ98tknfvyrPKvwzXzmn/NvObfGXG49yR/pns6XDOv+Xc2zLzmX4c7m8y7lfydtnJCh7u+M+/neDCX4OwNXIIH8znzb52Zt+pgbsuGxr95vi0Hm39rzLw1P+LEoT1OzPfNvxVm3ooDOX3og5PwC/PvOhsuK40y71NDPzysUf5dcbjrLfNeP/TDZcy/08y8FWft++Ol+XeambfinKEfzmf+nWbmrbhQ6IdLmH+nmXkrLhP64Urm33UzXE7UNPNeNfTDdZrm3xM53AEy75C/VbiZ17/TzLwVtwz9cAevf9fLcN9PmrpT6Id7kabeH8Zn5q24T+iHh3j9O83MW/HQ0A+PI1PMv2Rw3Ig09/jQD88gzd0ojM3MW/GM0A8v8vp3mpm34kWhH17j9e80M2/Fq0M/vM3r32lm3oq3hn74gNe/08y8szt84VNkivmXDItXkE4+EfrhK6STV4RRmXkrvhj64XtkivnXzFvx7dBP5VjS/GvmrfhJ6IcDyRTzr5m34nehH3aQKeZfM2/F5tALhyXTzL9m3poNoQ+OTqaZf828NUcMfbAfmWb+NfPW7BH64CRkmvnXzFtz3NAHpyPTzL9m3pqThz44B5lm/jXz1pwh9MGFyDTzr5m35lyhDy5Dppl/zbw1Fwl9cDUyzfxLhsGlydJcNvTBDcjSXDqMwsxbc/XQB7ci08y/Zt6aG4Q+uAuZZv4lQ+AI/IQs0a1CH9yPLNFPOEIYgZm35s6hDx5Bppl/zbw19w198CQyzfxLBsATyZI9LPTBc8iSPTHMn5l3Zi2fl5Fp5l8zb80zQx+8gUwz/5KZ46yskaV7ceiDd5GlW+OsYd7MvDWvCX3wETLN/GvmrXlb6IPPkWnmXzPvzD4D8Q0yzfxr5q35ZOiDH5Fp5l8zb82XQh/8hkwz/5p5a74T+mATmWb+NfPW/DT0wAZSYf4189b8PvTAEUmF+dfMW7Ml9MAepML8a+atWgntcTxSYf6da+bN7BwptMcpyNzMM/+aeav2DO1xZlJh/jXzVh0/tMd5SYX518xbdYrQHhcnFeZfM2/VmUJ7XJFUmH/NvFXnDu1xbVJh/iWzwr3ITF00tMdNyUzdy+H+T+zB/mSmLhfa4/akwvxr5q26xpz+sMj8a+atumFojweTCvOvmbfq1qE9HksqzL9m3qq7hPZ4Oqkw/5p5q+4X2uOFpML8a+atenhoj1eTCvPvXDLvV8jMPTG0x1vJzH1lHvnXzFv1rDl9w2T+NfNWvSS0xydJhfnXzFv12tAeXyYV5l8zb9XbQ3t8lwxgf/ZwuE8kQ/hAaI+fkwrzr5m36lOhPQ4gFeZfM2/Vl0N7bCcV5l8zb9V3Q2schtSYf8kS8QEyjJ+F1jgaGcgHwvKYeav2D62xL6kx/5p5q7aF1jgxqTH/kiXhxmQwG0NbnJYM5sZhOcy8dUcJbXF2UmP+NfPW7RXa4oKkxvxr5q07wXx+XDX/mnnrThna4qqkxvxr5q07c2iL65Ma8y/pjleSIZ0ntMUtyZBeGXoz89ZdLLTFnUmN+dfMW3f50Bb3JTXmX9IVlyHDumZoi4eTYV0m9GTmrbuRv22ZT/4189bdJrTFs0mN+XdGmddGxKtJjfnXzFv31tASh+V3pMb8a+atW+UUoR1uQ6rMv5h5qfsFZwxtcFPWSJX5l3TBidlKGN8ab+bSnICNYTE4HCfjenye7Ba2cuL+wzXz1m3n9wuyRnae+dfMOyTzr5l3SOZfM++QzL9m3iGZf828QzL/mnmHZP418w7J/Ns68x5AtC4dwB7jDvdJROvWk0I7Zt4hmX/NvEMy/5p5h2T+NfMOyfxr5h2S+dfMOyTzr5l3SOZfM++QzL9m3iGZf828QzL/mnmHZP418w7J/GvmHZL5lywQZyP/g3S2ZQ/XzLvKZ/j4gnyGVfNv++GaeV/DaVhZcGc8Da8x/7Ybrpl3B9cLbXA9dph/2wzXzPvI0A6PNP/WmXnrvsPhQjscju+Yf3sP995kt/f00BZPJ7u9e/cerpn3ZqEtbmb+rTLz1l08tMXFzb9VZt4hh2v+NfMOOVzzr5l3yOGaf828Qw7X/GvmHXK45l8zr8OdW/7tMNybkDE53Bm4yZKGyxH4qcPdZQ73p4ck/5p5hxyu+dfMO+Rwzb9m3iGHa/418w45XPOvmXfI4Zp/zbwOd9nO1m+4H3S4C+NwPxh2npl3yOGaf3cl837V4S6Uw/3qzudfM++QwzX/mnmHHK7518w75HDNv2beIYdr/jXzDjlc86+Zd8jhmn9JGa8i43K4A3hVqDLzDjlc86+Zd8jhmn9JCZcl43O4A7hsqDDzDjlc86+Zd8jhmn/NvEMO1/xr5h1yuOZfM++QwzX/mnmHHK7518w75HDNv2beIYdr/jXzDjlc86+Zt2pWr+6Yf828VbN658z8a+atav+y5GH5Dqkx/5p561q/5ftQUmX+NfPWtX09/ZpsI1XmXzPvznoNp2ElLA4rnIZXkzrMv5h5d8Uqn+HjC/IZVkmB+bcw3CcTaSaeXBuumXcA5l8z75DMv2beIZl/zbxDMv+aeYdk/jXzDsn8a+YdkvnXzDsk8y/5O+5DpBm7z38ZLnuaeWfP/Ltn+Asz75DMv+TP2MfMOwTz7z7/Otz7EmkA9/2n4bKRHxNpAD9m4z+GeyUiDeJK/xjue4g0iPeEQOAURBrIKYLhYUiGCALPI9JAnhcIvI9IA3lfIPBdIg3kuwFW2EakgWxjBY5LpMEcF05DpMGcBo7AGpEGssYRCPyASAP5QSDwTiIN5J0BH4TScJ4UCNyKSAO5VcB/uqThnC0QAp8k0iA+GQIhcDUiDeJq/xjuCt8n0gC+z8o/H0vekUgDuGP45+Eemf2JNHP7c+R/GW7g/kSaufuHfx/uCu8n0oy9n5X/GG5gb35GpJn6GXuH/zLcwHnZRqQZ2sZ5w/8YbuAuRJqhu4T/M9zAc4g0M88JE8MN3IzNRJqJzdwsFIYbOAPfIdIMfIczhOJwA0fltURastdy1FAa7j9wQ75IpCX5IjcM/wv5vzg3L2ELkTrawks498QyM4k9uBtfYJU0Jq3yBe7GHmEKKeJQ7MO5uA7343m8fIGk53E/rsO52IdDhZo/ALck8MBl9HzEAAAAAElFTkSuQmCC');background-image:url('data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Capa_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%22216px%22%20height%3D%22146px%22%20viewBox%3D%220%200%20216%20146%22%20enable-background%3D%22new%200%200%20216%20146%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20d%3D%22M179.695%2C125.388L117.126%2C10.673c-0.924-1.684-2.2-3.015-3.832-3.992c-1.628-0.978-3.394-1.467-5.295-1.467%20c-1.901%2C0-3.667%2C0.49-5.296%2C1.467s-2.906%2C2.308-3.829%2C3.992L36.303%2C125.388c-1.901%2C3.423-1.847%2C6.845%2C0.163%2C10.267%20c0.924%2C1.574%2C2.187%2C2.824%2C3.789%2C3.746c1.603%2C0.924%2C3.327%2C1.387%2C5.174%2C1.387H170.57c1.849%2C0%2C3.572-0.463%2C5.175-1.387%20c1.603-0.922%2C2.864-2.172%2C3.789-3.746C181.544%2C132.232%2C181.598%2C128.811%2C179.695%2C125.388z%20M118.43%2C117.24%20c0%2C0.76-0.259%2C1.398-0.773%2C1.914c-0.516%2C0.516-1.127%2C0.773-1.834%2C0.773H100.18c-0.706%2C0-1.317-0.257-1.833-0.773%20c-0.516-0.517-0.774-1.154-0.774-1.914v-15.48c0-0.76%2C0.258-1.397%2C0.774-1.914c0.516-0.516%2C1.126-0.773%2C1.833-0.773h15.642%20c0.707%2C0%2C1.318%2C0.257%2C1.834%2C0.773c0.515%2C0.517%2C0.773%2C1.154%2C0.773%2C1.914V117.24z%20M118.268%2C86.77%20c-0.056%2C0.543-0.341%2C0.991-0.856%2C1.344c-0.517%2C0.354-1.154%2C0.529-1.915%2C0.529h-15.073c-0.76%2C0-1.412-0.176-1.955-0.529%20c-0.544-0.354-0.815-0.801-0.815-1.346l-1.385-37.231c0-0.761%2C0.272-1.331%2C0.815-1.711c0.706-0.597%2C1.358-0.896%2C1.956-0.896h17.924%20c0.598%2C0%2C1.25%2C0.298%2C1.956%2C0.896c0.543%2C0.38%2C0.813%2C0.896%2C0.813%2C1.548L118.268%2C86.77z%22%2F%3E%3C%2Fsvg%3E');border-color:#f9c642}.ds-c-alert--success{background-color:#e7f4e4;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASoAAAEqCAMAAACV5O0dAAACnVBMVEX///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD6Mnm8AAAA33RSTlMABAwUHCQsNDxEDic/WHGJorrT6/z/AR5HcJjB6sKZHwg9d6PM9M2keD4JTorF+ceLTxlgnNfYMH7L/gdJluJXrjGT7RNuzwJIqmja238i9fap/aw3KrC0G58dEIj3EXPudFvhJr28Bvh7BUDVO1/oraYP4986gwMhxsRZ8fAayco25uc4XWGQt7sS3Cvl6S817O/yRk1TWvtRQ/PZuI4KziOEnYEpw2MgsSibGN2Gdkw5C7ZtULJcFlT6lUqvRUueQdEzMmoXVpKPZXyr1C4t0Keg3nmRJeQVjGQN4IXS6f4WAQAADDVJREFUeAHt3fVfVNkfx/H3zFzCrnkj7NpdO7boYGN7rTGBxWWFXcfFVkz8snZ3C9hd293d3fm3fB/bJsztc871+TP5+mUYzj2fD0QSCIa0pOSU1Bo1UlOSk7RQMIB7blCzVu06devVb9CwUZi3CTdq2KB+vbp1ateqCR9La5yecd/9TZigJk2bZaQ3T4PPtGjZqnWbtjShbbv2HTp2gj+EOnd5IEJLIl27dQ9BbT169upNm/Tp1bMHFJXZt1+Utor265sJ1WT1HzCQjhg4oH+WQp0GDW5LB7UdPEiNWkOGZtNx2UOHQHLDho+gS0YMHwZpjRw1OkIXRUaPGgkZtRgzlq7Tx3SCbIb1bUJPNBkXgkzGD51Az0wckARZpEwK01OxyVMgg6nTKIDpyRDdjF5hCiGWkwuR5T04kcLI7zITosp6KJtCKXi4BYQ0q5DCKZwF8RQ9QiE9mgSxzO4bp6Dy5zwGgRT3ocDmzoMohuVQbNFmeRDC/EYU3oJB8N7MhZTCosXwWO0llMTSEngpsCxGaYTHLYdnVqykVFY1h0dWl1Iya+rACy1yKKGcFnDd/8oopcdnwGVr11FS6zfAVRvjlFZ8E9wzshultnk5XLJ4CyW3dRtcMb4Ppbe9CC7YsZMK2LUbjtuzl0rYVwKHFe+nIiYcgKMO5lMZkUNw0OEjVEh4ExwzJkalRDMcK0XlONTqcIzKic6HAw4eoYLCR2G74nwqKX4MNtuzn4oqnwJb7dhLZWUnw0bjd1Jh68bDNnkVVFpFHmyyvJKKq1wOexyn8o7DFpvoA5tgg5IIfSBSAstyF9AXFuTCohMn6RMnT8CaRfSNRbCkJ31kPiw4VU4fKT8F0wJl9JWyAMw6TZ85DZM6xugzsY4wJa+QvlOYBzMm0YcmwYTD9KXDMGxbE/pSk20w6gx96gwMKqZvFcOQrAr6VkUWjDhLHzsLA85F6GORc0hY2nn62vk0JOoCfe4CEnRiHX1u3QkkZg59bw4SEiql75WGkIjN5D2bkYCLEfKeyEVUrz1J3tMe1cqMkuQ90UxUp5IqMqES1UilmkxIRdUuUU0mXEKVLkepJhOil1GVK1SVCVdQhatxquPaOloTv4q7u041hCc/cSwP6PHkuEdowXXcVbCAStCfwr8GZdO0giDuJoNKGPA0btDjGQcudgUKqYDy/rjFszGaVBjAnT2nRKlU3Ga+6VbP4c6ep/z2z8MdvBC298/Qq0dULQWsNtnqyIu4kycUKFWCuxh0hKY8hDvprXAp4CVzrRriDp6Sv9RTqMLRl2lGiopv/0qfQpW6R2jCK7jNif2yl9qAajxpplVBFm41X/lSwKtxGjcIt3pG8lJTkIBR+TTsNdzi6ThltmYKEvL6RBrVtgVudlTuUmuRoGMTaNQbuNmb/igFvNWWBjXDTUbukrnUHhjQ0WirdWm40QbKa98eGJJaTmP2qPKf4n0pMKiklIYsw40a+qgUsMFYq7dxg4s+KmViHsJFFeadFbwDUyppxBj8p73PSiF3v9kHiJZKWupdmPUeDViKf83wXSm8TyNm4B8fUEbZQ2BBExrwAf7xof9K4VEa8CH+0U7GUpmw5CMa0A5/C4Ypnb2ZsOZjGhAO4i+v+7AUPqERr+Mv4+QrtRtWfUojxpn4LFVKYSyN+BR/+YxyafQ5LHs6RiM+w5+WR2iba5+FpSiFdBoSWY4/FNEeC+sWLwY6TRlzJuJoqS9gXaexNKYIf+hOO+wchX998SUd08SOUthMg7rjDx1og69m4gazr4eFLtUxSoM64A9f07IjG3GLednOlEqGDa5+Q6O+xh/KaNXLR3GbIdnilupNw8rwh/20KNIdcKXVrh1eleJ+AHjRcqknAfOt5ChFvghgN62Jvwq40mrXVA9LcTeAdFqSnw640mqBp6WYbnlK6sTXAfOt5CnFngC+pQUTjgGutFpwzttS/BbAdzSvbTHgSqv1XpfidwBG07TyjqhWZrYdpS57XYqjATSlWftTAfOt5CrFpgB0mlRaAphvJVkp6gDKac6aDYArrdbVEqAUy4EAzdm3FjDfSrpSZABBNx6syNxrvlSRGKUYRMiVo13TrXaKUoohaOaPTMy3krAUNSTRuOzPAVda7fxemFJMQjKNGwQTdhtv9YNApZiMFBo2DTDfStZSTEEqjdrXA660+iFJpFJMRQ0a9THgRqslYpViDTxJo36EG62WnBKrFJ80nmoBYH8r8UvxSdSgQQ3gQquBwpViDaTSoJ/gfKuB44UrxVSk0KCfYX8rCUoxBck0aBws+ry6VoUilmIykmjQYFhu1ajqUitELMUkaDToGuxvJUEpagjRoOgvjrb69aKYpRhCkEZ1hv2txC/FIAI0amnQ/lbil2LAzDHEADjVamlzYUuVmzrcir5lfyvRS1E3d2T6q+ZIq28ELsWmJg/idVtafdHo5lKNBS7F0QC+oxitxC7F7wB8SyFaXRO7FL8F0JMitLqWK3Yp9gSQTgFaCV+K6QB20/tW24Uvxd0AXqTHrZpwuyZ8Kb4IAPu9brVSglL78YcyetwK4pdimeXrSLrmj1L82volN13zRSl2sOHqpK75oRS723EhV9d8UIpFtlzz1jX1S0WW2zM8QNdUL8XP7BpJoWuKl+Kntg060TW1S3GcfeNzdE3pUnzdxqFMuqZyqXDQzlFfuqZuKbazd4Ccrilbih/aPJZQ11QtxQ/sHnapa4qW4gzbR6jqmpqlljowmFfXVCzF9k6Me9Y1BUtxjCNDxHVNvVK86Mxoel1TrtTbTi080DXFSnGZY2s0dE2tUtzj3HIWXVOq1Lo0B1f+6JpCpdjM0UVSuqZOKb7h7HoyXVOmVNsWDi+90zVFSvE1x1cp6poapTjI+QWduqZEqYIsF9a+6poCpfiKK8uEdU3+UkxxZ0W1rklfqqFbi891TfJSfMi1dfq6Jn4pE+v08TwFaCVUKV7CnT1HAVoJVYrP4c4ChQK0EqpUYQB3kUEBWglUihm4m2CBAK0EKlUQxF1dpwCthCnF67i7q3EBWglTKn4VVbhCAVoJUopXUJXLUQFaCVIqehlVukQBWglRipdQtVQK0EqIUkxFNSoFaCVEqUpUJzMqQCsBSkUzUa32dKGV8KXYHtW7GHGhlfClIheRgM10oZXgpbgZiQiVutBK8FKlISRkDl1oJXQpzkFiTqxzoZXQpdadQIIu0IVWApfiBSQq7bwLrQQudT4NCTsXcaGVsKUi52DAWbrQStBSPAsjsipcaCVoqYosGFJMF1oJWYrFMOiMC62ELHUGRm1r4kIrAUs12QbDDtNhS0tws7U6vXcYJkyiw2IPZuE/s38L03uTYEZeIZ3WcAj+kfk7BVCYB1M6xui06NhJrQ4kvTHnUz1KAcQ6wqTT9JnTMCtQRl8pC8C0U+X0kfJTsKAnfWQ+LFlE31gEa06cpE+cPAGLchfQFxbkwrKSCH0gUgIbbKIPbIItjlN5x2GP5ZVUXOVy2CSvgkqryINtxq+jwnaOh42Ss6msvTtgqynlVNT+PbDZsTiVlF8M2x0NU0FHDsIB86NUTuwwHJFB5YyBQzKiVEpsDByzKUyFHDkMBx2KUBn5B+GoAxOoiP3FcFjJPiph7x44bvcuKmDnDrigaDul12c8XLFtKyW3ZTFcsnwzpdZtJNyzKU5pxTfCVRvWU1Lr1sJlMx6nlMr+B9e1yKGEclrAC3XWUDKlq+GR5qsolZUr4Jnl48KURmxZAF4qWUpJLKkNjy1eRCksnAnvDVpA4TWaDyHkNYtSbDnDIIp5cymwPsUQyGNz8imoeN/ZEEvSoxTSI0UQz6xCCqdwFoTU4uECCqXg4RYQ1cwu+RRGfpeZEFluToxCiOXkQnTJ0ymA6cmQwZTJMXoqNnkKZJE0YCI9M3FAEmQSGteEnmgyLgTZdBqj03X6mE6Q0chRoyN0UWT0qJGQ1rDhI+iSEcOHQXJDhmbTcdlDh0AFWYMGt6WD2g4elAVlZPUfMJCOGDigfxZUk9m3X5S2ivbrmwlF9ejZqzdt0rtXzx5QW6hzlwcitCTyQJfOIfhDi5atWrdpSxPatmndqmUL+Exa4/SM++5vwgQ1uf++jPTGafCxmrVq16lbr36Dho3CvE24UcMG9evVrVO7Vk3cc4NAMKQlJaek1qiRmpKcpIWCAQjk/12fm21v3GQqAAAAAElFTkSuQmCC');background-image:url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20id%3D%22Capa_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%22216px%22%20height%3D%22216px%22%20viewBox%3D%220%200%20216%20216%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20d%3D%22M162.18%2C41.592c-5.595-9.586-13.185-17.176-22.771-22.771c-9.588-5.595-20.055-8.392-31.408-8.392%20c-11.352%2C0-21.822%2C2.797-31.408%2C8.392c-9.587%2C5.594-17.177%2C13.184-22.772%2C22.771C48.225%2C51.179%2C45.428%2C61.649%2C45.428%2C73%20c0%2C11.352%2C2.798%2C21.82%2C8.392%2C31.408c5.595%2C9.585%2C13.185%2C17.176%2C22.772%2C22.771c9.587%2C5.595%2C20.056%2C8.392%2C31.408%2C8.392%20c11.352%2C0%2C21.822-2.797%2C31.408-8.392c9.586-5.594%2C17.176-13.185%2C22.771-22.771c5.594-9.587%2C8.391-20.057%2C8.391-31.408%20C170.57%2C61.648%2C167.773%2C51.178%2C162.18%2C41.592z%20M148.572%2C63.468l-44.239%2C44.239c-1.032%2C1.032-2.281%2C1.549-3.748%2C1.549%20c-1.412%2C0-2.634-0.517-3.666-1.549L67.425%2C78.215c-0.977-0.979-1.466-2.199-1.466-3.666c0-1.521%2C0.488-2.771%2C1.466-3.749%20l7.414-7.332c1.033-1.032%2C2.254-1.548%2C3.667-1.548s2.635%2C0.516%2C3.667%2C1.548l18.413%2C18.413l33.241-33.16%20c1.032-1.032%2C2.254-1.548%2C3.666-1.548c1.411%2C0%2C2.635%2C0.516%2C3.666%2C1.548l7.414%2C7.333c0.979%2C0.977%2C1.467%2C2.226%2C1.467%2C3.747%20C150.04%2C61.268%2C149.552%2C62.49%2C148.572%2C63.468z%22%2F%3E%3C%2Fsvg%3E');border-color:#94bfa2}.ds-c-badge{background-color:#5b616b;border-radius:9999px;color:#fff;display:inline-block;font-size:14px;line-height:1.3;margin-right:4px;padding:4px 8px}.ds-c-badge:only-of-type{margin-right:0}.ds-c-badge--info{background-color:#0071bc}.ds-c-badge--success{background-color:#2e8540}.ds-c-badge--warn{background-color:#fdb81e;color:#212121}.ds-c-badge--alert{background-color:#e31c3d}.ds-c-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:1px solid #0071bc;border-radius:3px;color:#0071bc;cursor:pointer;display:inline-block;font-family:Open Sans,Helvetica,sans-serif;font-size:16px;font-weight:700;line-height:1.3;padding:12px;text-align:center;text-decoration:none}.ds-c-button:focus,.ds-c-button:hover{border-color:#205493;color:#205493}.ds-c-button:active{border-color:#112e51;color:#112e51}.ds-c-button--big{font-size:21px;padding-left:24px;padding-right:24px}.ds-c-button--small{font-size:14px;font-weight:400;padding:8px}.ds-c-button--primary{background-color:#0071bc;color:#fff}.ds-c-button--primary:focus,.ds-c-button--primary:hover{background-color:#205493;color:#fff}.ds-c-button--primary:active{background-color:#112e51}.ds-c-button--transparent,.ds-c-button--transparent-inverse,.ds-c-button--transparent-inverse:active,.ds-c-button--transparent-inverse:focus,.ds-c-button--transparent-inverse:hover,.ds-c-button--transparent:active,.ds-c-button--transparent:focus,.ds-c-button--transparent:hover{border-color:transparent}.ds-c-button--danger{background-color:#e31c3d;border-color:#e31c3d;color:#fff}.ds-c-button--danger:focus,.ds-c-button--danger:hover{background-color:#cd2026;border-color:#cd2026;color:#fff}.ds-c-button--danger:active{background-color:#981b1e;border-color:#981b1e}.ds-c-button--success{background-color:#2e8540;border-color:#2e8540;color:#fff}.ds-c-button--success:focus,.ds-c-button--success:hover{background-color:#2a7a3b;border-color:#2a7a3b;color:#fff}.ds-c-button--success:active{background-color:#266e35;border-color:#266e35}.ds-c-button--disabled,.ds-c-button:disabled{pointer-events:none}.ds-c-button--disabled,.ds-c-button--disabled:active,.ds-c-button--disabled:focus,.ds-c-button--disabled:hover,.ds-c-button:disabled,.ds-c-button:disabled:active,.ds-c-button:disabled:focus,.ds-c-button:disabled:hover{background-color:#d6d7d9;border-color:#d6d7d9;color:#323a45}.ds-c-button--inverse,.ds-c-button--inverse:active,.ds-c-button--inverse:focus,.ds-c-button--inverse:hover{border-color:#fff}.ds-c-button--inverse,.ds-c-button--transparent-inverse{color:#fff}.ds-c-button--inverse:active,.ds-c-button--inverse:focus,.ds-c-button--inverse:hover,.ds-c-button--transparent-inverse:active,.ds-c-button--transparent-inverse:focus,.ds-c-button--transparent-inverse:hover{color:#fff;opacity:.8}.ds-c-button--inverse:active,.ds-c-button--transparent-inverse:active{opacity:.6}.ds-c-button--disabled-inverse,.ds-c-button--disabled-inverse:disabled{background-color:#081627;border-color:#081627;color:#bac5cf;pointer-events:none}.ds-c-button--disabled-inverse:active,.ds-c-button--disabled-inverse:disabled:active,.ds-c-button--disabled-inverse:disabled:focus,.ds-c-button--disabled-inverse:disabled:hover,.ds-c-button--disabled-inverse:focus,.ds-c-button--disabled-inverse:hover{background-color:#112e51;border-color:#112e51;color:#bac5cf}.ds-c-button>svg{fill:currentColor;height:1em;margin-bottom:-.1em;margin-top:-.1em;position:relative;top:-.1em;vertical-align:middle;width:1em}.ds-c-fieldset{border:0;margin:24px 0 0;min-width:0;padding:0}.ds-c-choice{margin-left:-100%;opacity:0;position:absolute}.ds-c-choice+label{cursor:pointer;display:block;font-weight:400;margin:8px 0;max-width:31em;min-height:32px;padding-left:40px;padding-top:4px;position:relative}.ds-c-choice+label:before{background-color:#fff;border:2px solid #212121;-webkit-box-sizing:border-box;box-sizing:border-box;content:"\a0";height:32px;left:0;line-height:32px;position:absolute;text-indent:.15em;top:0;width:32px}.ds-c-choice--inverse+label:before{background-color:#112e51;border-color:#fff}.ds-c-choice:focus+label:before{-webkit-box-shadow:0 0 0 2px #fff,0 0 2px 4px #3e94cf;box-shadow:0 0 0 2px #fff,0 0 2px 4px #3e94cf}.ds-c-choice--inverse:focus+label:before{-webkit-box-shadow:0 0 0 2px #112e51,0 0 2px 4px #59bcff;box-shadow:0 0 0 2px #112e51,0 0 2px 4px #59bcff}.ds-c-choice:checked+label:before{background-color:#0071bc;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAJCAQAAACssQXfAAAAiklEQVR4AT3PNUFGARAA4MO1AFRgQVrgTEgNXBZ0Z0aLQI0XANf594932LlLROjQHgmhM9mVwlhkMJO/4S7noMjghKEIPcmuUNNyGpa8uzUcYdA1qjjJ+ntwY8Q16jiIBCte0fSmUUr2Mio3W/BJqwQt2xHaZFhXhBnPqFr7D6eRKVMereeIv5++AKLreD06aLBkAAAAAElFTkSuQmCC');background-image:url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%20216%20146%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M168.86%2037.966l-11.08-11.08c-1.52-1.52-3.367-2.28-5.54-2.28-2.172%200-4.02.76-5.54%202.28L93.254%2080.414%2069.3%2056.38c-1.52-1.522-3.367-2.282-5.54-2.282-2.172%200-4.02.76-5.54%202.28L47.14%2067.46c-1.52%201.522-2.28%203.37-2.28%205.542%200%202.172.76%204.02%202.28%205.54l29.493%2029.493%2011.08%2011.08c1.52%201.52%203.368%202.28%205.54%202.28%202.173%200%204.02-.76%205.54-2.28l11.082-11.08L168.86%2049.05c1.52-1.52%202.283-3.37%202.283-5.54%200-2.174-.76-4.02-2.28-5.54z%22%2F%3E%3C%2Fsvg%3E');background-position:50%;background-repeat:no-repeat;background-size:24px;border-color:#0071bc}.ds-c-choice:disabled+label{color:#757575}.ds-c-choice:disabled+label:before{background-color:#d6d7d9;border:1px solid #aeb0b5;cursor:not-allowed}.ds-c-choice--inverse:disabled+label{color:#bac5cf}.ds-c-choice--inverse:disabled+label:before{background-color:rgba(186,197,207,.15);-webkit-box-shadow:0 0 0 1px #bac5cf;box-shadow:0 0 0 1px #bac5cf}.ds-c-choice[type=radio]+label:before{border-radius:100%}.ds-c-field--select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAAAn0lEQVQ4je3SwRECIQxA0T97Enpwx3a2TOlCXV0qceyBAuIBRmWBLB6dMZxC8jgkwD9eccATcBi1y+IIeEaAkQeCIMwKs9xS1509+JRo7E0EYYHwkdaZ5Zr1BHDZRcnMighHMMwKK8mZXSy0WFlJpP7ejNFJi22Q2ozW51JfR76NLqIxhbTYBqmxDhLZ0vwfKovjPvUTgIGJieEb8tvxBHgowtBhwYKpAAAAAElFTkSuQmCC');background-image:url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2226%22%20height%3D%2226%22%20viewBox%3D%220%200%2026%2026%22%3E%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M14.5022482%2020.7706835L25.368705%209.89253597C25.7895683%209.48920863%2026%208.99235612%2026%208.39028777c0-.60206835-.2104317-1.09892086-.631295-1.5022482l-1.2508992-1.26843525C23.7086331%205.21043165%2023.2059353%205%2022.6155576%205c-.5786871%200-1.0872303.20458633-1.5197842.61960432L13%2013.7270683%204.89253597%205.61960432C4.4833633%205.21043165%203.98066547%205%203.39028777%205c-.57868705%200-1.08723022.20458633-1.51978417.61960432L.61960432%206.88803957C.21043166%207.29721223%200%207.79991007%200%208.39028777c0%20.5903777.20458633%201.09307554.61960432%201.5022482L11.4802158%2020.7706835c.432554.4091726.9410971.6196043%201.5197842.6196043.5903777%200%201.0930755-.2045864%201.5022482-.6196043z%22%2F%3E%3C%2Fsvg%3E');background-position:right 14px center;background-repeat:no-repeat;background-size:14px}.ds-c-field--select[multiple]{background-image:none}.ds-c-label{display:block;font-size:16px;font-weight:400;margin-bottom:0;margin-top:24px;max-width:460px;padding:0}.ds-c-fieldset>.ds-c-label:first-child{margin-top:0}.ds-c-field__hint{color:#757575;display:block}.ds-c-field__hint--inverse{color:#bac5cf}.ds-c-list{margin-bottom:16px;margin-top:16px;padding-left:32px}.ds-c-list li{line-height:1.5;margin-bottom:8px}.ds-c-list li:last-child{margin-bottom:0}.ds-c-list--bare{list-style:none;margin:0;padding:0}.ds-c-table{border-collapse:collapse;border-spacing:0;margin:0;min-width:100%}.ds-c-table td{background-color:#fff}.ds-c-table th,.ds-c-table thead td{background-color:#f1f1f1;text-align:left}.ds-c-table tbody th{font-weight:400}.ds-c-table td,.ds-c-table th{border:1px solid #5b616b;padding:1.5rem}.ds-c-table--borderless thead tr{background-color:transparent}.ds-c-table--borderless thead th{border-top:0}.ds-c-table--borderless td,.ds-c-table--borderless th{border-left:0;border-right:0}.ds-c-table__caption{font-weight:700;margin-bottom:8px;text-align:left}.ds-c-tabs{display:-webkit-box;display:-ms-flexbox;display:flex}.ds-c-tabs,.ds-c-tabs__panel{border-bottom:1px solid #d6d7d9}.ds-c-tabs__panel{background-color:#fff;border-left:1px solid #d6d7d9;border-right:1px solid #d6d7d9;padding:24px}.ds-c-tabs__panel[aria-hidden=true]{display:none!important}.ds-c-tabs__item{background-color:#fff;border-bottom:1px solid #d6d7d9;border-left:1px solid #d6d7d9;border-top:1px solid #d6d7d9;color:#212121;cursor:pointer;display:inline-block;font-size:14px;font-weight:700;line-height:1;margin-bottom:-1px;padding:16px 8px;position:relative;text-decoration:none;-webkit-transition:border-bottom-color .3s cubic-bezier(1,0,0,1);transition:border-bottom-color .3s cubic-bezier(1,0,0,1)}@media (min-width:544px){.ds-c-tabs__item{padding-left:16px;padding-right:16px}}@media (min-width:768px){.ds-c-tabs__item{font-size:16px;padding-left:24px;padding-right:24px}}.ds-c-tabs__item:last-child{border-right:1px solid #d6d7d9}.ds-c-tabs__item:after{background-color:#0071bc;content:"";height:4px;left:-1px;opacity:0;position:absolute;right:-1px;top:-1px;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transition:opacity .3s cubic-bezier(1,0,0,1),-webkit-transform .3s cubic-bezier(1,0,0,1);transition:opacity .3s cubic-bezier(1,0,0,1),-webkit-transform .3s cubic-bezier(1,0,0,1);transition:opacity .3s cubic-bezier(1,0,0,1),transform .3s cubic-bezier(1,0,0,1);transition:opacity .3s cubic-bezier(1,0,0,1),transform .3s cubic-bezier(1,0,0,1),-webkit-transform .3s cubic-bezier(1,0,0,1)}.ds-c-tabs__item[aria-selected=true]{border-bottom-color:#fff;color:#0071bc;pointer-events:none}.ds-c-tabs__item[aria-selected=true]:after{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}.ds-c-tabs__item:focus,.ds-c-tabs__item:hover{color:#0071bc}.ds-c-tabs__item:active{color:#205493}.ds-c-tabs__item>svg{fill:currentColor;height:1em;margin-bottom:-.1em;margin-top:-.1em;position:relative;top:-.1em;vertical-align:middle;width:1em}.ds-c-field{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid #212121;border-radius:3px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#212121;display:block;font-size:16px;line-height:1.3;margin:4px 0;max-width:460px;outline:none;padding:12px;width:100%}.ds-c-field:disabled{background-color:#d6d7d9;border-width:0}.ds-c-field:focus{-webkit-box-shadow:0 0 3px #3e94cf,0 0 7px #3e94cf;box-shadow:0 0 3px #3e94cf,0 0 7px #3e94cf}.ds-c-field--inverse{border-color:#000}.ds-c-field--inverse:focus{-webkit-box-shadow:0 0 3px #59bcff,0 0 7px #59bcff;box-shadow:0 0 3px #59bcff,0 0 7px #59bcff}.ds-c-field--error{border:3px solid #e31c3d}.ds-c-field--success{border:3px solid #4aa564}.ds-c-vertical-nav{list-style:none;margin:0;padding:0}.ds-c-vertical-nav>.ds-c-vertical-nav__item{background-color:transparent;border-top:1px solid #5b616b}.ds-c-vertical-nav>.ds-c-vertical-nav__item:first-child{border-top:0}.ds-c-vertical-nav__item{position:relative}.ds-c-vertical-nav__link{border-left:4px solid transparent;color:#212121;display:block;line-height:1.3;padding:8px 16px;text-decoration:none}.ds-c-vertical-nav__link--current{border-left-color:#0071bc;color:#0071bc;font-weight:700}.ds-c-vertical-nav__link--parent{margin-right:40px}a.ds-c-vertical-nav__link:hover{background-color:#f1f1f1;color:#0071bc;text-decoration:none}.ds-c-vertical-nav__subnav{list-style:none;margin:0;padding:0}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__item{font-size:14px}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__link{line-height:1.3;padding-left:24px}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__link--current{border-color:transparent}.ds-c-vertical-nav__subnav .ds-c-vertical-nav__subnav .ds-c-vertical-nav__link{padding-left:32px}.ds-c-vertical-nav__subnav-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAAAn0lEQVQ4je3SwRECIQxA0T97Enpwx3a2TOlCXV0qceyBAuIBRmWBLB6dMZxC8jgkwD9eccATcBi1y+IIeEaAkQeCIMwKs9xS1509+JRo7E0EYYHwkdaZ5Zr1BHDZRcnMighHMMwKK8mZXSy0WFlJpP7ejNFJi22Q2ozW51JfR76NLqIxhbTYBqmxDhLZ0vwfKovjPvUTgIGJieEb8tvxBHgowtBhwYKpAAAAAElFTkSuQmCC');background-image:url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2226%22%20height%3D%2226%22%20viewBox%3D%220%200%2026%2026%22%3E%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M14.5022482%2020.7706835L25.368705%209.89253597C25.7895683%209.48920863%2026%208.99235612%2026%208.39028777c0-.60206835-.2104317-1.09892086-.631295-1.5022482l-1.2508992-1.26843525C23.7086331%205.21043165%2023.2059353%205%2022.6155576%205c-.5786871%200-1.0872303.20458633-1.5197842.61960432L13%2013.7270683%204.89253597%205.61960432C4.4833633%205.21043165%203.98066547%205%203.39028777%205c-.57868705%200-1.08723022.20458633-1.51978417.61960432L.61960432%206.88803957C.21043166%207.29721223%200%207.79991007%200%208.39028777c0%20.5903777.20458633%201.09307554.61960432%201.5022482L11.4802158%2020.7706835c.432554.4091726.9410971.6196043%201.5197842.6196043.5903777%200%201.0930755-.2045864%201.5022482-.6196043z%22%2F%3E%3C%2Fsvg%3E');background-position:50%;background-repeat:no-repeat;background-size:14px;border:0;cursor:pointer;font-size:inherit;line-height:1.3;padding-bottom:8px;padding-top:8px;position:absolute;right:0;text-indent:-9999px;top:0;width:40px}.ds-c-vertical-nav__subnav-toggle:hover{background-color:#f1f1f1}.ds-c-vertical-nav__subnav-toggle[aria-expanded=true]{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAAAkklEQVQ4y+3SMRKCMBRF0bsLtsAS0I1kGCsVZeW/1cGWMaGIIxCSH1Lr68/MKy78zk4IQltCeiwOh+W6l9w/pIAtiWeXUrKD3SIkw1JEYSEZGHKs25CGJmBvzjkCaCxFAA5x1irEs1fADIhKYkzWKEa2TJb3UgTg+GUW49MZcTwU4tkTxzgHXGOosilXGGr+mzcBgEfC5p/5oAUAAAAASUVORK5CYII=');background-image:url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2226%22%20height%3D%2226%22%20viewBox%3D%220%200%2026%2026%22%3E%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M14.5022482%204.61960432L25.368705%2015.4977518C25.7895683%2015.9010791%2026%2016.3979317%2026%2017c0%20.6020683-.2104317%201.0989209-.631295%201.5022482l-1.2508992%201.2684353c-.4091727.4091726-.9118705.6196043-1.5022482.6196043-.5786871%200-1.0872303-.2045864-1.5197842-.6196043L13%2011.6632194l-8.10746403%208.1074641c-.40917266.4091726-.9118705.6196043-1.5022482.6196043-.57868705%200-1.08723022-.2045864-1.51978417-.6196043L.61960432%2018.5022482C.21043166%2018.0930755%200%2017.5903777%200%2017c0-.5903777.20458633-1.0930755.61960432-1.5022482L11.4802158%204.61960432C11.9127698%204.21043165%2012.4213129%204%2013%204c.5903777%200%201.0930755.20458633%201.5022482.61960432z%22%2F%3E%3C%2Fsvg%3E')}.ds-u-fill--primary{background-color:#0071bc!important}.ds-u-fill--primary-darker{background-color:#205493!important}.ds-u-fill--primary-darkest{background-color:#112e51!important}.ds-u-fill--primary-alt{background-color:#02bfe7!important}.ds-u-fill--primary-alt-dark{background-color:#00a6d2!important}.ds-u-fill--primary-alt-darkest{background-color:#046b99!important}.ds-u-fill--primary-alt-light{background-color:#9bdaf1!important}.ds-u-fill--primary-alt-lightest{background-color:#e1f3f8!important}.ds-u-fill--secondary{background-color:#e31c3d!important}.ds-u-fill--secondary-dark{background-color:#cd2026!important}.ds-u-fill--secondary-darkest{background-color:#981b1e!important}.ds-u-fill--secondary-light{background-color:#e59393!important}.ds-u-fill--secondary-lightest{background-color:#f9dede!important}.ds-u-fill--gray{background-color:#5b616b!important}.ds-u-fill--gray-dark{background-color:#323a45!important}.ds-u-fill--gray-light{background-color:#aeb0b5!important}.ds-u-fill--gray-lighter{background-color:#d6d7d9!important}.ds-u-fill--gray-lightest{background-color:#f1f1f1!important}.ds-u-fill--gold{background-color:#fdb81e!important}.ds-u-fill--gold-light{background-color:#f9c642!important}.ds-u-fill--gold-lighter{background-color:#fad980!important}.ds-u-fill--gold-lightest{background-color:#fff1d2!important}.ds-u-fill--green{background-color:#2e8540!important}.ds-u-fill--green-light{background-color:#4aa564!important}.ds-u-fill--green-lighter{background-color:#94bfa2!important}.ds-u-fill--green-lightest{background-color:#e7f4e4!important}.ds-u-fill--error{background-color:#e31c3d!important}.ds-u-fill--error-dark{background-color:#cd2026!important}.ds-u-fill--error-darkest{background-color:#981b1e!important}.ds-u-fill--error-light{background-color:#e59393!important}.ds-u-fill--error-lighter{background-color:#efb9b9!important}.ds-u-fill--error-lightest{background-color:#f9dede!important}.ds-u-fill--warn{background-color:#fdb81e!important}.ds-u-fill--warn-light{background-color:#f9c642!important}.ds-u-fill--warn-lighter{background-color:#fad980!important}.ds-u-fill--warn-lightest{background-color:#fff1d2!important}.ds-u-fill--success{background-color:#2e8540!important}.ds-u-fill--success-light{background-color:#4aa564!important}.ds-u-fill--success-lighter{background-color:#94bfa2!important}.ds-u-fill--success-lightest{background-color:#e7f4e4!important}.ds-u-fill--base{background-color:#212121!important}.ds-u-fill--background,.ds-u-fill--white{background-color:#fff!important}.ds-u-fill--background-inverse{background-color:#112e51!important}.ds-u-fill--transparent{background-color:transparent!important}.ds-u-border--1{border:1px solid #d6d7d9!important}.ds-u-border-top--1{border-top:1px solid #d6d7d9!important}.ds-u-border-right--1{border-right:1px solid #d6d7d9!important}.ds-u-border-bottom--1{border-bottom:1px solid #d6d7d9!important}.ds-u-border-left--1,.ds-u-border-x--1{border-left:1px solid #d6d7d9!important}.ds-u-border-x--1{border-right:1px solid #d6d7d9!important}.ds-u-border-y--1{border-bottom:1px solid #d6d7d9!important;border-top:1px solid #d6d7d9!important}.ds-u-border--2{border:2px solid #d6d7d9!important}.ds-u-border-top--2{border-top:2px solid #d6d7d9!important}.ds-u-border-right--2{border-right:2px solid #d6d7d9!important}.ds-u-border-bottom--2{border-bottom:2px solid #d6d7d9!important}.ds-u-border-left--2,.ds-u-border-x--2{border-left:2px solid #d6d7d9!important}.ds-u-border-x--2{border-right:2px solid #d6d7d9!important}.ds-u-border-y--2{border-bottom:2px solid #d6d7d9!important;border-top:2px solid #d6d7d9!important}.ds-u-border--0{border:0!important}.ds-u-border-top--0{border-top:0!important}.ds-u-border-right--0{border-right:0!important}.ds-u-border-bottom--0{border-bottom:0!important}.ds-u-border-left--0,.ds-u-border-x--0{border-left:0!important}.ds-u-border-x--0{border-right:0!important}.ds-u-border-y--0{border-bottom:0!important;border-top:0!important}.ds-u-border--inverse{border-color:#fff!important}.ds-u-border--error{border-color:#e31c3d!important}.ds-u-border--error-light{border-color:#e59393!important}.ds-u-border--error-lighter{border-color:#efb9b9!important}.ds-u-border--warn{border-color:#fdb81e!important}.ds-u-border--warn-light{border-color:#f9c642!important}.ds-u-border--warn-lighter{border-color:#fad980!important}.ds-u-border--success{border-color:#2e8540!important}.ds-u-border--success-light{border-color:#4aa564!important}.ds-u-border--success-lighter{border-color:#94bfa2!important}.ds-u-radius{border-radius:3px}.ds-u-radius--pill{border-radius:9999px}.ds-u-radius--circle{border-radius:100%}.ds-u-color--primary{color:#0071bc!important}.ds-u-color--primary-darker{color:#205493!important}.ds-u-color--primary-darkest{color:#112e51!important}.ds-u-color--gray{color:#5b616b!important}.ds-u-color--muted{color:#757575!important}.ds-u-color--error{color:#e31c3d!important}.ds-u-color--error-dark{color:#cd2026!important}.ds-u-color--error-light{color:#e59393!important}.ds-u-color--success{color:#2e8540!important}.ds-u-color--base{color:#212121!important}.ds-u-color--base-inverse{color:#fff!important}.ds-u-color--muted-inverse{color:#bac5cf!important}.ds-u-color--black{color:#000!important}.ds-u-color--white{color:#fff!important}.ds-u-display--block{display:block!important}.ds-u-display--inline-block{display:inline-block!important}.ds-u-display--none{display:none!important}.ds-u-visibility--hidden{visibility:hidden!important}.ds-u-visibility--visible{visibility:visible!important}.ds-u-visibility--screen-reader{border:0;clip:rect(0,0,0,0);height:1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal}@media (min-width:544px){.ds-u-sm-display--block{display:block!important}.ds-u-sm-display--inline-block{display:inline-block!important}.ds-u-sm-display--none{display:none!important}.ds-u-sm-visibility--hidden{visibility:hidden!important}.ds-u-sm-visibility--visible{visibility:visible!important}}@media (min-width:768px){.ds-u-md-display--block{display:block!important}.ds-u-md-display--inline-block{display:inline-block!important}.ds-u-md-display--none{display:none!important}.ds-u-md-visibility--hidden{visibility:hidden!important}.ds-u-md-visibility--visible{visibility:visible!important}}@media (min-width:1024px){.ds-u-lg-display--block{display:block!important}.ds-u-lg-display--inline-block{display:inline-block!important}.ds-u-lg-display--none{display:none!important}.ds-u-lg-visibility--hidden{visibility:hidden!important}.ds-u-lg-visibility--visible{visibility:visible!important}}@media (min-width:1280px){.ds-u-xl-display--block{display:block!important}.ds-u-xl-display--inline-block{display:inline-block!important}.ds-u-xl-display--none{display:none!important}.ds-u-xl-visibility--hidden{visibility:hidden!important}.ds-u-xl-visibility--visible{visibility:visible!important}}.ds-u-float--left{float:left!important}.ds-u-float--right{float:right!important}.ds-u-float--none{float:none!important}@media (min-width:544px){.ds-u-sm-float--left{float:left!important}.ds-u-sm-float--right{float:right!important}.ds-u-sm-float--none{float:none!important}}@media (min-width:768px){.ds-u-md-float--left{float:left!important}.ds-u-md-float--right{float:right!important}.ds-u-md-float--none{float:none!important}}@media (min-width:1024px){.ds-u-lg-float--left{float:left!important}.ds-u-lg-float--right{float:right!important}.ds-u-lg-float--none{float:none!important}}@media (min-width:1280px){.ds-u-xl-float--left{float:left!important}.ds-u-xl-float--right{float:right!important}.ds-u-xl-float--none{float:none!important}}.ds-u-sans{font-family:Open Sans,Helvetica,sans-serif!important}.ds-u-serif{font-family:Bitter,Georgia,serif!important}.ds-u-font-size--small{font-size:14px!important}.ds-u-font-size--base{font-size:16px!important}.ds-u-font-size--lead{font-size:18px!important}.ds-u-font-size--display{font-size:60px!important}.ds-u-font-size--title{font-size:48px!important}.ds-u-font-size--h1{font-size:36px!important}.ds-u-font-size--h2{font-size:24px!important}.ds-u-font-size--h3{font-size:21px!important}.ds-u-font-size--h4{font-size:18px!important}@media (min-width:544px){.ds-u-sm-font-size--small{font-size:14px!important}.ds-u-sm-font-size--base{font-size:16px!important}.ds-u-sm-font-size--lead{font-size:18px!important}.ds-u-sm-font-size--display{font-size:60px!important}.ds-u-sm-font-size--title{font-size:48px!important}.ds-u-sm-font-size--h1{font-size:36px!important}.ds-u-sm-font-size--h2{font-size:24px!important}.ds-u-sm-font-size--h3{font-size:21px!important}.ds-u-sm-font-size--h4{font-size:18px!important}}@media (min-width:768px){.ds-u-md-font-size--small{font-size:14px!important}.ds-u-md-font-size--base{font-size:16px!important}.ds-u-md-font-size--lead{font-size:18px!important}.ds-u-md-font-size--display{font-size:60px!important}.ds-u-md-font-size--title{font-size:48px!important}.ds-u-md-font-size--h1{font-size:36px!important}.ds-u-md-font-size--h2{font-size:24px!important}.ds-u-md-font-size--h3{font-size:21px!important}.ds-u-md-font-size--h4{font-size:18px!important}}@media (min-width:1024px){.ds-u-lg-font-size--small{font-size:14px!important}.ds-u-lg-font-size--base{font-size:16px!important}.ds-u-lg-font-size--lead{font-size:18px!important}.ds-u-lg-font-size--display{font-size:60px!important}.ds-u-lg-font-size--title{font-size:48px!important}.ds-u-lg-font-size--h1{font-size:36px!important}.ds-u-lg-font-size--h2{font-size:24px!important}.ds-u-lg-font-size--h3{font-size:21px!important}.ds-u-lg-font-size--h4{font-size:18px!important}}@media (min-width:1280px){.ds-u-xl-font-size--small{font-size:14px!important}.ds-u-xl-font-size--base{font-size:16px!important}.ds-u-xl-font-size--lead{font-size:18px!important}.ds-u-xl-font-size--display{font-size:60px!important}.ds-u-xl-font-size--title{font-size:48px!important}.ds-u-xl-font-size--h1{font-size:36px!important}.ds-u-xl-font-size--h2{font-size:24px!important}.ds-u-xl-font-size--h3{font-size:21px!important}.ds-u-xl-font-size--h4{font-size:18px!important}}.ds-u-font-style--normal{font-style:normal!important}.ds-u-font-style--italic{font-style:italic!important}.ds-u-font-weight--normal{font-weight:400!important}.ds-u-font-weight--semibold{font-weight:600!important}.ds-u-font-weight--bold{font-weight:700!important}.ds-u-leading--base{line-height:1.5!important}.ds-u-leading--lead{line-height:1.7!important}.ds-u-leading--heading{line-height:1.3!important}.ds-u-leading--reset{line-height:1!important}.ds-u-margin--0{margin:0!important}.ds-u-margin-top--0{margin-top:0!important}.ds-u-margin-right--0{margin-right:0!important}.ds-u-margin-bottom--0{margin-bottom:0!important}.ds-u-margin-left--0,.ds-u-margin-x--0{margin-left:0!important}.ds-u-margin-x--0{margin-right:0!important}.ds-u-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-margin--1{margin:8px!important}.ds-u-margin-top--1{margin-top:8px!important}.ds-u-margin-right--1{margin-right:8px!important}.ds-u-margin-bottom--1{margin-bottom:8px!important}.ds-u-margin-left--1,.ds-u-margin-x--1{margin-left:8px!important}.ds-u-margin-x--1{margin-right:8px!important}.ds-u-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-margin--2{margin:16px!important}.ds-u-margin-top--2{margin-top:16px!important}.ds-u-margin-right--2{margin-right:16px!important}.ds-u-margin-bottom--2{margin-bottom:16px!important}.ds-u-margin-left--2,.ds-u-margin-x--2{margin-left:16px!important}.ds-u-margin-x--2{margin-right:16px!important}.ds-u-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-margin--3{margin:24px!important}.ds-u-margin-top--3{margin-top:24px!important}.ds-u-margin-right--3{margin-right:24px!important}.ds-u-margin-bottom--3{margin-bottom:24px!important}.ds-u-margin-left--3,.ds-u-margin-x--3{margin-left:24px!important}.ds-u-margin-x--3{margin-right:24px!important}.ds-u-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-margin--4{margin:32px!important}.ds-u-margin-top--4{margin-top:32px!important}.ds-u-margin-right--4{margin-right:32px!important}.ds-u-margin-bottom--4{margin-bottom:32px!important}.ds-u-margin-left--4,.ds-u-margin-x--4{margin-left:32px!important}.ds-u-margin-x--4{margin-right:32px!important}.ds-u-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-margin--5{margin:40px!important}.ds-u-margin-top--5{margin-top:40px!important}.ds-u-margin-right--5{margin-right:40px!important}.ds-u-margin-bottom--5{margin-bottom:40px!important}.ds-u-margin-left--5,.ds-u-margin-x--5{margin-left:40px!important}.ds-u-margin-x--5{margin-right:40px!important}.ds-u-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-margin--6{margin:48px!important}.ds-u-margin-top--6{margin-top:48px!important}.ds-u-margin-right--6{margin-right:48px!important}.ds-u-margin-bottom--6{margin-bottom:48px!important}.ds-u-margin-left--6,.ds-u-margin-x--6{margin-left:48px!important}.ds-u-margin-x--6{margin-right:48px!important}.ds-u-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-margin--7{margin:56px!important}.ds-u-margin-top--7{margin-top:56px!important}.ds-u-margin-right--7{margin-right:56px!important}.ds-u-margin-bottom--7{margin-bottom:56px!important}.ds-u-margin-left--7,.ds-u-margin-x--7{margin-left:56px!important}.ds-u-margin-x--7{margin-right:56px!important}.ds-u-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}@media (min-width:544px){.ds-u-sm-margin--0{margin:0!important}.ds-u-sm-margin-top--0{margin-top:0!important}.ds-u-sm-margin-right--0{margin-right:0!important}.ds-u-sm-margin-bottom--0{margin-bottom:0!important}.ds-u-sm-margin-left--0,.ds-u-sm-margin-x--0{margin-left:0!important}.ds-u-sm-margin-x--0{margin-right:0!important}.ds-u-sm-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-sm-margin--1{margin:8px!important}.ds-u-sm-margin-top--1{margin-top:8px!important}.ds-u-sm-margin-right--1{margin-right:8px!important}.ds-u-sm-margin-bottom--1{margin-bottom:8px!important}.ds-u-sm-margin-left--1,.ds-u-sm-margin-x--1{margin-left:8px!important}.ds-u-sm-margin-x--1{margin-right:8px!important}.ds-u-sm-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-sm-margin--2{margin:16px!important}.ds-u-sm-margin-top--2{margin-top:16px!important}.ds-u-sm-margin-right--2{margin-right:16px!important}.ds-u-sm-margin-bottom--2{margin-bottom:16px!important}.ds-u-sm-margin-left--2,.ds-u-sm-margin-x--2{margin-left:16px!important}.ds-u-sm-margin-x--2{margin-right:16px!important}.ds-u-sm-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-sm-margin--3{margin:24px!important}.ds-u-sm-margin-top--3{margin-top:24px!important}.ds-u-sm-margin-right--3{margin-right:24px!important}.ds-u-sm-margin-bottom--3{margin-bottom:24px!important}.ds-u-sm-margin-left--3,.ds-u-sm-margin-x--3{margin-left:24px!important}.ds-u-sm-margin-x--3{margin-right:24px!important}.ds-u-sm-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-sm-margin--4{margin:32px!important}.ds-u-sm-margin-top--4{margin-top:32px!important}.ds-u-sm-margin-right--4{margin-right:32px!important}.ds-u-sm-margin-bottom--4{margin-bottom:32px!important}.ds-u-sm-margin-left--4,.ds-u-sm-margin-x--4{margin-left:32px!important}.ds-u-sm-margin-x--4{margin-right:32px!important}.ds-u-sm-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-sm-margin--5{margin:40px!important}.ds-u-sm-margin-top--5{margin-top:40px!important}.ds-u-sm-margin-right--5{margin-right:40px!important}.ds-u-sm-margin-bottom--5{margin-bottom:40px!important}.ds-u-sm-margin-left--5,.ds-u-sm-margin-x--5{margin-left:40px!important}.ds-u-sm-margin-x--5{margin-right:40px!important}.ds-u-sm-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-sm-margin--6{margin:48px!important}.ds-u-sm-margin-top--6{margin-top:48px!important}.ds-u-sm-margin-right--6{margin-right:48px!important}.ds-u-sm-margin-bottom--6{margin-bottom:48px!important}.ds-u-sm-margin-left--6,.ds-u-sm-margin-x--6{margin-left:48px!important}.ds-u-sm-margin-x--6{margin-right:48px!important}.ds-u-sm-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-sm-margin--7{margin:56px!important}.ds-u-sm-margin-top--7{margin-top:56px!important}.ds-u-sm-margin-right--7{margin-right:56px!important}.ds-u-sm-margin-bottom--7{margin-bottom:56px!important}.ds-u-sm-margin-left--7,.ds-u-sm-margin-x--7{margin-left:56px!important}.ds-u-sm-margin-x--7{margin-right:56px!important}.ds-u-sm-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}@media (min-width:768px){.ds-u-md-margin--0{margin:0!important}.ds-u-md-margin-top--0{margin-top:0!important}.ds-u-md-margin-right--0{margin-right:0!important}.ds-u-md-margin-bottom--0{margin-bottom:0!important}.ds-u-md-margin-left--0,.ds-u-md-margin-x--0{margin-left:0!important}.ds-u-md-margin-x--0{margin-right:0!important}.ds-u-md-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-md-margin--1{margin:8px!important}.ds-u-md-margin-top--1{margin-top:8px!important}.ds-u-md-margin-right--1{margin-right:8px!important}.ds-u-md-margin-bottom--1{margin-bottom:8px!important}.ds-u-md-margin-left--1,.ds-u-md-margin-x--1{margin-left:8px!important}.ds-u-md-margin-x--1{margin-right:8px!important}.ds-u-md-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-md-margin--2{margin:16px!important}.ds-u-md-margin-top--2{margin-top:16px!important}.ds-u-md-margin-right--2{margin-right:16px!important}.ds-u-md-margin-bottom--2{margin-bottom:16px!important}.ds-u-md-margin-left--2,.ds-u-md-margin-x--2{margin-left:16px!important}.ds-u-md-margin-x--2{margin-right:16px!important}.ds-u-md-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-md-margin--3{margin:24px!important}.ds-u-md-margin-top--3{margin-top:24px!important}.ds-u-md-margin-right--3{margin-right:24px!important}.ds-u-md-margin-bottom--3{margin-bottom:24px!important}.ds-u-md-margin-left--3,.ds-u-md-margin-x--3{margin-left:24px!important}.ds-u-md-margin-x--3{margin-right:24px!important}.ds-u-md-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-md-margin--4{margin:32px!important}.ds-u-md-margin-top--4{margin-top:32px!important}.ds-u-md-margin-right--4{margin-right:32px!important}.ds-u-md-margin-bottom--4{margin-bottom:32px!important}.ds-u-md-margin-left--4,.ds-u-md-margin-x--4{margin-left:32px!important}.ds-u-md-margin-x--4{margin-right:32px!important}.ds-u-md-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-md-margin--5{margin:40px!important}.ds-u-md-margin-top--5{margin-top:40px!important}.ds-u-md-margin-right--5{margin-right:40px!important}.ds-u-md-margin-bottom--5{margin-bottom:40px!important}.ds-u-md-margin-left--5,.ds-u-md-margin-x--5{margin-left:40px!important}.ds-u-md-margin-x--5{margin-right:40px!important}.ds-u-md-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-md-margin--6{margin:48px!important}.ds-u-md-margin-top--6{margin-top:48px!important}.ds-u-md-margin-right--6{margin-right:48px!important}.ds-u-md-margin-bottom--6{margin-bottom:48px!important}.ds-u-md-margin-left--6,.ds-u-md-margin-x--6{margin-left:48px!important}.ds-u-md-margin-x--6{margin-right:48px!important}.ds-u-md-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-md-margin--7{margin:56px!important}.ds-u-md-margin-top--7{margin-top:56px!important}.ds-u-md-margin-right--7{margin-right:56px!important}.ds-u-md-margin-bottom--7{margin-bottom:56px!important}.ds-u-md-margin-left--7,.ds-u-md-margin-x--7{margin-left:56px!important}.ds-u-md-margin-x--7{margin-right:56px!important}.ds-u-md-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}@media (min-width:1024px){.ds-u-lg-margin--0{margin:0!important}.ds-u-lg-margin-top--0{margin-top:0!important}.ds-u-lg-margin-right--0{margin-right:0!important}.ds-u-lg-margin-bottom--0{margin-bottom:0!important}.ds-u-lg-margin-left--0,.ds-u-lg-margin-x--0{margin-left:0!important}.ds-u-lg-margin-x--0{margin-right:0!important}.ds-u-lg-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-lg-margin--1{margin:8px!important}.ds-u-lg-margin-top--1{margin-top:8px!important}.ds-u-lg-margin-right--1{margin-right:8px!important}.ds-u-lg-margin-bottom--1{margin-bottom:8px!important}.ds-u-lg-margin-left--1,.ds-u-lg-margin-x--1{margin-left:8px!important}.ds-u-lg-margin-x--1{margin-right:8px!important}.ds-u-lg-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-lg-margin--2{margin:16px!important}.ds-u-lg-margin-top--2{margin-top:16px!important}.ds-u-lg-margin-right--2{margin-right:16px!important}.ds-u-lg-margin-bottom--2{margin-bottom:16px!important}.ds-u-lg-margin-left--2,.ds-u-lg-margin-x--2{margin-left:16px!important}.ds-u-lg-margin-x--2{margin-right:16px!important}.ds-u-lg-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-lg-margin--3{margin:24px!important}.ds-u-lg-margin-top--3{margin-top:24px!important}.ds-u-lg-margin-right--3{margin-right:24px!important}.ds-u-lg-margin-bottom--3{margin-bottom:24px!important}.ds-u-lg-margin-left--3,.ds-u-lg-margin-x--3{margin-left:24px!important}.ds-u-lg-margin-x--3{margin-right:24px!important}.ds-u-lg-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-lg-margin--4{margin:32px!important}.ds-u-lg-margin-top--4{margin-top:32px!important}.ds-u-lg-margin-right--4{margin-right:32px!important}.ds-u-lg-margin-bottom--4{margin-bottom:32px!important}.ds-u-lg-margin-left--4,.ds-u-lg-margin-x--4{margin-left:32px!important}.ds-u-lg-margin-x--4{margin-right:32px!important}.ds-u-lg-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-lg-margin--5{margin:40px!important}.ds-u-lg-margin-top--5{margin-top:40px!important}.ds-u-lg-margin-right--5{margin-right:40px!important}.ds-u-lg-margin-bottom--5{margin-bottom:40px!important}.ds-u-lg-margin-left--5,.ds-u-lg-margin-x--5{margin-left:40px!important}.ds-u-lg-margin-x--5{margin-right:40px!important}.ds-u-lg-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-lg-margin--6{margin:48px!important}.ds-u-lg-margin-top--6{margin-top:48px!important}.ds-u-lg-margin-right--6{margin-right:48px!important}.ds-u-lg-margin-bottom--6{margin-bottom:48px!important}.ds-u-lg-margin-left--6,.ds-u-lg-margin-x--6{margin-left:48px!important}.ds-u-lg-margin-x--6{margin-right:48px!important}.ds-u-lg-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-lg-margin--7{margin:56px!important}.ds-u-lg-margin-top--7{margin-top:56px!important}.ds-u-lg-margin-right--7{margin-right:56px!important}.ds-u-lg-margin-bottom--7{margin-bottom:56px!important}.ds-u-lg-margin-left--7,.ds-u-lg-margin-x--7{margin-left:56px!important}.ds-u-lg-margin-x--7{margin-right:56px!important}.ds-u-lg-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}@media (min-width:1280px){.ds-u-xl-margin--0{margin:0!important}.ds-u-xl-margin-top--0{margin-top:0!important}.ds-u-xl-margin-right--0{margin-right:0!important}.ds-u-xl-margin-bottom--0{margin-bottom:0!important}.ds-u-xl-margin-left--0,.ds-u-xl-margin-x--0{margin-left:0!important}.ds-u-xl-margin-x--0{margin-right:0!important}.ds-u-xl-margin-y--0{margin-bottom:0!important;margin-top:0!important}.ds-u-xl-margin--1{margin:8px!important}.ds-u-xl-margin-top--1{margin-top:8px!important}.ds-u-xl-margin-right--1{margin-right:8px!important}.ds-u-xl-margin-bottom--1{margin-bottom:8px!important}.ds-u-xl-margin-left--1,.ds-u-xl-margin-x--1{margin-left:8px!important}.ds-u-xl-margin-x--1{margin-right:8px!important}.ds-u-xl-margin-y--1{margin-bottom:8px!important;margin-top:8px!important}.ds-u-xl-margin--2{margin:16px!important}.ds-u-xl-margin-top--2{margin-top:16px!important}.ds-u-xl-margin-right--2{margin-right:16px!important}.ds-u-xl-margin-bottom--2{margin-bottom:16px!important}.ds-u-xl-margin-left--2,.ds-u-xl-margin-x--2{margin-left:16px!important}.ds-u-xl-margin-x--2{margin-right:16px!important}.ds-u-xl-margin-y--2{margin-bottom:16px!important;margin-top:16px!important}.ds-u-xl-margin--3{margin:24px!important}.ds-u-xl-margin-top--3{margin-top:24px!important}.ds-u-xl-margin-right--3{margin-right:24px!important}.ds-u-xl-margin-bottom--3{margin-bottom:24px!important}.ds-u-xl-margin-left--3,.ds-u-xl-margin-x--3{margin-left:24px!important}.ds-u-xl-margin-x--3{margin-right:24px!important}.ds-u-xl-margin-y--3{margin-bottom:24px!important;margin-top:24px!important}.ds-u-xl-margin--4{margin:32px!important}.ds-u-xl-margin-top--4{margin-top:32px!important}.ds-u-xl-margin-right--4{margin-right:32px!important}.ds-u-xl-margin-bottom--4{margin-bottom:32px!important}.ds-u-xl-margin-left--4,.ds-u-xl-margin-x--4{margin-left:32px!important}.ds-u-xl-margin-x--4{margin-right:32px!important}.ds-u-xl-margin-y--4{margin-bottom:32px!important;margin-top:32px!important}.ds-u-xl-margin--5{margin:40px!important}.ds-u-xl-margin-top--5{margin-top:40px!important}.ds-u-xl-margin-right--5{margin-right:40px!important}.ds-u-xl-margin-bottom--5{margin-bottom:40px!important}.ds-u-xl-margin-left--5,.ds-u-xl-margin-x--5{margin-left:40px!important}.ds-u-xl-margin-x--5{margin-right:40px!important}.ds-u-xl-margin-y--5{margin-bottom:40px!important;margin-top:40px!important}.ds-u-xl-margin--6{margin:48px!important}.ds-u-xl-margin-top--6{margin-top:48px!important}.ds-u-xl-margin-right--6{margin-right:48px!important}.ds-u-xl-margin-bottom--6{margin-bottom:48px!important}.ds-u-xl-margin-left--6,.ds-u-xl-margin-x--6{margin-left:48px!important}.ds-u-xl-margin-x--6{margin-right:48px!important}.ds-u-xl-margin-y--6{margin-bottom:48px!important;margin-top:48px!important}.ds-u-xl-margin--7{margin:56px!important}.ds-u-xl-margin-top--7{margin-top:56px!important}.ds-u-xl-margin-right--7{margin-right:56px!important}.ds-u-xl-margin-bottom--7{margin-bottom:56px!important}.ds-u-xl-margin-left--7,.ds-u-xl-margin-x--7{margin-left:56px!important}.ds-u-xl-margin-x--7{margin-right:56px!important}.ds-u-xl-margin-y--7{margin-bottom:56px!important;margin-top:56px!important}}.ds-u-measure--narrow{max-width:21em!important}.ds-u-measure--base{max-width:31em!important}.ds-u-measure--wide{max-width:41em!important}.ds-u-overflow--hidden{overflow:hidden!important}.ds-u-overflow--scroll{overflow:scroll!important}.ds-u-overflow--auto{overflow:auto!important}.ds-u-clearfix:after,.ds-u-clearfix:before{content:"";display:table}.ds-u-clearfix:after{clear:both}.ds-u-padding--0{padding:0!important}.ds-u-padding-top--0{padding-top:0!important}.ds-u-padding-right--0{padding-right:0!important}.ds-u-padding-bottom--0{padding-bottom:0!important}.ds-u-padding-left--0,.ds-u-padding-x--0{padding-left:0!important}.ds-u-padding-x--0{padding-right:0!important}.ds-u-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-padding--1{padding:8px!important}.ds-u-padding-top--1{padding-top:8px!important}.ds-u-padding-right--1{padding-right:8px!important}.ds-u-padding-bottom--1{padding-bottom:8px!important}.ds-u-padding-left--1,.ds-u-padding-x--1{padding-left:8px!important}.ds-u-padding-x--1{padding-right:8px!important}.ds-u-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-padding--2{padding:16px!important}.ds-u-padding-top--2{padding-top:16px!important}.ds-u-padding-right--2{padding-right:16px!important}.ds-u-padding-bottom--2{padding-bottom:16px!important}.ds-u-padding-left--2,.ds-u-padding-x--2{padding-left:16px!important}.ds-u-padding-x--2{padding-right:16px!important}.ds-u-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-padding--3{padding:24px!important}.ds-u-padding-top--3{padding-top:24px!important}.ds-u-padding-right--3{padding-right:24px!important}.ds-u-padding-bottom--3{padding-bottom:24px!important}.ds-u-padding-left--3,.ds-u-padding-x--3{padding-left:24px!important}.ds-u-padding-x--3{padding-right:24px!important}.ds-u-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-padding--4{padding:32px!important}.ds-u-padding-top--4{padding-top:32px!important}.ds-u-padding-right--4{padding-right:32px!important}.ds-u-padding-bottom--4{padding-bottom:32px!important}.ds-u-padding-left--4,.ds-u-padding-x--4{padding-left:32px!important}.ds-u-padding-x--4{padding-right:32px!important}.ds-u-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-padding--5{padding:40px!important}.ds-u-padding-top--5{padding-top:40px!important}.ds-u-padding-right--5{padding-right:40px!important}.ds-u-padding-bottom--5{padding-bottom:40px!important}.ds-u-padding-left--5,.ds-u-padding-x--5{padding-left:40px!important}.ds-u-padding-x--5{padding-right:40px!important}.ds-u-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-padding--6{padding:48px!important}.ds-u-padding-top--6{padding-top:48px!important}.ds-u-padding-right--6{padding-right:48px!important}.ds-u-padding-bottom--6{padding-bottom:48px!important}.ds-u-padding-left--6,.ds-u-padding-x--6{padding-left:48px!important}.ds-u-padding-x--6{padding-right:48px!important}.ds-u-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-padding--7{padding:56px!important}.ds-u-padding-top--7{padding-top:56px!important}.ds-u-padding-right--7{padding-right:56px!important}.ds-u-padding-bottom--7{padding-bottom:56px!important}.ds-u-padding-left--7,.ds-u-padding-x--7{padding-left:56px!important}.ds-u-padding-x--7{padding-right:56px!important}.ds-u-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}@media (min-width:544px){.ds-u-sm-padding--0{padding:0!important}.ds-u-sm-padding-top--0{padding-top:0!important}.ds-u-sm-padding-right--0{padding-right:0!important}.ds-u-sm-padding-bottom--0{padding-bottom:0!important}.ds-u-sm-padding-left--0,.ds-u-sm-padding-x--0{padding-left:0!important}.ds-u-sm-padding-x--0{padding-right:0!important}.ds-u-sm-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-sm-padding--1{padding:8px!important}.ds-u-sm-padding-top--1{padding-top:8px!important}.ds-u-sm-padding-right--1{padding-right:8px!important}.ds-u-sm-padding-bottom--1{padding-bottom:8px!important}.ds-u-sm-padding-left--1,.ds-u-sm-padding-x--1{padding-left:8px!important}.ds-u-sm-padding-x--1{padding-right:8px!important}.ds-u-sm-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-sm-padding--2{padding:16px!important}.ds-u-sm-padding-top--2{padding-top:16px!important}.ds-u-sm-padding-right--2{padding-right:16px!important}.ds-u-sm-padding-bottom--2{padding-bottom:16px!important}.ds-u-sm-padding-left--2,.ds-u-sm-padding-x--2{padding-left:16px!important}.ds-u-sm-padding-x--2{padding-right:16px!important}.ds-u-sm-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-sm-padding--3{padding:24px!important}.ds-u-sm-padding-top--3{padding-top:24px!important}.ds-u-sm-padding-right--3{padding-right:24px!important}.ds-u-sm-padding-bottom--3{padding-bottom:24px!important}.ds-u-sm-padding-left--3,.ds-u-sm-padding-x--3{padding-left:24px!important}.ds-u-sm-padding-x--3{padding-right:24px!important}.ds-u-sm-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-sm-padding--4{padding:32px!important}.ds-u-sm-padding-top--4{padding-top:32px!important}.ds-u-sm-padding-right--4{padding-right:32px!important}.ds-u-sm-padding-bottom--4{padding-bottom:32px!important}.ds-u-sm-padding-left--4,.ds-u-sm-padding-x--4{padding-left:32px!important}.ds-u-sm-padding-x--4{padding-right:32px!important}.ds-u-sm-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-sm-padding--5{padding:40px!important}.ds-u-sm-padding-top--5{padding-top:40px!important}.ds-u-sm-padding-right--5{padding-right:40px!important}.ds-u-sm-padding-bottom--5{padding-bottom:40px!important}.ds-u-sm-padding-left--5,.ds-u-sm-padding-x--5{padding-left:40px!important}.ds-u-sm-padding-x--5{padding-right:40px!important}.ds-u-sm-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-sm-padding--6{padding:48px!important}.ds-u-sm-padding-top--6{padding-top:48px!important}.ds-u-sm-padding-right--6{padding-right:48px!important}.ds-u-sm-padding-bottom--6{padding-bottom:48px!important}.ds-u-sm-padding-left--6,.ds-u-sm-padding-x--6{padding-left:48px!important}.ds-u-sm-padding-x--6{padding-right:48px!important}.ds-u-sm-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-sm-padding--7{padding:56px!important}.ds-u-sm-padding-top--7{padding-top:56px!important}.ds-u-sm-padding-right--7{padding-right:56px!important}.ds-u-sm-padding-bottom--7{padding-bottom:56px!important}.ds-u-sm-padding-left--7,.ds-u-sm-padding-x--7{padding-left:56px!important}.ds-u-sm-padding-x--7{padding-right:56px!important}.ds-u-sm-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}@media (min-width:768px){.ds-u-md-padding--0{padding:0!important}.ds-u-md-padding-top--0{padding-top:0!important}.ds-u-md-padding-right--0{padding-right:0!important}.ds-u-md-padding-bottom--0{padding-bottom:0!important}.ds-u-md-padding-left--0,.ds-u-md-padding-x--0{padding-left:0!important}.ds-u-md-padding-x--0{padding-right:0!important}.ds-u-md-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-md-padding--1{padding:8px!important}.ds-u-md-padding-top--1{padding-top:8px!important}.ds-u-md-padding-right--1{padding-right:8px!important}.ds-u-md-padding-bottom--1{padding-bottom:8px!important}.ds-u-md-padding-left--1,.ds-u-md-padding-x--1{padding-left:8px!important}.ds-u-md-padding-x--1{padding-right:8px!important}.ds-u-md-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-md-padding--2{padding:16px!important}.ds-u-md-padding-top--2{padding-top:16px!important}.ds-u-md-padding-right--2{padding-right:16px!important}.ds-u-md-padding-bottom--2{padding-bottom:16px!important}.ds-u-md-padding-left--2,.ds-u-md-padding-x--2{padding-left:16px!important}.ds-u-md-padding-x--2{padding-right:16px!important}.ds-u-md-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-md-padding--3{padding:24px!important}.ds-u-md-padding-top--3{padding-top:24px!important}.ds-u-md-padding-right--3{padding-right:24px!important}.ds-u-md-padding-bottom--3{padding-bottom:24px!important}.ds-u-md-padding-left--3,.ds-u-md-padding-x--3{padding-left:24px!important}.ds-u-md-padding-x--3{padding-right:24px!important}.ds-u-md-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-md-padding--4{padding:32px!important}.ds-u-md-padding-top--4{padding-top:32px!important}.ds-u-md-padding-right--4{padding-right:32px!important}.ds-u-md-padding-bottom--4{padding-bottom:32px!important}.ds-u-md-padding-left--4,.ds-u-md-padding-x--4{padding-left:32px!important}.ds-u-md-padding-x--4{padding-right:32px!important}.ds-u-md-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-md-padding--5{padding:40px!important}.ds-u-md-padding-top--5{padding-top:40px!important}.ds-u-md-padding-right--5{padding-right:40px!important}.ds-u-md-padding-bottom--5{padding-bottom:40px!important}.ds-u-md-padding-left--5,.ds-u-md-padding-x--5{padding-left:40px!important}.ds-u-md-padding-x--5{padding-right:40px!important}.ds-u-md-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-md-padding--6{padding:48px!important}.ds-u-md-padding-top--6{padding-top:48px!important}.ds-u-md-padding-right--6{padding-right:48px!important}.ds-u-md-padding-bottom--6{padding-bottom:48px!important}.ds-u-md-padding-left--6,.ds-u-md-padding-x--6{padding-left:48px!important}.ds-u-md-padding-x--6{padding-right:48px!important}.ds-u-md-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-md-padding--7{padding:56px!important}.ds-u-md-padding-top--7{padding-top:56px!important}.ds-u-md-padding-right--7{padding-right:56px!important}.ds-u-md-padding-bottom--7{padding-bottom:56px!important}.ds-u-md-padding-left--7,.ds-u-md-padding-x--7{padding-left:56px!important}.ds-u-md-padding-x--7{padding-right:56px!important}.ds-u-md-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}@media (min-width:1024px){.ds-u-lg-padding--0{padding:0!important}.ds-u-lg-padding-top--0{padding-top:0!important}.ds-u-lg-padding-right--0{padding-right:0!important}.ds-u-lg-padding-bottom--0{padding-bottom:0!important}.ds-u-lg-padding-left--0,.ds-u-lg-padding-x--0{padding-left:0!important}.ds-u-lg-padding-x--0{padding-right:0!important}.ds-u-lg-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-lg-padding--1{padding:8px!important}.ds-u-lg-padding-top--1{padding-top:8px!important}.ds-u-lg-padding-right--1{padding-right:8px!important}.ds-u-lg-padding-bottom--1{padding-bottom:8px!important}.ds-u-lg-padding-left--1,.ds-u-lg-padding-x--1{padding-left:8px!important}.ds-u-lg-padding-x--1{padding-right:8px!important}.ds-u-lg-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-lg-padding--2{padding:16px!important}.ds-u-lg-padding-top--2{padding-top:16px!important}.ds-u-lg-padding-right--2{padding-right:16px!important}.ds-u-lg-padding-bottom--2{padding-bottom:16px!important}.ds-u-lg-padding-left--2,.ds-u-lg-padding-x--2{padding-left:16px!important}.ds-u-lg-padding-x--2{padding-right:16px!important}.ds-u-lg-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-lg-padding--3{padding:24px!important}.ds-u-lg-padding-top--3{padding-top:24px!important}.ds-u-lg-padding-right--3{padding-right:24px!important}.ds-u-lg-padding-bottom--3{padding-bottom:24px!important}.ds-u-lg-padding-left--3,.ds-u-lg-padding-x--3{padding-left:24px!important}.ds-u-lg-padding-x--3{padding-right:24px!important}.ds-u-lg-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-lg-padding--4{padding:32px!important}.ds-u-lg-padding-top--4{padding-top:32px!important}.ds-u-lg-padding-right--4{padding-right:32px!important}.ds-u-lg-padding-bottom--4{padding-bottom:32px!important}.ds-u-lg-padding-left--4,.ds-u-lg-padding-x--4{padding-left:32px!important}.ds-u-lg-padding-x--4{padding-right:32px!important}.ds-u-lg-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-lg-padding--5{padding:40px!important}.ds-u-lg-padding-top--5{padding-top:40px!important}.ds-u-lg-padding-right--5{padding-right:40px!important}.ds-u-lg-padding-bottom--5{padding-bottom:40px!important}.ds-u-lg-padding-left--5,.ds-u-lg-padding-x--5{padding-left:40px!important}.ds-u-lg-padding-x--5{padding-right:40px!important}.ds-u-lg-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-lg-padding--6{padding:48px!important}.ds-u-lg-padding-top--6{padding-top:48px!important}.ds-u-lg-padding-right--6{padding-right:48px!important}.ds-u-lg-padding-bottom--6{padding-bottom:48px!important}.ds-u-lg-padding-left--6,.ds-u-lg-padding-x--6{padding-left:48px!important}.ds-u-lg-padding-x--6{padding-right:48px!important}.ds-u-lg-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-lg-padding--7{padding:56px!important}.ds-u-lg-padding-top--7{padding-top:56px!important}.ds-u-lg-padding-right--7{padding-right:56px!important}.ds-u-lg-padding-bottom--7{padding-bottom:56px!important}.ds-u-lg-padding-left--7,.ds-u-lg-padding-x--7{padding-left:56px!important}.ds-u-lg-padding-x--7{padding-right:56px!important}.ds-u-lg-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}@media (min-width:1280px){.ds-u-xl-padding--0{padding:0!important}.ds-u-xl-padding-top--0{padding-top:0!important}.ds-u-xl-padding-right--0{padding-right:0!important}.ds-u-xl-padding-bottom--0{padding-bottom:0!important}.ds-u-xl-padding-left--0,.ds-u-xl-padding-x--0{padding-left:0!important}.ds-u-xl-padding-x--0{padding-right:0!important}.ds-u-xl-padding-y--0{padding-bottom:0!important;padding-top:0!important}.ds-u-xl-padding--1{padding:8px!important}.ds-u-xl-padding-top--1{padding-top:8px!important}.ds-u-xl-padding-right--1{padding-right:8px!important}.ds-u-xl-padding-bottom--1{padding-bottom:8px!important}.ds-u-xl-padding-left--1,.ds-u-xl-padding-x--1{padding-left:8px!important}.ds-u-xl-padding-x--1{padding-right:8px!important}.ds-u-xl-padding-y--1{padding-bottom:8px!important;padding-top:8px!important}.ds-u-xl-padding--2{padding:16px!important}.ds-u-xl-padding-top--2{padding-top:16px!important}.ds-u-xl-padding-right--2{padding-right:16px!important}.ds-u-xl-padding-bottom--2{padding-bottom:16px!important}.ds-u-xl-padding-left--2,.ds-u-xl-padding-x--2{padding-left:16px!important}.ds-u-xl-padding-x--2{padding-right:16px!important}.ds-u-xl-padding-y--2{padding-bottom:16px!important;padding-top:16px!important}.ds-u-xl-padding--3{padding:24px!important}.ds-u-xl-padding-top--3{padding-top:24px!important}.ds-u-xl-padding-right--3{padding-right:24px!important}.ds-u-xl-padding-bottom--3{padding-bottom:24px!important}.ds-u-xl-padding-left--3,.ds-u-xl-padding-x--3{padding-left:24px!important}.ds-u-xl-padding-x--3{padding-right:24px!important}.ds-u-xl-padding-y--3{padding-bottom:24px!important;padding-top:24px!important}.ds-u-xl-padding--4{padding:32px!important}.ds-u-xl-padding-top--4{padding-top:32px!important}.ds-u-xl-padding-right--4{padding-right:32px!important}.ds-u-xl-padding-bottom--4{padding-bottom:32px!important}.ds-u-xl-padding-left--4,.ds-u-xl-padding-x--4{padding-left:32px!important}.ds-u-xl-padding-x--4{padding-right:32px!important}.ds-u-xl-padding-y--4{padding-bottom:32px!important;padding-top:32px!important}.ds-u-xl-padding--5{padding:40px!important}.ds-u-xl-padding-top--5{padding-top:40px!important}.ds-u-xl-padding-right--5{padding-right:40px!important}.ds-u-xl-padding-bottom--5{padding-bottom:40px!important}.ds-u-xl-padding-left--5,.ds-u-xl-padding-x--5{padding-left:40px!important}.ds-u-xl-padding-x--5{padding-right:40px!important}.ds-u-xl-padding-y--5{padding-bottom:40px!important;padding-top:40px!important}.ds-u-xl-padding--6{padding:48px!important}.ds-u-xl-padding-top--6{padding-top:48px!important}.ds-u-xl-padding-right--6{padding-right:48px!important}.ds-u-xl-padding-bottom--6{padding-bottom:48px!important}.ds-u-xl-padding-left--6,.ds-u-xl-padding-x--6{padding-left:48px!important}.ds-u-xl-padding-x--6{padding-right:48px!important}.ds-u-xl-padding-y--6{padding-bottom:48px!important;padding-top:48px!important}.ds-u-xl-padding--7{padding:56px!important}.ds-u-xl-padding-top--7{padding-top:56px!important}.ds-u-xl-padding-right--7{padding-right:56px!important}.ds-u-xl-padding-bottom--7{padding-bottom:56px!important}.ds-u-xl-padding-left--7,.ds-u-xl-padding-x--7{padding-left:56px!important}.ds-u-xl-padding-x--7{padding-right:56px!important}.ds-u-xl-padding-y--7{padding-bottom:56px!important;padding-top:56px!important}}.ds-u-text-align--center{text-align:center!important}.ds-u-text-align--left{text-align:left!important}.ds-u-text-align--right{text-align:right!important}@media (min-width:544px){.ds-u-sm-text-align--center{text-align:center!important}.ds-u-sm-text-align--left{text-align:left!important}.ds-u-sm-text-align--right{text-align:right!important}}@media (min-width:768px){.ds-u-md-text-align--center{text-align:center!important}.ds-u-md-text-align--left{text-align:left!important}.ds-u-md-text-align--right{text-align:right!important}}@media (min-width:1024px){.ds-u-lg-text-align--center{text-align:center!important}.ds-u-lg-text-align--left{text-align:left!important}.ds-u-lg-text-align--right{text-align:right!important}}@media (min-width:1280px){.ds-u-xl-text-align--center{text-align:center!important}.ds-u-xl-text-align--left{text-align:left!important}.ds-u-xl-text-align--right{text-align:right!important}}.ds-u-text-decoration--underline{text-decoration:underline!important}.ds-u-text-decoration--none{text-decoration:none!important}.ds-u-text-transform--uppercase{text-transform:uppercase!important}.ds-u-text-transform--lowercase{text-transform:lowercase!important}.ds-u-text-transform--capitalize{text-transform:capitalize!important}.ds-u-truncate{max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.ds-u-valign--top{vertical-align:top!important}.ds-u-valign--middle{vertical-align:middle!important}.ds-u-valign--bottom{vertical-align:bottom!important}
\ No newline at end of file
diff --git a/packages/core/package.json b/packages/core/package.json
index 177e52561f..e4de828a42 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,11 +1,12 @@
 {
   "name": "@cmsgov/design-system-core",
-  "version": "1.0.0-alpha.11",
+  "version": "1.0.0-rc.1",
   "publishConfig": {
     "access": "public"
   },
   "description": "Core Sass/CSS and React design system assets",
   "repository": "CMSgov/design-system",
+  "license": "SEE LICENSE IN LICENSE.md",
   "main": "dist/index.js",
   "dependencies": {
     "bourbon": "^4.3.3",
diff --git a/packages/docs/package.json b/packages/docs/package.json
index 3eb4a04d60..08161cef01 100644
--- a/packages/docs/package.json
+++ b/packages/docs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@cmsgov/design-system-docs",
-  "version": "1.0.0-alpha.11",
+  "version": "1.0.0-rc.1",
   "private": true,
   "description": "Design system's documentation website",
   "repository": "CMSgov/design-system",
@@ -10,7 +10,7 @@
     "react-test-renderer": "^15.6.1"
   },
   "dependencies": {
-    "@cmsgov/design-system-core": "^1.0.0-alpha",
+    "@cmsgov/design-system-core": "latest",
     "classnames": "^2.2.5",
     "prismjs": "^1.6.0",
     "prop-types": "^15.5.10",