Updated dist

codeforamerica · Jan 17, 2024 · fc9e4d9 · fc9e4d9
1 parent 811a3d4
commit fc9e4d9
Show file tree

Hide file tree

Showing 24 changed files with 1,814 additions and 1,868 deletions.
diff --git a/dist/assets/css/styles.css b/dist/assets/css/styles.css
diff --git a/dist/assets/site/site.css b/dist/assets/site/site.css
diff --git a/dist/components/accordion/index.html b/dist/components/accordion/index.html
diff --git a/dist/components/alert/index.html b/dist/components/alert/index.html
diff --git a/dist/components/button/index.html b/dist/components/button/index.html
diff --git a/dist/components/checkbox/index.html b/dist/components/checkbox/index.html
diff --git a/dist/components/details/index.html b/dist/components/details/index.html
diff --git a/dist/components/fieldset/index.html b/dist/components/fieldset/index.html
diff --git a/dist/components/file-selector/index.html b/dist/components/file-selector/index.html
diff --git a/dist/components/follow-up-question/index.html b/dist/components/follow-up-question/index.html
diff --git a/dist/components/footer/index.html b/dist/components/footer/index.html
diff --git a/dist/components/form-card/index.html b/dist/components/form-card/index.html
diff --git a/dist/components/form-group/index.html b/dist/components/form-group/index.html
diff --git a/dist/components/household-details/index.html b/dist/components/household-details/index.html
diff --git a/dist/components/identifier/index.html b/dist/components/identifier/index.html
@@ -228,8 +228,8 @@ <h2 id="details">Details</h2>
   <li><strong>Extends:</strong> <a href="https://designsystem.digital.gov/components/identifier" target="_blank" rel="noopener nofollow" class="usa-link--external">USWDS Identifier, no logos</a></li>
 </ul>
 <div class="cfa-details">
-  <button class="cfa-details__summary" data-js="details" data-aria-controls="aria-c-533f74dd9dc9e"><span>More details</span> <svg class="usa-icon" aria-hidden="true" focusable="false" role="img"><use href="https://codeforamerica.github.io/uswds/assets/img/sprite.svg#chevron_right"></use></svg></button>
-  <div class="cfa-details__content" id="aria-c-533f74dd9dc9e"><p>The <b>Identifier</b> extends the <a href="https://designsystem.digital.gov/components/identifier" target="_blank" rel="noopener nofollow" class="usa-link--external">USWDS Identifier, no logos</a>. </p></div>
+  <button class="cfa-details__summary" data-js="details" data-aria-controls="aria-c-4ba781a11a72f"><span>More details</span> <svg class="usa-icon" aria-hidden="true" focusable="false" role="img"><use href="https://codeforamerica.github.io/uswds/assets/img/sprite.svg#chevron_right"></use></svg></button>
+  <div class="cfa-details__content" id="aria-c-4ba781a11a72f"><p>The <b>Identifier</b> extends the <a href="https://designsystem.digital.gov/components/identifier" target="_blank" rel="noopener nofollow" class="usa-link--external">USWDS Identifier, no logos</a>. </p></div>
 </div>
 <!-- EXAMPLES -->
 <h2 id="examples">Examples</h2>
@@ -266,22 +266,22 @@ <h2 id="examples">Examples</h2>
   <div class="margin-0 margin-top-3">
     <div class="usa-accordion cfa-accordion">
       <div class="usa-accordion__heading">
-        <button type="button" class="usa-accordion__button" aria-expanded="false" aria-controls="aria-c-html-0fddc3850d574">
+        <button type="button" class="usa-accordion__button" aria-expanded="false" aria-controls="aria-c-html-8b81d9f6bb6a8">
           View HTML
         </button>
       </div>
-      <div id="aria-c-html-0fddc3850d574" class="usa-accordion__content overflow-visible">
+      <div id="aria-c-html-8b81d9f6bb6a8" class="usa-accordion__content overflow-visible">
         <p>The HTML for the demonstration above is rendered using context passed to the component's Thymeleaf template fragment. Learn how to include component templates for Thymeleaf and Ruby in the <a href="#source-and-usage">source and usage section</a>.</p>
         <div class="code-block">
       <div class="code-block__utility position-sticky pin-top">
-        <button data-js="copy" data-copy="block-1ea524848f7b5" class="usa-button cfa-button">
+        <button data-js="copy" data-copy="block-babcd6f535dd2" class="usa-button cfa-button">
           <svg class="usa-icon" aria-hidden="true" focusable="false" role="img">
             <use data-copy="icon" href="https://codeforamerica.github.io/uswds/assets/img/sprite.svg#content_copy"></use>
           </svg>
           <span>Copy<span class="usa-sr-only"> the following block to clipboard</span></span>
         </button>
         <span data-copy="message" aria-live="assertive" class="usa-sr-only"></span>
