pulse_view_components 0.3.0

data/app/lib/pulse/fetch_or_fallback_helper.rb

@@ -0,0 +1,53 @@
+# frozen_string_literal: true
+
+module Pulse
+  # FetchOrFallbackHelper
+  # A little helper to enable graceful fallbacks
+  # See https://github.com/primer/view_components/blob/main/app/lib/primer/fetch_or_fallback_helper.rb
+  # and https://github.com/baoagency/polaris_view_components/blob/main/app/helpers/polaris/fetch_or_fallback_helper.rb
+  #
+  # Use this helper to quietly ensure a value is
+  # one that you expect:
+  #
+  # allowed_values    - allowed options for *value*
+  # given_value       - input being coerced
+  # fallback          - returned if *given_value* is not included in *allowed_values*
+  #
+  # fetch_or_fallback([1,2,3], 5, 2) => 2
+  # fetch_or_fallback([1,2,3], 1, 2) => 1
+  # fetch_or_fallback([1,2,3], nil, 2) => 2
+  module FetchOrFallbackHelper
+    mattr_accessor :fallback_raises, default: true
+
+    class InvalidValueError < StandardError
+    end
+
+    def fetch_or_fallback(allowed_values, given_value, fallback = nil)
+      if allowed_values.include?(given_value)
+        given_value
+      else
+        if fallback_raises && ENV['RAILS_ENV'] != 'production'
+          raise InvalidValueError, <<~MSG
+            fetch_or_fallback was called with an invalid value.
+
+            Expected one of: #{allowed_values.inspect}
+            Got: #{given_value.inspect}
+
+            This will not raise in production, but will instead fallback to: #{fallback.inspect}
+          MSG
+        end
+
+        fallback
+      end
+    end
+
+    # rubocop:disable-next Style/OptionalBooleanParameter
+    def fetch_or_fallback_boolean(given_value, fallback = false)
+      if [true, false].include?(given_value)
+        given_value
+      else
+        fallback
+      end
+    end
+  end
+end

data/app/lib/pulse/svg_helper.rb

@@ -0,0 +1,28 @@
+# frozen_string_literal: true
+
+module Pulse
+  # Helpers for inline svg
+  module SvgHelper
+    # Render an embedded svg document
+    # @param name [String] any filename present in the asset pipeline search paths
+    # @param options [Hash] any additional options which `inline_svg_tag` accepts
+    # @note Do not include the `.svg` suffix in the filename
+    # @see https://github.com/jamesmartin/inline_svg#options Options documentation
+    def render_svg(name, **options)
+      if options[:title].blank?
+        options[:aria_hidden] ||= true
+        options[:aria] = nil
+      else
+        options[:aria] ||= true
+      end
+      options[:nocomment] ||= true
+      options[:class] = class_names(
+        options[:class],
+        options[:classes]
+      )
+
+      filename = "#{name}.svg"
+      inline_svg_tag(filename, **options)
+    end
+  end
+end

data/lib/pulse/view_components/engine.rb

