codengage_view_components 0.1.3 → 0.1.4

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 8bbb26385e5c3c18b2163c818dd1b297e945fd73caf2dc8cd24e6bc8c4232ec0
-  data.tar.gz: 2b620a3ee177618f11ab02e94e332931259f2c710414b0f9e145a2ca708a7f32
+  metadata.gz: b0ac31396e7187215d096cbe324400e4418e434ff3be16260d590fd9cc8a3fa8
+  data.tar.gz: a18cd53126064cb8b3eec55bd98bf3cf5fdf9ac43e93f06264727b482b395ba5
 SHA512:
-  metadata.gz: 3b7a36a0ce0d50c33c2e457878bb11b94578a7f61c5a6dc727b0096fc02ae8ce23b404ab864399b0f15fcc1abf4b337fbd93ecaee64037ce6575b7af8e8cc238
-  data.tar.gz: 8fe639b200b7535481cbe3088a349004e991309a0ee8f6f7ae8953253fbcfc7a778e96c57c888719b5e1b5d1b597311321a3f97bfd11a3e4f568d3f6b8491cba
+  metadata.gz: 216aba8d113b9c0fdfd1c0a189c60f3ac1fab13f7754adae9b70c9827126cbac42d5d3f4eee4e038893606babad2828da97224b6b3aa04e7a4ff6983e228ec35
+  data.tar.gz: 610f007c96aa00b8765c256303a230531b17eaecb1068f0a2e8ee24563be69bebaa5abfb54306f5a9a44fc455dc54a0649bb60de8dc6fe7d413e230c6d9e0223

data/app/components/codengage_view_components/date_field_component.css

@@ -0,0 +1,3 @@
+.date-field__calendar {
+    @apply absolute inset-y-0 right-0 flex items-center pr-3 pointer-events-none text-gray-500;
+}

data/app/components/codengage_view_components/date_field_component.html.haml

@@ -0,0 +1,5 @@
+.relative.w-full
+  = @form.text_field @attribute, class: "#{@classes} pr-10", placeholder: @placeholder, data: { controller: 'datepicker', **@data_options }
+
+  .form__calendar
+    = lucide_icon('calendar', class: 'w-4 h-4')

data/app/components/codengage_view_components/date_field_component.rb

@@ -0,0 +1,13 @@
+# frozen_string_literal: true
+
+module Form
+  class DateFieldComponent < ApplicationComponent
+    def initialize(form:, classes:, attribute:, placeholder:, **data_options)
+      @form = form
+      @classes = classes
+      @attribute = attribute
+      @placeholder = placeholder
+      @data_options = data_options
+    end
+  end
+end

data/app/components/codengage_view_components/dropdown_component.html.haml

@@ -0,0 +1,10 @@
+%div{id:  "#{@id}_button", type: "button", data: { dropdown_toggle: "#{@id}" }}
+
+  - if trigger.present?
+    = trigger
+
+  .z-10.hidden.bg-neutral-primary-medium.border.border-default-medium.rounded-base.shadow-lg.w-44{id: "#{@id}" }
+    %ul.p-2.text-sm.text-body.font-medium{ aria: { labelledby: "#{@id}_button" } }
+      - if items.any?
+        - items.each do |item|
+          = item

data/app/components/codengage_view_components/dropdown_component.rb

@@ -0,0 +1,13 @@
+# frozen_string_literal: true
+
+module CodengageViewComponents
+  class DropdownComponent < ApplicationComponent
+    renders_one :trigger
+    renders_many :items, "Dropdown::ItemComponent"
+
+    def initialize(id:, options: {})
+      @id = id
+      @options = options
+    end
+  end
+end

data/app/components/codengage_view_components/flash_component.rb

@@ -5,7 +5,7 @@ module CodengageViewComponents
     Message = Struct.new(:type, :text, :bg, :stroke, :icon, keyword_init: true)
 
     STYLES = {
-      "notice" => { bg: "bg-green-700", stroke: "#48BB78", icon: "check" },
+      "notice" => { bg: "bg-white", stroke: "#48BB78", icon: "check" },
       "alert"  => { bg: "bg-red-700",   stroke: "#DC3545", icon: "circle-alert" }
     }.freeze
 

data/app/components/codengage_view_components/item_component.html.haml

@@ -0,0 +1,19 @@
+%li
+  - if delete?
+    = button_to @url,
+      method: :delete,
+      onclick: 'event.stopPropagation()',
+      form: { data: { turbo_confirm: I18n.t('shared.are_you_sure?'), turbo_frame: '_top' } },
+      class: 'inline-flex items-center w-full p-2 hover:bg-neutral-tertiary-medium hover:text-heading rounded cursor-pointer' do
+      .flex.items-center.gap-x-2
+        - if @icon.present?
+          = lucide_icon(@icon, stroke: icon_stroke, size: icon_size)
+        %div{ class: text_class }= @value
+  - else
+    = link_to @url,
+      data: data_attributes,
+      class: 'inline-flex items-center w-full p-2 hover:bg-neutral-tertiary-medium hover:text-heading rounded' do
+      .flex.items-center.gap-x-2
+        - if @icon.present?
+          = lucide_icon(@icon, stroke: icon_stroke, size: icon_size)
+        %div{ class: text_class }= @value