-        <textarea hidden data-copy-target="block-1ea524848f7b5">&lt;div class=&quot;usa-identifier cfa-font-smooth&quot;&gt;
+        <textarea hidden data-copy-target="block-babcd6f535dd2">&lt;div class=&quot;usa-identifier cfa-font-smooth&quot;&gt;
   &lt;section class=&quot;usa-identifier__section usa-identifier__section--masthead&quot; aria-label=&quot;Agency identifier&quot;&gt;
     &lt;div class=&quot;usa-identifier__container&quot;&gt;
       &lt;div class=&quot;usa-identifier__identity&quot;&gt;
@@ -341,22 +341,22 @@ <h2 id="examples">Examples</h2>
     </div>
       </div>
       <div class="usa-accordion__heading">
-        <button type="button" class="usa-accordion__button" aria-expanded="false" aria-controls="aria-c-context-0fddc3850d574">
+        <button type="button" class="usa-accordion__button" aria-expanded="false" aria-controls="aria-c-context-8b81d9f6bb6a8">
           View context passed to this component
         </button>
       </div>
-      <div id="aria-c-context-0fddc3850d574" class="usa-accordion__content overflow-visible">
+      <div id="aria-c-context-8b81d9f6bb6a8" class="usa-accordion__content overflow-visible">
         <p>Context is the information necessary to configure and render a component template to HTML. It may include plain text strings, HTML, class names, IDs or other HTML attribute values. The context here is defined as JSON but the root attributes are translated to different variable syntaxes for Thymeleaf and Ruby templates. Learn how to pass these variables to each component template in the <a href="#source-and-usage">source and usage section</a>.</p>
         <div class="code-block">
       <div class="code-block__utility position-sticky pin-top">
-        <button data-js="copy" data-copy="block-c86a73b225381" class="usa-button cfa-button">
+        <button data-js="copy" data-copy="block-18f3fa539ddbc" class="usa-button cfa-button">
           <svg class="usa-icon" aria-hidden="true" focusable="false" role="img">
             <use data-copy="icon" href="https://codeforamerica.github.io/uswds/assets/img/sprite.svg#content_copy"></use>
           </svg>
           <span>Copy<span class="usa-sr-only"> the following block to clipboard</span></span>
         </button>
         <span data-copy="message" aria-live="assertive" class="usa-sr-only"></span>