@@ -0,0 +1,74 @@
+# frozen_string_literal: true
+
+require 'rails/engine'
+require 'view_component'
+# require 'view_component/version'
+
+module Pulse
+  module ViewComponents
+    # :nodoc:
+    class Engine < ::Rails::Engine
+      isolate_namespace Pulse::ViewComponents
+
+      %W(
+        #{root}/app/components
+        #{root}/lib
+      ).each { |path| config.autoload_paths << path }
+
+      # config.eager_load_paths = %W[
+      #   #{root}/app/components
+      #   #{root}/app/forms
+      #   #{root}/app/helpers
+      #   #{root}/app/lib
+      # ]
+      config.eager_load_paths = %W(
+        #{root}/app/components
+        #{root}/app/lib
+      )
+
+      # config.pulse_view_components = ActiveSupport::OrderedOptions.new
+
+      # config.pulse_view_components.raise_on_invalid_options = false
+
+      # initializer 'pulse_view_components.assets' do |app|
+      #   if app.config.respond_to?(:assets)
+      #     app.config.assets.precompile += %w(pulse_view_components)
+      #   end
+      # end
+
+      # initializer 'pulse.eager_load_actions' do
+      #   ActiveSupport.on_load(:after_initialize) do
+      #     if Rails.application.config.eager_load
+      #       # Pulse::Forms::Base.compile!
+      #       # Pulse::Forms::Base.descendants.each(&:compile!)
+      #       # Pulse::Forms::BaseComponent.descendants.each(&:compile!)
+      #       # Pulse::Octicon::Cache.preload!
+      #     end
+      #   end
+      # end
+
+      # Polaris
+
+      # initializer "polaris_view_components.assets" do |app|
+      #   if app.config.respond_to?(:assets)
+      #     app.config.assets.precompile += %w[
+      #       polaris_view_components.js polaris_view_components.css
+      #     ]
+      #   end
+      # end
+
+      # initializer "polaris_view_components.importmap", before: "importmap" do |app|
+      #   if app.config.respond_to?(:importmap) && app.config.importmap.has_key?(:cache_sweepers)
+      #     app.config.importmap.cache_sweepers << Engine.root.join("app/assets/javascripts")
+      #   end
+      # end
+
+      # initializer "polaris_view_components.helpers" do
+      #   ActiveSupport.on_load(:action_controller_base) do
+      #     helper Polaris::ViewHelper
+      #     helper Polaris::UrlHelper
+      #   end
+      # end
+    end
+  end
+end

data/lib/pulse/view_components/version.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+# simplecov:disable
+module Pulse
+  module ViewComponents
+    module VERSION
+      MAJOR = 0
+      MINOR = 3
+      PATCH = 0
+
+      STRING = [MAJOR, MINOR, PATCH].join('.')
+    end
+  end
+end
+
+# rubocop:disable-next Rails/Output
+puts Pulse::ViewComponents::VERSION::STRING if __FILE__ == $PROGRAM_NAME

data/lib/pulse/view_components.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+require 'pulse/view_components/version'
+require 'pulse/view_components/engine'
+
+module Pulse
+  # :nodoc:
+  module ViewComponents
+    # pulse/view_components root directory.
+    def self.root
+      Pathname(File.expand_path(File.join('..', '..'), __dir__))
+    end
+  end
+end

data/lib/pulse_view_components.rb

@@ -0,0 +1,3 @@
+# frozen_string_literal: true
+
+require 'pulse/view_components'

data/lib/tasks/pulse_view_components_tasks.rake

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+namespace :pulse_view_components do
+  # desc "Explaining what the task does"
+  # task :example do
+  #   # Task code here
+  # end
+end

data/previews/pulse/badge_preview.rb

@@ -0,0 +1,51 @@
+# frozen_string_literal: true
+
+module Pulse
+  # @label Badge
+  class BadgePreview < ViewComponent::Preview
+    # @label Playground
+    #
+    # @param tag select {{ Pulse::Badge::TAG_OPTIONS }}
+    # @param scheme select {{ Pulse::Badge::SCHEME_OPTIONS }}
+    # @param variant select {{ Pulse::Badge::VARIANT_OPTIONS }}
+    def default(tag: :span, scheme: :secondary, variant: :standard)
+      render(
+        Pulse::Badge.new(tag:, scheme:, variant:)
+      ) do
+        'Badge'
+      end
+    end
+
+    # @label Primary
+    def color_scheme_primary
+      render(Pulse::Badge.new(scheme: :primary)) { 'Primary' }
+    end
+
+    # @label Secondary
+    def color_scheme_secondary
+      render(Pulse::Badge.new(scheme: :secondary)) { 'Secondary' }
+    end
+
+    # @label Secondary Outline
+    def color_scheme_secondary_outline
+      render(Pulse::Badge.new(scheme: :secondary_outline)) do
+        'Secondary Outline'
+      end
+    end
+
+    # @label Invited
+    def color_scheme_success
+      render(Pulse::Badge.new(scheme: :invited)) { 'Invited' }
+    end
+
+    # @label Active
+    def color_scheme_hidden
+      render(Pulse::Badge.new(scheme: :active)) { 'Active' }
+    end
+
+    # @label Disabled
+    def color_scheme_failure
+      render(Pulse::Badge.new(scheme: :disabled)) { 'Disabled' }
+    end
+  end
+end

