Contents

<% example_html = ERB.new(example).result %>

<%= pb_rails("card", props: { classname: "pb--doc", padding: "none", dark: dark }) do %>
  <div class="pb--kit-example">
    <%= pb_rails("caption", props: { text: example_title, dark: dark }) %>
    <br />
    <%= example %>
    <br>
  </div>

  <% if show_code %>
    <div class="markdown pb--kit-example-markdown <%= dark ? "dark" : "" %>">
      <%= markdown(description) %>
    </div>
    <div id="code-wrapper">
      <div class="pb--codeControls">
        <ul>
          <% if type == "rails" %>
            <li>
              <a href="#" id="copy-<%= example_key %>-trigger" onclick="copyOnClick(`<%= example_html %>`, `copy-<%= example_key %>`)">
                Copy HTML
              </a>
              <%= pb_rails("popover", props: {
                  classname: "popover-copy",
                  close_on_click: "any",
                  trigger_element_id: "copy-#{example_key}-trigger",
                  tooltip_id: "copy-#{example_key}",
                  position: "top",
                  padding: "xs"
                  }) do %>
                    HTML Copied
              <% end %>
            </li>
          <% end %>
          <li>
            <a href="#" id="toggle-open" data-toggle="code_example">Code Example</a>
          </li>
        </ul>
      </div>
      <div class="pb--codeCopy" data-action="toggle" data-togglable="code_example" style="display: none" >
        <%= pb_rails("section_separator", props: { dark: dark })%>
        <a href="#" id="toggle-close" data-toggle="false" class="pb--close-toggle">Close</a>
        <pre class="highlight"><%= raw rouge(source, highlighter) %></pre>
      </div>
    </div>
  <% end %>
<% end %>

<script>
  function copyOnClick(content, elementID) {
    copyContent(content)

    const popover = document.getElementById(elementID);
    popover.style.display = "block";

    setTimeout(() => {
      popover.style.display = "none";
    }, 3000);
  }
</script>
   

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
playbook_ui-12.16.0.pre.alpha.PLAY693tooltipwrongbg547	app/pb_kits/playbook/pb_docs/kit_example.html.erb
playbook_ui-12.16.0.pre.alpha.PLAY693tooltipwrongbg532	app/pb_kits/playbook/pb_docs/kit_example.html.erb