data/app/components/codengage_view_components/item_component.rb

@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+module CodengageViewComponents
+  class ItemComponent < ApplicationComponent
+    def initialize(value:, url:, method: :get, icon: nil, options: {})
+      @value = value
+      @url = url
+      @method = method
+      @icon = icon
+      @options = options
+    end
+
+    def data_attributes
+      @options.fetch(:data, {})
+    end
+
+    def text_class
+      @options.fetch(:text_class, "")
+    end
+
+    def icon_stroke
+      @options.fetch(:icon_stroke, "gray")
+    end
+
+    def icon_size
+      @options.fetch(:icon_size, "")
+    end
+
+    def delete?
+      @method.to_s == "delete"
+    end
+  end
+end

data/app/javascript/controllers/datepicker_controller.js

@@ -0,0 +1,34 @@
+import { Controller } from "@hotwired/stimulus"
+import "flowbite-datepicker"
+
+export default class extends Controller {
+    async connect() {
+        if (!window.Datepicker && typeof Datepicker !== 'undefined') {
+            window.Datepicker = Datepicker
+        }
+        try {
+            await import("flowbite-datepicker-pt-BR")
+        } catch (e) {
+            console.warn("Não foi possível carregar a tradução, usando padrão.")
+        }
+
+        const DP = window.Datepicker
+
+        if (DP) {
+            this.picker = new DP(this.element, {
+                format: 'dd/mm/yyyy',
+                autohide: true,
+                language: 'pt-BR',
+                orientation: 'bottom',
+            })
+
+            this.element.addEventListener('changeDate', () => {
+                this.element.dispatchEvent(new Event('change', { bubbles: true }))
+            })
+        }
+    }
+
+    disconnect() {
+        this.picker?.destroy()
+    }
+}

data/config/importmap.rb

@@ -1 +1,4 @@
-pin_all_from File.expand_path("../app/javascript/controllers", __dir__), under: "controllers"
+pin_all_from File.expand_path("../app/javascript/controllers", __dir__), under: "controllers"
+
+pin "flowbite-datepicker", to: "https://cdn.jsdelivr.net/npm/flowbite-datepicker@1.3.0/dist/js/datepicker-full.js"
+pin "flowbite-datepicker-pt-BR", to: "https://cdn.jsdelivr.net/npm/flowbite-datepicker@1.3.0/dist/js/locales/pt-BR.js"

data/lib/codengage_view_components/version.rb

@@ -1,3 +1,3 @@
 module CodengageViewComponents
-  VERSION = "0.1.3"
+  VERSION = "0.1.4"
 end

metadata

@@ -1,14 +1,13 @@
 --- !ruby/object:Gem::Specification
 name: codengage_view_components
 version: !ruby/object:Gem::Version
-  version: 0.1.3
+  version: 0.1.4
 platform: ruby
 authors:
 - Gabriel Karlinski Baldo
-autorequire:
 bindir: bin
 cert_chain: []
-date: 2026-01-14 00:00:00.000000000 Z
+date: 1980-01-02 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -93,13 +92,21 @@ files:
 - Rakefile
 - app/assets/stylesheets/codengage_view_components/application.css
 - app/components/codengage_view_components/application_component.rb
+- app/components/codengage_view_components/date_field_component.css
+- app/components/codengage_view_components/date_field_component.html.haml
+- app/components/codengage_view_components/date_field_component.rb
+- app/components/codengage_view_components/dropdown_component.html.haml
+- app/components/codengage_view_components/dropdown_component.rb
 - app/components/codengage_view_components/flash_component.css
 - app/components/codengage_view_components/flash_component.html.haml
 - app/components/codengage_view_components/flash_component.rb
+- app/components/codengage_view_components/item_component.html.haml
+- app/components/codengage_view_components/item_component.rb
 - app/controllers/codengage_view_components/application_controller.rb
 - app/controllers/codengage_view_components/pages_controller.rb
 - app/helpers/codengage_view_components/application_helper.rb
 - app/helpers/codengage_view_components/pages_helper.rb
+- app/javascript/controllers/datepicker_controller.js
 - app/javascript/controllers/flash_component_controller.js
 - app/javascript/controllers/index.js
 - app/jobs/codengage_view_components/application_job.rb
@@ -120,7 +127,6 @@ metadata:
   homepage_uri: https://github.com/gabriel-baldo/codengage_view_components
   source_code_uri: https://github.com/gabriel-baldo/codengage_view_components
   changelog_uri: https://github.com/gabriel-baldo/codengage_view_components/blob/main/README.md
-post_install_message:
 rdoc_options: []
 require_paths:
 - lib
@@ -135,8 +141,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.5.22
-signing_key:
+rubygems_version: 3.6.9
 specification_version: 4
 summary: Biblioteca de ViewComponents com Tailwind para projetos Codengage.
 test_files: []