data/previews/pulse/blank_slate_preview.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+module Pulse
+  # @label BlankSlate
+  class BlankSlatePreview < ViewComponent::Preview
+    # @label Default options
+    def default
+      render Pulse::BlankSlate.new do |component|
+        component.with_title { 'Title' }
+        component.with_description { 'Description' }
+      end
+    end
+  end
+end

data/previews/pulse/border_box_preview.rb

@@ -0,0 +1,48 @@
+# frozen_string_literal: true
+
+module Pulse
+  # @label BorderBox
+  class BorderBoxPreview < ViewComponent::Preview
+    # @label Default
+    def default
+      render(Pulse::BorderBox.new) do |component|
+        component.with_header { 'Header' }
+        component.with_body { 'Body' }
+        component.with_row { 'Row one' }
+        component.with_row { 'Row two' }
+        component.with_row { 'Row three' }
+        component.with_footer { 'Footer' }
+      end
+    end
+
+    # @label Body only
+    def body_only
+      render(Pulse::BorderBox.new) do |component|
+        component.with_body { 'Body' }
+      end
+    end
+
+    # @label Header with title
+    def header_with_title
+      render(Pulse::BorderBox.new) do |component|
+        component.with_header do |header|
+          header.with_title(tag: :h2) do
+            'Header with title'
+          end
+        end
+        component.with_body { 'Body' }
+        component.with_footer { 'Footer' }
+      end
+    end
+
+    # @label Row colors
+    def row_colors
+      render(Pulse::BorderBox.new) do |component|
+        component.with_row(scheme: :default) { 'Default' }
+        component.with_row(scheme: :neutral) { 'Neutral' }
+        component.with_row(scheme: :info) { 'Info' }
+        component.with_row(scheme: :warning) { 'Warning' }
+      end
+    end
+  end
+end

data/previews/pulse/breadcrumbs_preview.rb

@@ -0,0 +1,13 @@
+# frozen_string_literal: true
+
+module Pulse
+  # :nodoc:
+  class BreadcrumbsPreview < ViewComponent::Preview
+    def default
+      render Pulse::Breadcrumbs.new do |c|
+        c.with_item(href: '/', text: 'Home')
+        c.with_item(text: 'Current Page')
+      end
+    end
+  end
+end

data/previews/pulse/button_preview.rb

@@ -0,0 +1,137 @@
+# frozen_string_literal: true
+
+module Pulse
+  # :nodoc:
+  class ButtonPreview < ViewComponent::Preview
+    # @label Playground
+    # The default is :primary style
+    # @param label text
+    # @param url url
+    # @param scheme select {{ Pulse::Button::SCHEME_OPTIONS }}
+    # @param size select {{ Pulse::Button::SIZE_OPTIONS }}
+    # @param tag [Symbol] select [~, button]
+    # @param button_to [Boolean] select [~, true, false]
+    # @param disabled toggle
+    def playground(
+      label: 'Button',
+      scheme: Pulse::Button::DEFAULT_SCHEME,
+      size: Pulse::Button::DEFAULT_SIZE,
+      url: '#',
+      tag: :button,
+      button_to: false,
+      disabled: false
+    )
+      render(Pulse::Button.new(
+               label:,
+               scheme:,
+               size:,
+               url:,
+               tag:,
+               button_to:,
+               disabled:
+             ))
+    end
+
+    # @label Default
+    # @param label text
+    # @param size select {{ Pulse::Button::SIZE_OPTIONS }}
+    # @param disabled toggle
+    # @param tag select [a, summary, button]
+    def default(
+      label: 'Default',
+      size: Pulse::Button::DEFAULT_SIZE,
+      tag: :button,
+      disabled: false
+    )
+      render(Pulse::Button.new(
+               label:,
+               size:,
+               tag:,
+               disabled:
+             ))
+    end
+
+    # @label Primary
+    # @param label text
+    # @param size select {{ Pulse::Button::SIZE_OPTIONS }}
+    # @param disabled toggle
+    # @param tag select [a, summary, button]
+    def primary(
+      label: 'Primary',
+      size: Pulse::Button::DEFAULT_SIZE,
+      tag: :button,
+      disabled: false
+    )
+      render(Pulse::Button.new(
+               label:,
+               scheme: :primary,
+               size:,
+               tag:,
+               disabled:
+             ))
+    end
+
+    # @label Secondary
+    # @param label text
+    # @param size select {{ Pulse::Button::SIZE_OPTIONS }}
+    # @param disabled toggle
+    # @param tag select [a, summary, button]
+    def secondary(
+      label: 'Secondary',
+      size: Pulse::Button::DEFAULT_SIZE,
+      tag: :button,
+      disabled: false
+    )
+      render(Pulse::Button.new(
+               label:,
+               scheme: :secondary,
+               size:,
+               tag:,
+               disabled:
+             ))
+    end
+
+    # @label Danger
+    # @param label text
+    # @param size select {{ Pulse::Button::SIZE_OPTIONS }}
+    # @param disabled toggle
+    # @param tag select [a, summary, button]
+    def danger(
+      label: 'Danger',
+      size: Pulse::Button::DEFAULT_SIZE,
+      tag: :button,
+      disabled: false
+    )
+      render(Pulse::Button.new(
+               label:,
+               scheme: :danger,
+               size:,
+               tag:,
+               disabled:
+             ))
+    end
+
+    # @label Button To
+    # @param label text
+    # @param url url
+    # @param scheme select {{ Pulse::Button::SCHEME_OPTIONS }}
+    # @param size select {{ Pulse::Button::SIZE_OPTIONS }}
+    # @param disabled toggle
+    def button_to(
+      label: 'Button to',
+      url: '#',
+      scheme: Pulse::Button::DEFAULT_SCHEME,
+      size: Pulse::Button::DEFAULT_SIZE,
+      disabled: false
+    )
+      render(Pulse::Button.new(
+               label:,
+               url:,
+               button_to: true,
+               scheme:,
+               size:,
+               disabled:
+             ))
+    end
+  end
+end

