tramway 0.1.4 → 0.1.6

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: eedc7b84e9ad80ba5af66fc619af0aea5f24c17e4512e194a6069036ed00f646
-  data.tar.gz: 3e4ac83ede95f1c90e4346f4723551f224efb8921ce1a8802d4977198623441a
+  metadata.gz: e5d6641dda4dedcf7e4d1a4e0638690e21b5f72fbfdccca6c40fa423eec9e3f8
+  data.tar.gz: c0e4e0955c58b253c5aac6198302b6c11f3393f42d5edfd4fc317dd7b1a7894b
 SHA512:
-  metadata.gz: 43325b31d7a7ca934f39160066dd39653767efd04589e735b1cc2cfaf8ed09c087b9e846816bb97131c11d39e6309d0ef7f9925810159acdb05e3ad77f595aef
-  data.tar.gz: b3da39f4acde834c8897e2ff2853a0c7cfe7cd83d04c0817c30017801010e16d03d5249bb87dd2f98b08b166f1ed594499c71b90fbf1f799b92979363706ab7f
+  metadata.gz: f2b1fd87395239845d1eeb4e901e44063e1487bdd83f226a247746dc1bc4fc555cfba4c8357345486dd31e5f5e8c0b5be59e2831e599a87d9c10632b221ad64e
+  data.tar.gz: eb6e88f325e65e1c49094a197a58419c11c71a5c24f78a5132167798ea4bff644c0a6d98320b073d16cea1b8baa258fa2300583474e95223e0f4ba09e9152327

data/README.md

