lightning_ui_kit 0.3.3 → 0.3.5

data/app/components/lightning_ui_kit/tabs_component.rb

@@ -0,0 +1,65 @@
+class LightningUiKit::TabsComponent < LightningUiKit::BaseComponent
+  renders_many :tabs, LightningUiKit::Tabs::TabComponent
+
+  VARIANTS = %i[default line].freeze
+
+  def initialize(default_tab: 0, variant: :default, **options)
+    @default_tab = default_tab
+    @variant = VARIANTS.include?(variant) ? variant : :default
+    @options = options
+  end
+
+  def classes
+    merge_classes([
+      "lui:flex lui:flex-col lui:gap-2 lui:w-full",
+      @options[:class]
+    ].compact.join(" "))
+  end
+
+  def data
+    {
+      controller: "lui-tabs",
+      lui_tabs_default_tab_value: @default_tab
+    }.merge(@options[:data] || {})
+  end
+
+  def list_classes
+    base = "lui:inline-flex lui:w-fit lui:items-center lui:justify-center lui:text-foreground-muted"
+    case @variant
+    when :line
+      "#{base} lui:gap-1 lui:rounded-none lui:bg-transparent"
+    else
+      "#{base} lui:h-9 lui:rounded-lg lui:bg-surface-tertiary lui:p-[3px]"
+    end
+  end
+
+  def tab_classes
+    base = "lui:relative lui:inline-flex lui:items-center lui:justify-center lui:gap-1.5 lui:rounded-md lui:px-3 lui:py-1 lui:text-sm lui:font-medium lui:whitespace-nowrap lui:cursor-pointer " \
+           "lui:transition-all lui:duration-150 " \
+           "lui:text-foreground-muted lui:hover:text-foreground " \
+           "lui:focus:outline-hidden lui:focus-visible:outline lui:focus-visible:outline-2 lui:focus-visible:outline-offset-[-2px] lui:focus-visible:outline-focus " \
+           "lui:disabled:pointer-events-none lui:disabled:opacity-50"
+
+    case @variant
+    when :line
+      "#{base} lui:bg-transparent lui:data-[active]:bg-transparent " \
+      "lui:data-[active]:text-foreground " \
+      "lui:after:absolute lui:after:inset-x-0 lui:after:bottom-[-5px] lui:after:h-0.5 lui:after:bg-foreground lui:after:opacity-0 lui:after:transition-opacity lui:data-[active]:after:opacity-100"
+    else
+      "#{base} lui:h-[calc(100%-1px)] lui:border lui:border-transparent " \
+      "lui:data-[active]:bg-surface lui:data-[active]:text-foreground lui:data-[active]:border-border lui:data-[active]:shadow-sm"
+    end
+  end
+
+  def line_variant?
+    @variant == :line
+  end
+
+  def tab_id(index)
+    "tab-#{object_id}-#{index}"
+  end
+
+  def panel_id(index)
+    "panel-#{object_id}-#{index}"
+  end
+end

data/app/javascript/lightning_ui_kit/controllers/radio_group_controller.js

@@ -0,0 +1,74 @@
+import { Controller } from "@hotwired/stimulus";
+
+export default class extends Controller {
+  static targets = ["field", "option"];
+
+  select(event) {
+    const option = event.currentTarget;
+    if (option.dataset.disabled !== undefined) return;
+
+    this.activate(option);
+  }
+
+  keydown(event) {
+    const currentIndex = this.optionTargets.indexOf(event.currentTarget);
+    let newIndex;
+
+    switch (event.key) {
+      case "ArrowDown":
+      case "ArrowRight":
+        event.preventDefault();
+        newIndex = this.nextEnabledIndex(currentIndex, 1);
+        break;
+      case "ArrowUp":
+      case "ArrowLeft":
+        event.preventDefault();
+        newIndex = this.nextEnabledIndex(currentIndex, -1);
+        break;
+      case " ":
+      case "Enter":
+        event.preventDefault();
+        this.activate(event.currentTarget);
+        return;
+      default:
+        return;
+    }
+
+    if (newIndex !== -1) {
+      this.activate(this.optionTargets[newIndex]);
+      this.optionTargets[newIndex].focus();
+    }
+  }
+
+  activate(option) {
+    const value = option.dataset.value;
+
+    this.optionTargets.forEach((opt) => {
+      if (opt === option) {
+        opt.dataset.checked = "";
+        opt.setAttribute("aria-checked", "true");
+        opt.setAttribute("tabindex", "0");
+      } else {
+        delete opt.dataset.checked;
+        opt.setAttribute("aria-checked", "false");
+        opt.setAttribute("tabindex", "-1");
+      }
+    });
+
+    this.fieldTarget.value = value;
+  }
+
+  nextEnabledIndex(currentIndex, direction) {
+    const length = this.optionTargets.length;
+    let index = currentIndex;
+
+    for (let i = 0; i < length; i++) {
+      index = (index + direction + length) % length;
+      if (this.optionTargets[index].dataset.disabled === undefined) {
+        return index;
+      }
+    }
+
+    return -1;
+  }
+}