data/previews/pulse/counter_preview.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+module Pulse
+  # @label Counter
+  class CounterPreview < ViewComponent::Preview
+    # @label Playground
+    #
+    # @param count number
+    # @param scheme select {{ Pulse::Counter::SCHEME_OPTIONS }}
+    def playground(count: 10, scheme: :default)
+      render Pulse::Counter.new(count:, scheme:)
+    end
+  end
+end

data/previews/pulse/flash_preview.rb

@@ -0,0 +1,85 @@
+# frozen_string_literal: true
+
+module Pulse
+  # @label Flash
+  class FlashPreview < ViewComponent::Preview
+    # @label Playground
+    #
+    # # @param full toggle
+    # # @param spacious toggle
+    # # @param dismissible toggle
+    # @param icon [Symbol] select [alert, check, info, people]
+    # @param scheme [Symbol] select [default, warning, danger, success]
+    # @param content text
+    def playground(full: false, spacious: false, dismissible: false,
+                   icon: :people, scheme: Pulse::Flash::DEFAULT_SCHEME,
+                   content: 'This is a flash message!')
+      render(Pulse::Flash.new(full:, spacious:,
+                              dismissible:, icon:,
+                              scheme:)) do
+        content
+      end
+    end
+
+    # @label Default
+    #
+    def default
+      render(Pulse::Flash.new) { 'This is a flash message!' }
+    end
+
+    # @!group Color Schemes
+    #
+    # @label Default
+    def color_scheme_default
+      render(Pulse::Flash.new) { 'This is a flash message!' }
+    end
+
+    # @label Warning
+    def color_scheme_warning
+      render(Pulse::Flash.new(scheme: :warning)) do
+        'This is a warning flash message!'
+      end
+    end
+
+    # @label Danger
+    def color_scheme_danger
+      render(Pulse::Flash.new(scheme: :danger)) do
+        'This is a danger flash message!'
+      end
+    end
+
+    # @label Success
+    def color_scheme_success
+      render(Pulse::Flash.new(scheme: :success)) do
+        'This is a success flash message!'
+      end
+    end
+    #
+    # @!endgroup
+
+    # @!group More options
+    #
+    # @label Full width
+    # def options_full
+    #   render(Pulse::Flash.new(full: true)) do
+    #     'This is a full width flash message!'
+    #   end
+    # end
+
+    # @label Dismissible
+    # def options_dismissible
+    #   render(Pulse::Flash.new(dismissible: true)) do
+    #     'This is a dismissible flash message!'
+    #   end
+    # end
+
+    # @label With icon
+    def options_with_icon
+      render(Pulse::Flash.new(icon: :alert)) do
+        'This is a flash message with an icon!'
+      end
+    end
+    #
+    # @!endgroup
+  end
+end

