rails_accordion 0.1.10.pre.beta → 0.1.11.pre.beta

data/app/assets/stylesheets/rails_accordion.css

@@ -0,0 +1,11 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+.accordion_content {
+    @apply h-0 overflow-hidden w-full transition-all duration-300
+}
+
+.accordion_toggle {
+    @apply cursor-pointer;
+}

data/app/components/accordion_component.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+class AccordionComponent < ViewComponent::Base
+  def initialize(**args)
+    super
+    @args = args.presence || {}
+    set_controller
+  end
+
+  def call
+    content_tag(:div, content, **@args)
+  end
+
+  private
+
+  def set_controller
+    @args[:data] ||= {}
+    @args[:data][:controller] = [@args[:data][:controller], "accordion"].compact.join(" ")
+  end
+end

data/app/components/item_component.rb

@@ -0,0 +1,38 @@
+# frozen_string_literal: true
+
+class ItemComponent < ViewComponent::Base
+  renders_one :body
+  renders_one :header
+
+  def initialize(**args)
+    super
+    @args = args.presence || {}
+    set_classes
+  end
+
+  def call
+    content_tag :div, **@args do
+      header_component + body_component
+    end
+  end
+
+  private
+
+  def header_component
+    content_tag :div, header, class: "accordion_toggle"
+  end
+
+  def body_component
+    if body?
+      content_tag :div, class: "accordion_content" do
+        content_tag :div, body, class: "accordion_content-container p-2"
+      end
+    else
+      content_tag(:div, nil, class: "hidden")
+    end
+  end
+
+  def set_classes
+    @args[:class] = [@args[:class], "accordion_item"].compact.join(" ")
+  end
+end

data/app/javascript/controllers/accordion_controller.js

@@ -0,0 +1,43 @@
+import { Controller } from "@hotwired/stimulus";
+
+export default class extends Controller {
+  connect() {
+    this.initAccordion();
+  }
+
+  initAccordion() {
+    const items = this.element.querySelectorAll('.accordion_item');
+
+    items.forEach((item) => {
+      const toggle = item.querySelector('.accordion_toggle');
+
+      toggle.addEventListener('click', (e) => {
+        if (item.classList.contains('active')) {
+          this.hide(item);
+        } else {
+          this.hideAll(items);
+          this.open(item);
+        }
+      });
+    });
+  }
+
+  hideAll(items) {
+    items.forEach((item) => this.hide(item));
+  }
+
+  hide(item) {
+    item.classList.remove("active")
+    const content = item.querySelector('.accordion_content');
+    content.style.height = '0px';
+  }
+
+  open(item) {
+    item.classList.add("active")
+    const content = item.querySelector('.accordion_content');
+    content.style.height = 'auto';
+    const contentHeight = content.style.height
+    // content.style.height = '0px';
+    content.animate({ height: contentHeight + 'px' }, 50);
+  }
+}

data/app/javascript/rails_accordion.js

@@ -0,0 +1,11 @@
+import 'mapkick/bundle'
+import AccordionController from './controllers/accordion_controller'
+import { Application } from '@hotwired/stimulus'
+
+const application = Application.start()
+
+window.Stimulus = application
+
+application.register('accordion', AccordionController)
+
+export { application }

data/bin/console

@@ -0,0 +1,15 @@
+#!/usr/bin/env ruby
+# frozen_string_literal: true
+
+require "bundler/setup"
+require "rails_accordion"
+
+# You can add fixtures and/or initialization code here to make experimenting
+# with your gem easier. You can also use a different console, if you like.
+
+# (If you use this, don't forget to add pry to your Gemfile!)
+# require "pry"
+# Pry.start
+
+require "irb"
+IRB.start(__FILE__)

data/bin/rails

@@ -0,0 +1,13 @@
+#!/usr/bin/env ruby
+# This command will automatically be run when you run "rails" with Rails gems
+# installed from the root of your application.
+
+ENGINE_ROOT = File.expand_path('..', __dir__)
+# ENGINE_PATH = File.expand_path('../lib/rails_table/engine', __dir__)
+
+# Set up gems listed in the Gemfile.
+ENV['BUNDLE_GEMFILE'] ||= File.expand_path('../Gemfile', __dir__)
+require 'bundler/setup' if File.exist?(ENV['BUNDLE_GEMFILE'])
+
+require 'rails/all'
+require 'rails/engine/commands'

data/bin/setup

@@ -0,0 +1,8 @@
+#!/usr/bin/env bash
+set -euo pipefail
+IFS=$'\n\t'
+set -vx
+
+bundle install
+
+# Do any other automated setup that you need to do here

