primer_view_components 0.0.39 → 0.0.44

data/app/components/primer/icon_button.rb

@@ -5,7 +5,13 @@ module Primer
   #
   # @accessibility
   #   `IconButton` requires an `aria-label`, which will provide assistive technologies with an accessible label.
+  #   The `aria-label` should describe the action to be invoked rather than the icon itself. For instance,
+  #   if your `IconButton` renders a magnifying glass icon and invokves a search action, the `aria-label` should be
+  #   `"Search"` instead of `"Magnifying glass"`.
+  #   [Learn more about best functional image practices (WAI Images)](https://www.w3.org/WAI/tutorials/images/functional)
   class IconButton < Primer::Component
+    status :beta
+
     DEFAULT_SCHEME = :default
     SCHEME_MAPPINGS = {
       DEFAULT_SCHEME => "",
@@ -21,22 +27,33 @@ module Primer
     #   <%= render(Primer::IconButton.new(icon: :search, "aria-label": "Search")) %>
     #   <%= render(Primer::IconButton.new(icon: :trash, "aria-label": "Delete", scheme: :danger)) %>
     #
+    # @example In a BorderBox
+    #
+    #   <%= render(Primer::BorderBoxComponent.new) do |component| %>
+    #     <% component.body do %>
+    #       <%= render(Primer::Beta::Text.new(pr: 2)) { "Body" } %>
+    #       <%= render(Primer::IconButton.new(icon: :pencil, box: true, "aria-label": "Edit")) %>
+    #     <% end %>
+    #   <% end %>
+    #
     # @param scheme [Symbol] <%= one_of(Primer::IconButton::SCHEME_OPTIONS) %>
     # @param icon [String] Name of <%= link_to_octicons %> to use.
     # @param tag [Symbol] <%= one_of(Primer::BaseButton::TAG_OPTIONS) %>
     # @param type [Symbol] <%= one_of(Primer::BaseButton::TYPE_OPTIONS) %>
+    # @param box [Boolean] Whether the button is in a <%= link_to_component(Primer::BorderBoxComponent) %>. If `true`, the button will have the `Box-btn-octicon` class.
     # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
-    def initialize(scheme: DEFAULT_SCHEME, icon:, **system_arguments)
+    def initialize(scheme: DEFAULT_SCHEME, icon:, box: false, **system_arguments)
       @icon = icon
 
       @system_arguments = system_arguments
       @system_arguments[:classes] = class_names(
         "btn-octicon",
         SCHEME_MAPPINGS[fetch_or_fallback(SCHEME_OPTIONS, scheme, DEFAULT_SCHEME)],
-        system_arguments[:classes]
+        system_arguments[:classes],
+        "Box-btn-octicon" => box
       )
 
-      raise ArgumentError, "`aria-label` is required." if @system_arguments[:"aria-label"].nil? && !Rails.env.production?
+      validate_aria_label
     end
 
     def call

data/app/components/primer/image.rb

@@ -0,0 +1,46 @@
+# frozen_string_literal: true
+
+module Primer
+  # Use `Image` to render images.
+  #
+  # @accessibility
+  #   Always provide a meaningful `alt`.
+  class Image < Primer::Component
+    # @example Default
+    #
+    #   <%= render(Primer::Image.new(src: "https://github.com/github.png", alt: "GitHub")) %>
+    #
+    # @example Helper
+    #
+    #   <%= primer_image(src: "https://github.com/github.png", alt: "GitHub") %>
+    #
+    # @example Lazy loading
+    #
+    #   <%= render(Primer::Image.new(src: "https://github.com/github.png", alt: "GitHub", lazy: true)) %>
+    #
+    # @example Custom size
+    #
+    #   <%= render(Primer::Image.new(src: "https://github.com/github.png", alt: "GitHub", height: 100, width: 100)) %>
+    #
+    # @param src [String] The source url of the image.
+    # @param alt [String] Specifies an alternate text for the image.
+    # @param lazy [Boolean] Whether or not to lazily load the image.
+    # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
+    def initialize(src:, alt:, lazy: false, **system_arguments)
+      @system_arguments = system_arguments
+
+      @system_arguments[:tag] = :img
+      @system_arguments[:src] = src
+      @system_arguments[:alt] = alt
+
+      return unless lazy
+
+      @system_arguments[:loading] = :lazy
+      @system_arguments[:decoding] = :async
+    end
+
+    def call
+      render(Primer::BaseComponent.new(**@system_arguments))
+    end
+  end
+end

data/app/components/primer/image_crop.d.ts

@@ -0,0 +1 @@
+import '@github/image-crop-element';

data/app/components/primer/image_crop.html.erb

@@ -0,0 +1,12 @@
+<%= render Primer::BaseComponent.new(**@system_arguments) do %>
+  <% if loading.present? %>
+    <%= loading %>
+  <% else %>
+    <%= render(Primer::SpinnerComponent.new(size: :large, flex: 1, "data-loading-slot": true)) %>
+  <% end %>
+
+  <input type="hidden" data-image-crop-input="x" name="cropped_x">
+  <input type="hidden" data-image-crop-input="y" name="cropped_y">
+  <input type="hidden" data-image-crop-input="width" name="cropped_width">
+  <input type="hidden" data-image-crop-input="height" name="cropped_height">
+<% end %>

data/app/components/primer/image_crop.js

@@ -0,0 +1 @@
+import '@github/image-crop-element';

data/app/components/primer/image_crop.rb

@@ -0,0 +1,36 @@
+# frozen_string_literal: true
+
+module Primer
+  # A client-side mechanism to crop images.
+  class ImageCrop < Primer::Component
+    # A loading indicator that is shown while the image is loading.
+    # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
+    renders_one :loading, lambda { |**system_arguments|
+      system_arguments[:tag] ||= :div
+      system_arguments[:"data-loading-slot"] = true
+
+      Primer::BaseComponent.new(**system_arguments)
+    }
+
+    # @example Simple cropper
+    #   <%= render(Primer::ImageCrop.new(src: "https://github.com/koddsson.png")) %>
+    #
+    # @example Square cropper
+    #   <%= render(Primer::ImageCrop.new(src: "https://github.com/koddsson.png", rounded: false)) %>
+    #
+    # @example Cropper with a custom loader
+    #   <%= render(Primer::ImageCrop.new(src: "https://github.com/koddsson.png", rounded: false)) do |cropper| %>
+    #     <% cropper.loading(style: "width: 120px").with_content("Loading...") %>
+    #   <% end %>
+    #
+    # @param src [String] The path of the image to crop.
+    # @param rounded [Boolean] If the crop mask should be a circle. Defaults to true.
+    # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
+    def initialize(src:, rounded: true, **system_arguments)
+      @system_arguments = system_arguments
+      @system_arguments[:tag] = "image-crop"
+      @system_arguments[:src] = src
+      @system_arguments[:rounded] = true if rounded
+    end
+  end
+end

data/app/components/primer/image_crop.ts

@@ -0,0 +1 @@
+import '@github/image-crop-element'

data/app/components/primer/label_component.rb

@@ -5,6 +5,9 @@ module Primer
   class LabelComponent < Primer::Component
     status :beta
 
+    DEFAULT_TAG = :span
+    TAG_OPTIONS = [DEFAULT_TAG, :summary, :a, :div].freeze
+
     SCHEME_MAPPINGS = {
       primary: "Label--primary",
       secondary: "Label--secondary",
@@ -38,13 +41,14 @@ module Primer
     #   <%= render(Primer::LabelComponent.new(title: "Label: Label")) { "Default" } %>
     #   <%= render(Primer::LabelComponent.new(title: "Label: Label", variant: :large)) { "Large" } %>
     #
+    # @param tag [Symbol] <%= one_of(Primer::LabelComponent::TAG_OPTIONS) %>
     # @param title [String] `title` attribute for the component element.
     # @param scheme [Symbol] <%= one_of(Primer::LabelComponent::SCHEME_MAPPINGS.keys) %>
     # @param variant [Symbol] <%= one_of(Primer::LabelComponent::VARIANT_OPTIONS) %>
     # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
-    def initialize(title:, scheme: nil, variant: nil, **system_arguments)
+    def initialize(tag: DEFAULT_TAG, title:, scheme: nil, variant: nil, **system_arguments)
       @system_arguments = system_arguments
-      @system_arguments[:tag] ||= :span
+      @system_arguments[:tag] = fetch_or_fallback(TAG_OPTIONS, tag, DEFAULT_TAG)
       @system_arguments[:title] = title
       @system_arguments[:classes] = class_names(
         "Label",

data/app/components/primer/local_time.d.ts

@@ -0,0 +1 @@
+import '@github/time-elements';

data/app/components/primer/local_time.js

@@ -0,0 +1 @@
+import '@github/time-elements';

data/app/components/primer/local_time.rb

@@ -0,0 +1,59 @@
+# frozen_string_literal: true
+
+module Primer
+  # Use `LocalTime` to format a date and time in the user's preferred locale format. This component requires JavaScript.
+  class LocalTime < Primer::Component
+    DEFAULT_DIGIT_TYPE = :numeric
+    DIGIT_TYPE_OPTIONS = [DEFAULT_DIGIT_TYPE, :"2-digit"].freeze
+
+    DEFAULT_TEXT_TYPE = :short
+    TEXT_TYPE_OPTIONS = [DEFAULT_TEXT_TYPE, :long].freeze
+
+    # @example Default
+    #   <%= render(Primer::LocalTime.new(datetime: DateTime.parse("2014-06-01T13:05:07Z"))) %>
+    #
+    # @example All the options
+    #   <%= render(Primer::LocalTime.new(datetime: DateTime.parse("2014-06-01T13:05:07Z"), weekday: :long, year: :"2-digit", month: :long, day: :"2-digit", hour: :"2-digit", minute: :"2-digit", second: :"2-digit", time_zone_name: :long)) %>
+    #
+    # @example With initial content
+    #   <%= render(Primer::LocalTime.new(datetime: DateTime.parse("2014-06-01T13:05:07Z"))) do %>
+    #     <!-- This content will be replaced once the component connects -->
+    #     2014/06/01 13:05
+    #   <% end %>
+    #
+    # @param datetime [DateTime] The date to parse
+    # @param initial_text [String] Text to render before component is initialized
+    # @param weekday [Symbol] <%= one_of(Primer::LocalTime::TEXT_TYPE_OPTIONS) %>
+    # @param year [Symbol] <%= one_of(Primer::LocalTime::DIGIT_TYPE_OPTIONS) %>
+    # @param month [Symbol] <%= one_of(Primer::LocalTime::TEXT_TYPE_OPTIONS) %>
+    # @param day [Symbol] <%= one_of(Primer::LocalTime::DIGIT_TYPE_OPTIONS) %>
+    # @param hour [Symbol] <%= one_of(Primer::LocalTime::DIGIT_TYPE_OPTIONS) %>
+    # @param minute [Symbol] <%= one_of(Primer::LocalTime::DIGIT_TYPE_OPTIONS) %>
+    # @param second [Symbol] <%= one_of(Primer::LocalTime::DIGIT_TYPE_OPTIONS) %>
+    # @param time_zone_name [Symbol] <%= one_of(Primer::LocalTime::TEXT_TYPE_OPTIONS) %>
+    # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
+    def initialize(datetime:, initial_text: nil, weekday: DEFAULT_TEXT_TYPE, year: DEFAULT_DIGIT_TYPE, month: DEFAULT_TEXT_TYPE, day: DEFAULT_DIGIT_TYPE, hour: DEFAULT_DIGIT_TYPE, minute: DEFAULT_DIGIT_TYPE, second: DEFAULT_DIGIT_TYPE, time_zone_name: DEFAULT_TEXT_TYPE, **system_arguments)
+      @system_arguments = system_arguments
+
+      @datetime = datetime
+
+      @system_arguments[:tag] = "local-time"
+      @system_arguments[:datetime] = datetime
+
+      @initial_text = initial_text
+
+      @system_arguments[:weekday] = fetch_or_fallback(TEXT_TYPE_OPTIONS, weekday, DEFAULT_TEXT_TYPE)
+      @system_arguments[:year] = fetch_or_fallback(DIGIT_TYPE_OPTIONS, year, DEFAULT_DIGIT_TYPE)
+      @system_arguments[:month] = fetch_or_fallback(TEXT_TYPE_OPTIONS, month, DEFAULT_TEXT_TYPE)
+      @system_arguments[:day] = fetch_or_fallback(DIGIT_TYPE_OPTIONS, day, DEFAULT_DIGIT_TYPE)
+      @system_arguments[:hour] = fetch_or_fallback(DIGIT_TYPE_OPTIONS, hour, DEFAULT_DIGIT_TYPE)
+      @system_arguments[:minute] = fetch_or_fallback(DIGIT_TYPE_OPTIONS, minute, DEFAULT_DIGIT_TYPE)
+      @system_arguments[:second] = fetch_or_fallback(DIGIT_TYPE_OPTIONS, second, DEFAULT_DIGIT_TYPE)
+      @system_arguments[:"time-zone-name"] = fetch_or_fallback(TEXT_TYPE_OPTIONS, time_zone_name, DEFAULT_TEXT_TYPE)
+    end
+
+    def call
+      render(Primer::BaseComponent.new(**@system_arguments).with_content(@initial_text || @datetime.strftime("%B %-d, %Y %H:%M %Z")))
+    end
+  end
+end

data/app/components/primer/local_time.ts

@@ -0,0 +1 @@
+import '@github/time-elements'

data/app/components/primer/{markdown_component.rb → markdown.rb}

@@ -2,9 +2,13 @@
 
 module Primer
   # Use `Markdown` to wrap markdown content
-  class MarkdownComponent < Primer::Component
+  class Markdown < Primer::Component
+    status :beta
+
+    DEFAULT_TAG = :div
+    TAG_OPTIONS = [DEFAULT_TAG, :article, :td].freeze
     # @example Default
-    #   <%= render(Primer::MarkdownComponent.new) do %>
+    #   <%= render(Primer::Markdown.new) do %>
     #     <p>Text can be <b>bold</b>, <i>italic</i>, or <s>strikethrough</s>. <a href="https://github.com">Links </a> should be blue with no underlines (unless hovered over).</p>
     #
     #     <p>There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs. There should be whitespace between paragraphs.</p>
@@ -235,11 +239,11 @@ module Primer
     #
     #     <p>Code can also use syntax highlighting.</p>
     #
-    #     <pre><code class="prism-code language-javascript">var foo = "bar";</code></pre>
+    #     <pre><code>var foo = "bar";</code></pre>
     #
     #     <pre><code>Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.</code></pre>
     #
-    #     <pre><code class="prism-code language-javascript">var foo = "The same thing is true for code with syntax highlighting. A single line of code should horizontally scroll if it is really long.";</code></pre>
+    #     <pre><code>var foo = "The same thing is true for code with syntax highlighting. A single line of code should horizontally scroll if it is really long.";</code></pre>
     #
     #     <p>Inline code inside table cells should still be distinguishable.</p>
     #
@@ -275,10 +279,11 @@ module Primer
     #     <pre><code>This is the final element on the page and there should be no margin below this.</code></pre>
     #   <% end %>
     #
+    # @param tag [Symbol] <%= one_of(Primer::Markdown::TAG_OPTIONS) %>
     # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
-    def initialize(**system_arguments)
+    def initialize(tag: DEFAULT_TAG, **system_arguments)
       @system_arguments = system_arguments
-      @system_arguments[:tag] ||= :div
+      @system_arguments[:tag] = fetch_or_fallback(TAG_OPTIONS, tag, DEFAULT_TAG)
 
       @system_arguments[:classes] = class_names(
         "markdown-body",

data/app/components/primer/navigation/tab_component.rb

@@ -4,7 +4,13 @@ module Primer
   module Navigation
     # This component is part of navigation components such as `Primer::TabNavComponent`
     # and `Primer::UnderlineNavComponent` and should not be used by itself.
+    #
+    # @accessibility
+    #   `TabComponent` renders the selected anchor tab with `aria-current="page"` by default.
+    #    When the selected tab does not correspond to the current page, such as in a nested inner tab, make sure to use aria-current="true"
     class TabComponent < Primer::Component
+      DEFAULT_ARIA_CURRENT_FOR_ANCHOR = :page
+      ARIA_CURRENT_OPTIONS_FOR_ANCHOR = [true, DEFAULT_ARIA_CURRENT_FOR_ANCHOR].freeze
       # Panel controlled by the Tab. This will not render anything in the tab itself.
       # It will provide a accessor for the Tab's parent to call and render the panel
       # content in the appropriate place.
@@ -32,8 +38,8 @@ module Primer
 
       # The Tab's text.
       #
-      # @param kwargs [Hash] The same arguments as <%= link_to_component(Primer::TextComponent) %>.
-      renders_one :text, Primer::TextComponent
+      # @param kwargs [Hash] The same arguments as <%= link_to_component(Primer::Beta::Text) %>.
+      renders_one :text, Primer::Beta::Text
 
       # Counter to be rendered in the Tab right.
       #
@@ -105,7 +111,8 @@ module Primer
         return unless @selected
 
         if @system_arguments[:tag] == :a
-          @system_arguments[:"aria-current"] = :page
+          aria_current = @system_arguments[:"aria-current"] || @system_arguments.dig(:aria, :current) || DEFAULT_ARIA_CURRENT_FOR_ANCHOR
+          @system_arguments[:"aria-current"] = fetch_or_fallback(ARIA_CURRENT_OPTIONS_FOR_ANCHOR, aria_current, DEFAULT_ARIA_CURRENT_FOR_ANCHOR)
         else
           @system_arguments[:"aria-selected"] = true
         end

data/app/components/primer/octicon_component.html.erb

@@ -0,0 +1,7 @@
+<%= render(Primer::BaseComponent.new(**@system_arguments)) do %>
+  <% if @use_symbol %>
+    <use href="#octicon_<%= [@icon.symbol, @icon.height].join("_") %>"></use>
+  <% else %>
+    <%= @icon.path.html_safe %>
+  <% end %>
+<% end %>

data/app/components/primer/octicon_component.rb

@@ -4,37 +4,49 @@ require "octicons"
 
 module Primer
   # `Octicon` renders an <%= link_to_octicons %> with <%= link_to_system_arguments_docs %>.
+  # `Octicon` can also be rendered with the `primer_octicon` helper, which accepts the same arguments.
   class OcticonComponent < Primer::Component
     status :beta
 
     SIZE_DEFAULT = :small
+    SIZE_MEDIUM = :medium
+
     SIZE_MAPPINGS = {
       SIZE_DEFAULT => 16,
-      :medium => 32,
-      :large => 64
+      SIZE_MEDIUM => 24
     }.freeze
     SIZE_OPTIONS = SIZE_MAPPINGS.keys
 
     # @example Default
-    #   <%= render(Primer::OcticonComponent.new("check")) %>
-    #   <%= render(Primer::OcticonComponent.new(icon: "check")) %>
+    #   <%= render(Primer::OcticonComponent.new(:check)) %>
+    #   <%= render(Primer::OcticonComponent.new(icon: :check)) %>
     #
     # @example Medium
-    #   <%= render(Primer::OcticonComponent.new("people", size: :medium)) %>
+    #   <%= render(Primer::OcticonComponent.new(:people, size: :medium)) %>
     #
-    # @example Large
-    #   <%= render(Primer::OcticonComponent.new("x", size: :large)) %>
+    # @example Helper
+    #   <%= primer_octicon(:check) %>
     #
-    # @param icon [String] Name of <%= link_to_octicons %> to use.
-    # @param size [Symbol] <%= one_of(Primer::OcticonComponent::SIZE_MAPPINGS) %>
+    # @param icon_name [Symbol, String] Name of <%= link_to_octicons %> to use.
+    # @param icon [Symbol, String] Name of <%= link_to_octicons %> to use.
+    # @param size [Symbol] <%= one_of(Primer::OcticonComponent::SIZE_MAPPINGS, sort: false) %>
+    # @param use_symbol [Boolean] EXPERIMENTAL (May change or be removed) - Set to true when using with <%= link_to_component(Primer::OcticonSymbolsComponent) %>.
     # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
-    def initialize(icon_name = nil, icon: nil, size: SIZE_DEFAULT, **system_arguments)
+    def initialize(icon_name = nil, icon: nil, size: SIZE_DEFAULT, use_symbol: false, **system_arguments)
       icon_key = icon_name || icon
-      cache_key = [icon_key, size, system_arguments.slice(:height, :width)].join("_")
+
+      # Don't allow sizes under 16px
+      if system_arguments[:height].present? && system_arguments[:height].to_i < 16 || system_arguments[:width].present? && system_arguments[:width].to_i < 16
+        system_arguments.delete(:height)
+        system_arguments.delete(:width)
+      end
+
+      cache_key = Primer::Octicon::Cache.get_key(symbol: icon_key, size: size, **system_arguments.slice(:height, :width))
 
       @system_arguments = system_arguments
       @system_arguments[:tag] = :svg
       @system_arguments[:aria] ||= {}
+      @use_symbol = use_symbol
 
       if @system_arguments[:aria][:label] || @system_arguments[:"aria-label"]
         @system_arguments[:role] = "img"
@@ -62,10 +74,8 @@ module Primer
       @system_arguments.merge!(@icon.options.except(:class, :'aria-hidden'))
     end
 
-    def call
-      render(Primer::BaseComponent.new(**@system_arguments)) { @icon.path.html_safe } # rubocop:disable Rails/OutputSafety
+    def self._after_compile
+      Primer::Octicon::Cache.preload!
     end
-
-    Primer::Octicon::Cache.preload!
   end
 end

data/app/components/primer/octicon_symbols_component.html.erb

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" hidden>
+  <%= symbol_tags %>
+</svg>

data/app/components/primer/octicon_symbols_component.rb

@@ -0,0 +1,61 @@
+# frozen_string_literal: true
+
+require "octicons"
+
+module Primer
+  # OcticonSymbols renders a symbol dictionary using a list of <%= link_to_octicons %>.
+  class OcticonSymbolsComponent < Primer::Component
+    # @example Symbol dictionary
+    #   <%= render(Primer::OcticonComponent.new(icon: :check, use_symbol: true, color: :icon_success)) %>
+    #   <%= render(Primer::OcticonComponent.new(icon: :check, use_symbol: true, color: :text_danger)) %>
+    #   <%= render(Primer::OcticonComponent.new(icon: :check, use_symbol: true, size: :medium)) %>
+    #   <%= render(Primer::OcticonSymbolsComponent.new(icons: [{ symbol: :check }, { symbol: :check, size: :medium }])) %>
+    #
+    # @param icons [Array<Hash>] List of icons to render, in the format { symbol: :icon_name, size: :small }
+    def initialize(icons: [])
+      @icons = {}
+      icons.each do |icon|
+        symbol = icon[:symbol]
+        size = Primer::OcticonComponent::SIZE_MAPPINGS[
+          fetch_or_fallback(Primer::OcticonComponent::SIZE_OPTIONS, icon[:size] || Primer::OcticonComponent::SIZE_DEFAULT, Primer::OcticonComponent::SIZE_DEFAULT)
+        ]
+
+        cache_key = Primer::Octicon::Cache.get_key(symbol: symbol, size: size)
+
+        if (cache_icon = Primer::Octicon::Cache.read(cache_key))
+          icon_instance = cache_icon
+        else
+          icon_instance = Octicons::Octicon.new(symbol, height: size)
+
+          Primer::Octicon::Cache.set(cache_key, icon_instance)
+        end
+
+        # Don't put the same icon twice
+        @icons[[symbol, icon_instance.height]] = icon_instance if @icons[[symbol, icon_instance.height]].nil?
+      end
+    end
+
+    def render?
+      @icons.any?
+    end
+
+    def self._after_compile
+      Primer::Octicon::Cache.preload!
+    end
+
+    def symbol_tags
+      safe_join(
+        @icons.values.map do |icon|
+          content_tag(
+            :symbol,
+            icon.path.html_safe, # rubocop:disable Rails/OutputSafety
+            id: "octicon_#{icon.symbol}_#{icon.height}",
+            viewBox: icon.options[:viewBox],
+            width: icon.width,
+            height: icon.height
+          )
+        end
+      )
+    end
+  end
+end