data/previews/pulse/icon_preview.rb

@@ -0,0 +1,12 @@
+# frozen_string_literal: true
+
+module Pulse
+  # :nodoc:
+  class IconPreview < ViewComponent::Preview
+    # @label Playground
+    # @param icon [Symbol] select [alert, bookmark-slash, bookmark, check, close, dots-outline, gear, info, issue, mark-github, mark-jira, people, ruby, sort_asc, sort_desc, three-bars]
+    def playground(icon: :info)
+      render(Pulse::Icon.new(icon:))
+    end
+  end
+end

data/previews/pulse/label_preview.rb

@@ -0,0 +1,10 @@
+# frozen_string_literal: true
+
+module Pulse
+  # :nodoc:
+  class LabelPreview < ViewComponent::Preview
+    def default
+      render(Pulse::Label.new(title: 'A label'))
+    end
+  end
+end

data/previews/pulse/layout_preview.rb

@@ -0,0 +1,34 @@
+# frozen_string_literal: true
+
+module Pulse
+  # @label Layout
+  class LayoutPreview < ViewComponent::Preview
+    # @label Playground
+    # @param first_in_source [Symbol] select [sidebar, main]
+    # @param gutter [Symbol] select [default, none, condensed, spacious]
+    def playground(first_in_source: :sidebar, gutter: :default)
+      render(
+        Pulse::Layout.new(gutter:, first_in_source:)
+      ) do |component|
+        component.with_main(classes: 'pulse-bg-blue-50') do
+          'Main content'
+        end
+        component.with_sidebar(classes: 'pulse-bg-gray-50') do
+          'Sidebar content'
+        end
+      end
+    end
+
+    # @label Default
+    def default
+      render(Pulse::Layout.new) do |component|
+        component.with_main(classes: 'pulse-bg-blue-50') do
+          'Main content'
+        end
+        component.with_sidebar(classes: 'pulse-bg-gray-50') do
+          'Sidebar content'
+        end
+      end
+    end
+  end
+end

data/previews/pulse/link_preview.rb

@@ -0,0 +1,55 @@
+# frozen_string_literal: true
+
+module Pulse
+  # :nodoc:
+  class LinkPreview < ViewComponent::Preview
+    # @label Playground
+    # @param href url
+    # @param content text
+    # @param scheme select {{ Pulse::Link::SCHEME_MAPPINGS.keys }}
+    # @param bold toggle
+    # @param underline toggle
+    # @param condition toggle
+    # @param classes text
+    def playground(href: 'https://example.com', content: 'Link text',
+                   scheme: Pulse::Link::DEFAULT_SCHEME,
+                   bold: false, underline: true, condition: true, classes: '')
+      render(
+        Pulse::Link.new(href:, scheme:, bold:,
+                        underline:, condition:,
+                        classes:)
+      ) do
+        content
+      end
+    end
+
+    # @label Default options
+    def default
+      render(Pulse::Link.new(href: 'https://example.com')) do
+        'Link text'
+      end
+    end
+
+    # @label Leading visual
+    # @param href url
+    # @param content text
+    # @param scheme select {{ Pulse::Link::SCHEME_MAPPINGS.keys }}
+    # @param bold toggle
+    # @param underline toggle
+    # @param classes text
+    # @param icon text
+    def leading_visual(href: 'https://example.com', content: 'Link text',
+                       scheme: Pulse::Link::DEFAULT_SCHEME,
+                       bold: false, underline: false, condition: true,
+                       icon: 'gear', classes: '')
+      render(
+        Pulse::Link.new(href:, scheme:, bold:,
+                        underline:, condition:,
+                        classes:)
+      ) do |c|
+        c.with_leading_visual_icon(icon:)
+        content
+      end
+    end
+  end
+end