@@ -17,35 +17,66 @@ Tramway use [Tailwind](https://tailwindcss.com/) by default. All UI helpers impl
 
 ### Navbar
 
-#### tailwind_link_to
+Tramway provides DSL for rendering Tailwind Navgiation bar.
 
-Tramway provides `tailwind_link_to` method, that uses `link_to`
-
-```haml
-= tailwind_link_to "/users/sign_in" do
-  Sign In
+```ruby
+tramway_navbar title: 'Purple Magic', background: { color: :red, intensity: 500 } do |nav|
+  nav.left do
+    nav.item 'Users', '/users'
+    nav.item 'Podcasts', '/podcasts'
+  end
+
+  nav.right do
+    nav.item 'Sign out', '/users/sessions', method: :delete, confirm: 'Wanna quit?'
+  end
+end
 ```
 
-OR
+will render [this](https://play.tailwindcss.com/UZPTCudFw5)
 
-```haml
-= tailwind_link_to 'Sign In', "/users/sign_in"
-```
+#### tramway_navbar
 
-will render [this](https://play.tailwindcss.com/RT3Vvauu78)
+This helper provides several options. Here is YAML view of `tramway_navbar` options structure
 
-```haml
-= tailwind_link_to "/users/sign_out", method: :delete, confirm: 'Wanna quit?' do
-  Sign Out
+```yaml
+title: String that will be added to the left side of the navbar
+background:
+  color: Css-color. Supports all named CSS colors and HEX colors
+  intensity: Color intensity. Range: **100..950**. Used by Tailwind. Not supported in case of using HEX color in the background.color
 ```
 
-OR
+#### nav.left and nav.right
 
-```
-= tailwind_link_to 'Sign Out', "/users/sign_out", method: :delete, confirm: 'Wanna quit?'
-```
+Tramway navbar provides `left` and `right` methods that puts items to left and right part of navbar.
 
-will render [this](https://play.tailwindcss.com/7qPmG4ltEU))
+#### nav.item
+
+Item in navigation is rendered `li a` inside navbar `ul` tag on the left or right sides. `nav.item` uses the same approach as `link_to` method with syntax sugar.
+
+```ruby
+tramway_navbar title: 'Purple Magic' do |nav|
+  nav.left do
+    nav.item 'Users', '/users'
+
+    # NOTE you can achieve the same with
+
+    nav.item '/users' do
+      'Users'
+    end
+
+    # NOTE nav.item supports turbo-method and turbo-confirm attributes
+
+    nav.item 'Delete user', '/users/destroy', method: :delete, confirm: 'Are you sure?'
+    
+    # will render this
+    # <li>
+    #   <a data-turbo-method="delete" data-turbo-confirm="Are you sure?" href="/users/sign_out" class="text-white hover:bg-red-300 px-4 py-2 rounded">
+    #     Sign out
+    #   </a>
+    # </li>
+  end
+end
+```
 
 ## Contributing
 

data/app/components/tailwinds/nav/item_component.html.haml

@@ -0,0 +1,3 @@
+%li
+  = link_to @href, class: @style, **@options do
+    = content

data/app/components/tailwinds/{navbar/button_component.rb → nav/item_component.rb}

@@ -1,10 +1,10 @@
 # frozen_string_literal: true
 
 module Tailwinds
-  module Navbar
+  module Nav
     # Render button styled with Tailwind using button_to or link_to methods
     #
-    class ButtonComponent < TailwindComponent
+    class ItemComponent < TailwindComponent
       def initialize(**options)
         @href = options[:href]
         @style = 'text-white hover:bg-red-300 px-4 py-2 rounded'

data/app/components/tailwinds/navbar_component.html.haml

@@ -0,0 +1,15 @@
+%nav.py-4.px-8.flex.justify-between.items-center{ class: "bg-#{@color}" }
+  - if @title.present? || @left_items.present?
+    .flex
+      - if @title.present?
+        .text-xl.text-white.font-bold
+          = @title
+      - if @left_items.present?
+        %ul.flex.items-center.space-x-4
+          - @left_items.each do |item|
+            = item
+
+  - if @right_items.present?
+    %ul.flex.items-center.space-x-4
+      - @right_items.each do |item|
+        = item

data/app/components/tailwinds/navbar_component.rb

@@ -0,0 +1,36 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  # Navbar class main class
+  #
+  class NavbarComponent < TailwindComponent
+    def initialize(**options)
+      @title = options[:title]
+      @left_items = options[:left_items]
+      @right_items = options[:right_items]
+      @color = background(options)
+    end
+
+    private
+
+    CSS_COLORS = %i[aqua black blue fuchsia gray green lime maroon navy olive orange purple red
+                    silver teal white yellow].freeze
+    MIN_INTENSITY = 100
+    MAX_INTENSITY = 950
+
+    def background(options)
+      color = options.dig(:background, :color) || :purple
+      intensity = options.dig(:background, :intensity) || 700
+
+      unless (MIN_INTENSITY..MAX_INTENSITY).cover?(intensity)
+        raise "Navigation Background Color intensity should be between #{MIN_INTENSITY} and #{MAX_INTENSITY}"
+      end
+
+      if color.in? CSS_COLORS
+        "#{color}-#{intensity}"
+      else
+        "[#{color}]"
+      end
+    end
+  end
+end

data/lib/tramway/engine.rb

@@ -8,9 +8,9 @@ module Tramway
 
     initializer 'tramway.load_helpers' do
       ActiveSupport.on_load(:action_view) do
-        require 'tramway/helpers/tailwind_helpers'
+        require 'tramway/helpers/navbar_helper'
 
-        ActionView::Base.include Tramway::Helpers::TailwindHelpers
+        ActionView::Base.include Tramway::Helpers::NavbarHelper
       end
     end
   end

data/lib/tramway/helpers/navbar_helper.rb

@@ -0,0 +1,24 @@
+# frozen_string_literal: true
+
+require 'tramway/navbar'
+
+module Tramway
+  module Helpers
+    # Providing navbar helpers for ActionView
+    #
+    module NavbarHelper
+      def tramway_navbar(**options)
+        if block_given?
+          @navbar = Tramway::Navbar.new self
+
+          yield @navbar
+
+          options[:left_items] = @navbar.items[:left]
+          options[:right_items] = @navbar.items[:right]
+        end
+
+        render(Tailwinds::NavbarComponent.new(**options))
+      end
+    end
+  end
+end

data/lib/tramway/navbar.rb

@@ -0,0 +1,48 @@
+# frozen_string_literal: true
+
+module Tramway
+  # Navbar class for Tramway navbars
+  #
+  class Navbar
+    attr_reader :items
+
+    def initialize(context)
+      @items = {}
+      @context = context
+    end
+
+    def left
+      return unless block_given?
+
+      @items[:left] = []
+
+      @filling = :left
+
+      yield self
+    end
+
+    def right
+      return unless block_given?
+
+      @items[:right] = []
+
+      @filling = :right
+
+      yield self
+    end
+
+    def item(text_or_url, url = nil, **options, &block)
+      raise 'You can not provide argument and code block in the same time' if url.present? && block_given?
+
+      rendered_item = if url.present?
+                        options.merge! href: url
+                        @context.render(Tailwinds::Nav::ItemComponent.new(**options)) { text_or_url }
+                      else
+                        options.merge! href: text_or_url
+                        @context.render(Tailwinds::Nav::ItemComponent.new(**options), &block)
+                      end
+
+      @items[@filling] << rendered_item
+    end
+  end
+end

data/lib/tramway/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Tramway
-  VERSION = '0.1.4'
+  VERSION = '0.1.6'
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: tramway
 version: !ruby/object:Gem::Version
-  version: 0.1.4
+  version: 0.1.6
 platform: ruby
 authors:
 - kalashnikovisme
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2023-06-15 00:00:00.000000000 Z
+date: 2023-06-22 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: haml-rails
@@ -79,13 +79,16 @@ files:
 - Rakefile
 - app/components/tailwind_component.html.haml
 - app/components/tailwind_component.rb
-- app/components/tailwinds/navbar/button_component.html.haml
-- app/components/tailwinds/navbar/button_component.rb
+- app/components/tailwinds/nav/item_component.html.haml
+- app/components/tailwinds/nav/item_component.rb
+- app/components/tailwinds/navbar_component.html.haml
+- app/components/tailwinds/navbar_component.rb
 - config/routes.rb
 - lib/tasks/tramway_tasks.rake
 - lib/tramway.rb
 - lib/tramway/engine.rb
-- lib/tramway/helpers/tailwind_helpers.rb
+- lib/tramway/helpers/navbar_helper.rb
+- lib/tramway/navbar.rb
 - lib/tramway/version.rb
 homepage: https://github.com/purple-magic/tramway
 licenses:

data/app/components/tailwinds/navbar/button_component.html.haml

@@ -1,2 +0,0 @@
-= link_to @href, class: @style, **@options do
-  = content

data/lib/tramway/helpers/tailwind_helpers.rb

@@ -1,21 +0,0 @@
-# frozen_string_literal: true
-
-module Tramway
-  module Helpers
-    # ActionView helpers for tailwind
-    #
-    module TailwindHelpers
-      def tailwind_link_to(text_or_url, url = nil, **options, &block)
-        raise 'You can not provide argument and code block in the same time' if url.present? && block_given?
-
-        if url.present?
-          options.merge! href: url
-          render(Tailwinds::Navbar::ButtonComponent.new(**options)) { text_or_url }
-        else
-          options.merge! href: text_or_url
-          render(Tailwinds::Navbar::ButtonComponent.new(**options), &block)
-        end
-      end
-    end
-  end
-end