-        <textarea hidden data-copy-target="block-c86a73b225381">{
+        <textarea hidden data-copy-target="block-18f3fa539ddbc">{
   &quot;modifier&quot;: &quot;cfa-font-smooth&quot;,
   &quot;identity&quot;: {
     &quot;ariaLabel&quot;: &quot;Agency identifier&quot;,
@@ -551,8 +551,8 @@ <h2 id="source-and-usage">Source and usage</h2>
   <li><strong>Embedded Ruby (ERB) partial template:</strong> <code>./_cfa-identifier.html.erb</code></li>
 </ul>
 <div class="cfa-details margin-bottom-3">
-  <button class="cfa-details__summary" data-js="details" data-aria-controls="aria-c-6ac90b780c6e3"><span>What is a package?</span> <svg class="usa-icon" aria-hidden="true" focusable="false" role="img"><use href="https://codeforamerica.github.io/uswds/assets/img/sprite.svg#chevron_right"></use></svg></button>
-  <div class="cfa-details__content" id="aria-c-6ac90b780c6e3">
+  <button class="cfa-details__summary" data-js="details" data-aria-controls="aria-c-980b6074883be"><span>What is a package?</span> <svg class="usa-icon" aria-hidden="true" focusable="false" role="img"><use href="https://codeforamerica.github.io/uswds/assets/img/sprite.svg#chevron_right"></use></svg></button>
+  <div class="cfa-details__content" id="aria-c-980b6074883be">
   Packages are collections of functionality that make up a component. Typically, they include stylesheets, templates, and scripts. <a href="https://designsystem.digital.gov/components/packages" target="_blank" rel="noopener nofollow" class="usa-link--external">Learn more about packages on the USWDS documentation site</a>.
   </div>
 </div>
@@ -563,14 +563,14 @@ <h2 id="source-and-usage">Source and usage</h2>
       <p>Refer to the <a href="https://designsystem.digital.gov/components/identifier/#using-the-identifier-component-2" target="_blank" rel="noopener nofollow" class="usa-link--external">usage documentation</a> for additional USWDS theme settings.</p></figcaption>
     <div class="code-block">
       <div class="code-block__utility position-sticky pin-top">
-        <button data-js="copy" data-copy="block-7df303bea0547" class="usa-button cfa-button">
+        <button data-js="copy" data-copy="block-1f87593eff068" class="usa-button cfa-button">
           <svg class="usa-icon" aria-hidden="true" focusable="false" role="img">
             <use data-copy="icon" href="https://codeforamerica.github.io/uswds/assets/img/sprite.svg#content_copy"></use>
           </svg>
           <span>Copy<span class="usa-sr-only"> the following block to clipboard</span></span>
         </button>
         <span data-copy="message" aria-live="assertive" class="usa-sr-only"></span>
-        <textarea hidden data-copy-target="block-7df303bea0547">@use &quot;uswds-core&quot; with ( /* additional USWDS theme settings */ );</textarea>
+        <textarea hidden data-copy-target="block-1f87593eff068">@use &quot;uswds-core&quot; with ( /* additional USWDS theme settings */ );</textarea>
       </div>
       <pre class="language-scss padding-top-0"><span class="hljs-keyword">@use</span> <span class="hljs-string">&quot;uswds-core&quot;</span> with ( /* additional USWDS theme settings */ );</pre>
     </div>
@@ -584,14 +584,14 @@ <h2 id="source-and-usage">Source and usage</h2>
     </figcaption>
     <div class="code-block">
       <div class="code-block__utility position-sticky pin-top">
-        <button data-js="copy" data-copy="block-86d52f23de58c" class="usa-button cfa-button">
+        <button data-js="copy" data-copy="block-7cd02df6b8aef" class="usa-button cfa-button">
           <svg class="usa-icon" aria-hidden="true" focusable="false" role="img">
             <use data-copy="icon" href="https://codeforamerica.github.io/uswds/assets/img/sprite.svg#content_copy"></use>
           </svg>
           <span>Copy<span class="usa-sr-only"> the following block to clipboard</span></span>
         </button>
         <span data-copy="message" aria-live="assertive" class="usa-sr-only"></span>
-        <textarea hidden data-copy-target="block-86d52f23de58c">&lt;div th:fragment=&quot;identifier(modifier, identity, requiredLinks, governmentSection)&quot; class=&quot;usa-identifier&quot; th:classappend=&quot;${modifier}&quot;&gt;
+        <textarea hidden data-copy-target="block-7cd02df6b8aef">&lt;div th:fragment=&quot;identifier(modifier, identity, requiredLinks, governmentSection)&quot; class=&quot;usa-identifier&quot; th:classappend=&quot;${modifier}&quot;&gt;
   &lt;section th:if=&quot;${identity}&quot; class=&quot;usa-identifier__section usa-identifier__section--masthead&quot; th:attr=&quot;aria-label=${identity.ariaLabel}&quot;&gt;
     &lt;div class=&quot;usa-identifier__container&quot;&gt;
       &lt;div class=&quot;usa-identifier__identity&quot;&gt;
@@ -651,14 +651,14 @@ <h2 id="source-and-usage">Source and usage</h2>
     </figcaption>
     <div class="code-block">
       <div class="code-block__utility position-sticky pin-top">
-        <button data-js="copy" data-copy="block-4ec0396bccd08" class="usa-button cfa-button">
+        <button data-js="copy" data-copy="block-873ccbc8d71d6" class="usa-button cfa-button">
           <svg class="usa-icon" aria-hidden="true" focusable="false" role="img">
             <use data-copy="icon" href="https://codeforamerica.github.io/uswds/assets/img/sprite.svg#content_copy"></use>
           </svg>
           <span>Copy<span class="usa-sr-only"> the following block to clipboard</span></span>
         </button>
         <span data-copy="message" aria-live="assertive" class="usa-sr-only"></span>
-        <textarea hidden data-copy-target="block-4ec0396bccd08">&lt;th:block th:replace=&quot;~{packages/cfa-identifier/cfa-identifier.th :: identifier(${modifier}, ${identity}, ${requiredLinks}, ${governmentSection})}&quot; /&gt;</textarea>
+        <textarea hidden data-copy-target="block-873ccbc8d71d6">&lt;th:block th:replace=&quot;~{packages/cfa-identifier/cfa-identifier.th :: identifier(${modifier}, ${identity}, ${requiredLinks}, ${governmentSection})}&quot; /&gt;</textarea>
       </div>
       <pre class="language-html padding-top-0"><span class="hljs-tag">&lt;<span class="hljs-name">th:block</span> <span class="hljs-attr">th:replace</span>=<span class="hljs-string">&quot;~{packages/cfa-identifier/cfa-identifier.th :: identifier(${modifier}, ${identity}, ${requiredLinks}, ${governmentSection})}&quot;</span> /&gt;</span></pre>
     </div>
@@ -672,14 +672,14 @@ <h2 id="source-and-usage">Source and usage</h2>
     </figcaption>
     <div class="code-block">
       <div class="code-block__utility position-sticky pin-top">
-        <button data-js="copy" data-copy="block-44c1a519a9ae9" class="usa-button cfa-button">
+        <button data-js="copy" data-copy="block-6ab36122bff59" class="usa-button cfa-button">
           <svg class="usa-icon" aria-hidden="true" focusable="false" role="img">
             <use data-copy="icon" href="https://codeforamerica.github.io/uswds/assets/img/sprite.svg#content_copy"></use>
           </svg>
           <span>Copy<span class="usa-sr-only"> the following block to clipboard</span></span>
         </button>
         <span data-copy="message" aria-live="assertive" class="usa-sr-only"></span>
-        <textarea hidden data-copy-target="block-44c1a519a9ae9">&lt;div class=&quot;usa-identifier&lt;% if defined?(modifier) %&gt; &lt;%= modifier %&gt;&lt;% end %&gt;&quot;&gt;
+        <textarea hidden data-copy-target="block-6ab36122bff59">&lt;div class=&quot;usa-identifier&lt;% if defined?(modifier) %&gt; &lt;%= modifier %&gt;&lt;% end %&gt;&quot;&gt;
   &lt;% if defined?(identity) %&gt;&lt;section class=&quot;usa-identifier__section usa-identifier__section--masthead&quot;&lt;% if identity['ariaLabel'] %&gt; aria-label=&quot;&lt;%= identity['ariaLabel'] %&gt;&quot;&lt;% end %&gt;&gt;
     &lt;div class=&quot;usa-identifier__container&quot;&gt;
       &lt;div class=&quot;usa-identifier__identity&quot;&gt;
@@ -751,14 +751,14 @@ <h2 id="source-and-usage">Source and usage</h2>
     </figcaption>
     <div class="code-block">
       <div class="code-block__utility position-sticky pin-top">
-        <button data-js="copy" data-copy="block-1f2d8a2a58269" class="usa-button cfa-button">
+        <button data-js="copy" data-copy="block-3ede09a6a3ab2" class="usa-button cfa-button">
           <svg class="usa-icon" aria-hidden="true" focusable="false" role="img">
             <use data-copy="icon" href="https://codeforamerica.github.io/uswds/assets/img/sprite.svg#content_copy"></use>
           </svg>
           <span>Copy<span class="usa-sr-only"> the following block to clipboard</span></span>
         </button>
         <span data-copy="message" aria-live="assertive" class="usa-sr-only"></span>
-        <textarea hidden data-copy-target="block-1f2d8a2a58269">&lt;%= ERB.new(File.read('packages/cfa-identifier/_cfa-identifier.html.erb'), 0, 0, '@identifier').result_with_hash({modifier: modifier, identity: identity, requiredLinks: requiredLinks, governmentSection: governmentSection}) %&gt;</textarea>
+        <textarea hidden data-copy-target="block-3ede09a6a3ab2">&lt;%= ERB.new(File.read('packages/cfa-identifier/_cfa-identifier.html.erb'), 0, 0, '@identifier').result_with_hash({modifier: modifier, identity: identity, requiredLinks: requiredLinks, governmentSection: governmentSection}) %&gt;</textarea>
       </div>
       <pre class="language-erb padding-top-0"><span class="language-xml">&lt;%=</span><span class="language-ruby"> <span class="hljs-variable constant_">ERB</span>.new(<span class="hljs-title class_">File</span>.read(<span class="hljs-string">&#x27;packages/cfa-identifier/_cfa-identifier.html.erb&#x27;</span>), <span class="hljs-number">0</span>, <span class="hljs-number">0</span>, <span class="hljs-string">&#x27;@identifier&#x27;</span>).result_with_hash({<span class="hljs-symbol">modifier:</span> modifier, <span class="hljs-symbol">identity:</span> identity, <span class="hljs-symbol">requiredLinks:</span> requiredLinks, <span class="hljs-symbol">governmentSection:</span> governmentSection}) </span><span class="language-xml">%&gt;</span></pre>
     </div>