data/app/javascript/lightning_ui_kit/controllers/tabs_controller.js

@@ -0,0 +1,77 @@
+import { Controller } from "@hotwired/stimulus";
+
+export default class extends Controller {
+  static targets = ["tab", "panel"];
+  static values = {
+    defaultTab: { type: Number, default: 0 }
+  };
+
+  connect() {
+    this.activate(this.defaultTabValue);
+  }
+
+  select(event) {
+    event.preventDefault();
+    const index = this.tabTargets.indexOf(event.currentTarget);
+    if (index !== -1) {
+      this.activate(index);
+    }
+  }
+
+  activate(index) {
+    this.tabTargets.forEach((tab, i) => {
+      if (i === index) {
+        tab.dataset.active = "";
+        tab.setAttribute("aria-selected", "true");
+        tab.setAttribute("tabindex", "0");
+      } else {
+        delete tab.dataset.active;
+        tab.setAttribute("aria-selected", "false");
+        tab.setAttribute("tabindex", "-1");
+      }
+    });
+
+    this.panelTargets.forEach((panel, i) => {
+      if (i === index) {
+        panel.classList.remove("lui:hidden");
+      } else {
+        panel.classList.add("lui:hidden");
+      }
+    });
+  }
+
+  tabTargetConnected() {
+    this.tabTargets.forEach((tab) => {
+      tab.addEventListener("keydown", this.handleKeydown.bind(this));
+    });
+  }
+
+  handleKeydown(event) {
+    const currentIndex = this.tabTargets.indexOf(event.currentTarget);
+    let newIndex;
+
+    switch (event.key) {
+      case "ArrowLeft":
+        event.preventDefault();
+        newIndex = currentIndex === 0 ? this.tabTargets.length - 1 : currentIndex - 1;
+        break;
+      case "ArrowRight":
+        event.preventDefault();
+        newIndex = currentIndex === this.tabTargets.length - 1 ? 0 : currentIndex + 1;
+        break;
+      case "Home":
+        event.preventDefault();
+        newIndex = 0;
+        break;
+      case "End":
+        event.preventDefault();
+        newIndex = this.tabTargets.length - 1;
+        break;
+      default:
+        return;
+    }
+
+    this.activate(newIndex);
+    this.tabTargets[newIndex].focus();
+  }
+}

data/app/javascript/lightning_ui_kit/index.js

@@ -10,7 +10,7 @@ window.Stimulus = application
 
 import ClipboardController from './controllers/clipboard_controller'
 import CheckboxController from './controllers/checkbox_controller'
-import BannerController from './controllers/banner_controller'
+import AlertController from './controllers/alert_controller'
 import LayoutController from './controllers/layout_controller'
 import MainController from './controllers/main_controller'
 import AccordionController from './controllers/accordion_controller'
@@ -23,11 +23,13 @@ import ToastController from './controllers/toast_controller'
 import TooltipController from './controllers/tooltip_controller'
 import ComboboxController from './controllers/combobox_controller'
 import FieldController from './controllers/field_controller'