data/lib/generators/rails_accordion/install_generator.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+require "rails/generators"
+
+module RailsAccordion
+  module Generators
+    class InstallGenerator < Rails::Generators::Base
+      source_root File.expand_path("templates", __dir__)
+
+      namespace "rails_accordion:install"
+      desc "Copies all necessary files"
+
+      def copy_build_files
+        # directory File.join(__dir__, "../", "../", "../", "app", "assets", "builds"), "app/assets/builds"
+      end
+    end
+  end
+end

data/lib/generators/rails_accordion/templates/accordion_controller.js.tt

@@ -0,0 +1,38 @@
+import { Controller } from "@hotwired/stimulus"
+
+export default class extends Controller {
+  connect() {
+    this.initAccordion();
+  }
+
+  initAccordion() {
+    const $toggles = $(this.element).find('.accordion_toggle');
+
+    const removeAllActiveClass = () => {
+      $toggles.each((el) => {
+        const $parent = $(el).parent();
+        $parent.removeClass('active');
+        $parent.find('.accordion_content').height(0);
+      });
+    };
+
+    $toggles.on('touch click', (e) => {
+      const $toggle = $(e.currentTarget);
+      const $parent = $toggle.parent();
+      const $content = $parent.find('.accordion_content');
+
+      if (!$parent.hasClass('active')) {
+        removeAllActiveClass();
+        $parent.addClass('active');
+        $content.height('100%');
+      } else {
+        $parent.removeClass('active');
+        $content.css({ height: '0px' });
+      }
+    });
+  }
+
+  afterReflex() {
+    this.initAccordion();
+  }
+}

data/lib/rails_accordion/version.rb

@@ -0,0 +1,5 @@
+# frozen_string_literal: true
+
+module RailsAccordion
+  VERSION = "0.1.11-beta"
+end

data/lib/rails_accordion.rb

@@ -0,0 +1,37 @@
+# frozen_string_literal: true
+
+require "zeitwerk"
+
+loader = Zeitwerk::Loader.for_gem
+loader.ignore("#{__dir__}/generators")
+loader.setup
+
+module RailsAccordion
+
+  class Error < StandardError; end
+
+  class Engine < ::Rails::Engine
+    initializer "rails_accordion.importmap" do |app|
+      if defined?(Importmap)
+        app.config.assets.precompile << "rails_accordion.js"
+        app.config.assets.precompile << "rails_accordion.css"
+      end
+    end
+  end
+
+  class Railtie < Rails::Railtie
+    ActiveSupport.on_load :action_view do
+      include RailsAccordion
+    end
+  end
+
+  def accordion(**args, &block)
+    render AccordionComponent.new(**args), &block
+  end
+
+  def accordion_item(**args, &block)
+    render ItemComponent.new(**args), &block
+  end
+end
+
+loader.eager_load

data/lib/tasks/rails_accordion_tasks.rake

@@ -0,0 +1,4 @@
+# desc "Explaining what the task does"
+# task :rails_table do
+#   # Task goes here
+# end

data/rails_accordion.gemspec

@@ -0,0 +1,26 @@
+# frozen_string_literal: true
+
+require_relative "lib/rails_accordion/version"
+
+Gem::Specification.new do |spec|
+  spec.name = "rails_accordion"
+  spec.version = RailsAccordion::VERSION
+  spec.authors = ["Ahmadshoh Nasrullozoda"]
+  spec.email = ["tajbrains@gmail.com"]
+
+  spec.summary = "rails_accordion is in development."
+  spec.description = "rails_accordion is in development."
+  spec.homepage = "https://tajbrains.com"
+  spec.license = "MIT"
+  spec.required_ruby_version = ">= 2.6.0"
+
+  spec.metadata["homepage_uri"] = spec.homepage
+  spec.metadata["source_code_uri"] = "https://github.com/Tajbrains/rails_accordion"
+  spec.metadata["changelog_uri"] = "https://github.com/Tajbrains/rails_accordion/blob/master/CHANGELOG.md"
+
+  spec.files = Dir["{bin,app,lib,vendor}/**/*", "MIT-LICENSE", "Rakefile", "README.md", "rails_accordion.gemspec", "Gemfile", "Gemfile.lock"]
+
+  spec.add_dependency "stimulus-rails", "~> 1.2"
+  spec.add_dependency "view_component", "~> 2.52"
+  spec.add_dependency "zeitwerk", "~> 2.6"
+end