+import TabsController from './controllers/tabs_controller'
+import RadioGroupController from './controllers/radio_group_controller'
 
 export function registerLuiControllers(application) {
   application.register(`${namespace}-clipboard`, ClipboardController)
   application.register(`${namespace}-checkbox`, CheckboxController)
-  application.register(`${namespace}-banner`, BannerController)
+  application.register(`${namespace}-alert`, AlertController)
   application.register(`${namespace}-layout`, LayoutController)
   application.register(`${namespace}-main`, MainController)
   application.register(`${namespace}-accordion`, AccordionController)
@@ -40,6 +42,8 @@ export function registerLuiControllers(application) {
   application.register(`${namespace}-tooltip`, TooltipController)
   application.register(`${namespace}-combobox`, ComboboxController)
   application.register(`${namespace}-field`, FieldController)
+  application.register(`${namespace}-tabs`, TabsController)
+  application.register(`${namespace}-radio-group`, RadioGroupController)
 }
 registerLuiControllers(application)
 

data/lib/lightning_ui_kit/builder.rb

@@ -4,6 +4,10 @@ module LightningUiKit
       @view_context = view_context
     end
 
+    def accordion(*, **, &block)
+      render(AccordionComponent.new(*, **), &block)
+    end
+
     def alert(*, **, &block)
       render(AlertComponent.new(*, **), &block)
     end
@@ -16,14 +20,14 @@ module LightningUiKit
       render(BadgeComponent.new(*, **), &block)
     end
 
-    def banner(*, **, &block)
-      render(BannerComponent.new(*, **), &block)
-    end
-
     def button(*, **, &block)
       render(ButtonComponent.new(*, **), &block)
     end
 
+    def card(*, **, &block)
+      render(CardComponent.new(*, **), &block)
+    end
+
     def checkbox(*, **, &block)
       render(CheckboxComponent.new(*, **), &block)
     end
@@ -68,12 +72,12 @@ module LightningUiKit
       render(PaginationComponent.new(*, **), &block)
     end
 
-    def select(*, **, &block)
-      render(SelectComponent.new(*, **), &block)
+    def radio_group(*, **, &block)
+      render(RadioGroupComponent.new(*, **), &block)
     end
 
-    def sidebar(*, **, &block)
-      render(SidebarComponent.new(*, **), &block)
+    def select(*, **, &block)
+      render(SelectComponent.new(*, **), &block)
     end
 
     def sidebar_link(*, **, &block)
@@ -100,6 +104,10 @@ module LightningUiKit
       render(TableComponent.new(*, **), &block)
     end
 
+    def tabs(*, **, &block)
+      render(TabsComponent.new(*, **), &block)
+    end
+
     def text(*, **, &block)
       render(TextComponent.new(*, **), &block)
     end

data/lib/lightning_ui_kit/version.rb

@@ -1,3 +1,3 @@
 module LightningUiKit
-  VERSION = "0.3.3"
+  VERSION = "0.3.5"
 end

data/vendor/bundle/ruby/3.4.0/bin/minitest

@@ -0,0 +1,29 @@
+#!/usr/bin/env ruby
+#
+# This file was generated by RubyGems.
+#
+# The application 'minitest' is installed as part of a gem, and
+# this file is here to facilitate running it.
+#
+
+require 'rubygems'
+
+Gem.use_gemdeps
+
+version = ">= 0.a"
+
+str = ARGV.first
+if str
+  str = str.b[/\A_(.*)_\z/, 1]
+  if str and Gem::Version.correct?(str)
+    version = str
+    ARGV.shift
+  end
+end
+
+if Gem.respond_to?(:activate_bin_path)
+load Gem.activate_bin_path('minitest', 'minitest', version)
+else
+gem "minitest", version
+load Gem.bin_path("minitest", "minitest", version)
+end

data/vendor/bundle/ruby/3.4.0/extensions/x86_64-linux/3.4.0/bigdecimal-4.1.2/gem_make.out

@@ -0,0 +1,39 @@
+current directory: /home/runner/work/lightning_ui_kit/lightning_ui_kit/vendor/bundle/ruby/3.4.0/gems/bigdecimal-4.1.2/ext/bigdecimal
+/opt/hostedtoolcache/Ruby/3.4.9/x64/bin/ruby extconf.rb
+checking for __builtin_clz()... yes
+checking for __builtin_clzl()... yes
+checking for __builtin_clzll()... yes
+checking for float.h... yes
+checking for math.h... yes
+checking for stdbool.h... yes
+checking for stdlib.h... yes
+checking for x86intrin.h... yes
+checking for _lzcnt_u32() in x86intrin.h... no
+checking for _lzcnt_u64() in x86intrin.h... no
+checking for intrin.h... no
+checking for ruby/atomic.h... yes
+checking for ruby/internal/has/builtin.h... yes
+checking for ruby/internal/static_assert.h... yes
+checking for rb_complex_real() in ruby.h... yes
+checking for rb_complex_imag() in ruby.h... yes
+checking for rb_opts_exception_p() in ruby.h... yes
+checking for rb_category_warn() in ruby.h... yes
+checking for RB_WARN_CATEGORY_DEPRECATED in ruby.h... yes
+checking for RUBY_TYPED_EMBEDDABLE in ruby.h... yes
+creating Makefile
+
+current directory: /home/runner/work/lightning_ui_kit/lightning_ui_kit/vendor/bundle/ruby/3.4.0/gems/bigdecimal-4.1.2/ext/bigdecimal
+make DESTDIR\= sitearchdir\=./.gem.20260501-2379-pyp01y sitelibdir\=./.gem.20260501-2379-pyp01y clean
+
+current directory: /home/runner/work/lightning_ui_kit/lightning_ui_kit/vendor/bundle/ruby/3.4.0/gems/bigdecimal-4.1.2/ext/bigdecimal
+make DESTDIR\= sitearchdir\=./.gem.20260501-2379-pyp01y sitelibdir\=./.gem.20260501-2379-pyp01y
+compiling bigdecimal.c
+compiling missing.c
+linking shared-object bigdecimal.so
+
+current directory: /home/runner/work/lightning_ui_kit/lightning_ui_kit/vendor/bundle/ruby/3.4.0/gems/bigdecimal-4.1.2/ext/bigdecimal
+make DESTDIR\= sitearchdir\=./.gem.20260501-2379-pyp01y sitelibdir\=./.gem.20260501-2379-pyp01y install
+/usr/bin/install -c -m 0755 bigdecimal.so ./.gem.20260501-2379-pyp01y
+
+current directory: /home/runner/work/lightning_ui_kit/lightning_ui_kit/vendor/bundle/ruby/3.4.0/gems/bigdecimal-4.1.2/ext/bigdecimal
+make DESTDIR\= sitearchdir\=./.gem.20260501-2379-pyp01y sitelibdir\=./.gem.20260501-2379-pyp01y clean