ariadne_view_components 0.0.86.6 → 0.0.86.8

data/app/components/ariadne/form/toggle/component.rb

@@ -10,12 +10,14 @@ module Ariadne
 
         include Ariadne::Behaviors::Tooltipable
 
-        # @param form_url [String] The URL to POST to when the toggle switch is toggled. If `nil`, the toggle switch will not make any requests.
-        # @param csrf_token [String] A CSRF token that will be sent to the server as "authenticity_token" when the toggle switch is toggled. Unused if `src` is `nil`.
+        # @param form_url [String] The URL to submit to when the toggle switch is toggled. If `nil`, the toggle switch will not make any requests.
+        # @param form_method [String] A HTTP method to use.
+        # @param turbo [Boolean] Whether or not to request a turbo stream and render the response as such.
         # @param checked [Boolean] Whether the toggle switch is on or off.
         # @param enabled [Boolean] Whether or not the toggle switch responds to user input.
         option :form_url, default: proc { nil }
         option :form_method, default: proc { :post }
+        option :turbo, default: proc { false }
         option :checked, default: proc { false }
         option :enabled, default: proc { true }
 
@@ -28,10 +30,12 @@ module Ariadne
           end
 
           html_attrs[:data] ||= {}
+          added_controller = html_attrs[:data].delete(:controller) || ""
+          added_action = html_attrs[:data].delete(:action) || ""
           html_attrs[:data] = {
-            controller: "#{stimulus_name} #{html_attrs[:data][:controller]}".rstrip,
+            controller: "#{stimulus_name} #{added_controller}",
             "#{stimulus_name}-target": "toggle",
-            action: "click->#{stimulus_name}#toggle #{html_attrs[:data][:action]}".rstrip,
+            action: "click->#{stimulus_name}#toggle #{added_action}",
           }.merge(html_attrs[:data])
         end
 
@@ -50,6 +54,7 @@ module Ariadne
               "#{stimulus_name}-csrf-token-value": csrf_token,
               "#{stimulus_name}-form-method-value": @form_method,
               "#{stimulus_name}-form-url-value": @form_url,
+              "#{stimulus_name}-turbo-value": @turbo,
             }
             html_attrs[:data] = html_attrs[:data].merge(form_values)
           end

data/app/components/ariadne/form/toggle/component.ts

@@ -8,6 +8,7 @@ export default class ToggleController extends controllerFactory<HTMLInputElement
     formMethod: String,
     formUrl: String,
     csrfToken: String,
+    turbo: Boolean,
   },
 }) {
   connect() {
@@ -104,22 +105,33 @@ export default class ToggleController extends controllerFactory<HTMLInputElement
 
     let response
 
+    const requestHeaders: {[key: string]: string} = {
+      'Requested-With': 'XMLHttpRequest',
+    }
+
+    if (this.turboValue) {
+      requestHeaders['Accept'] = 'text/vnd.turbo-stream.html'
+    }
+
     try {
       response = await fetch(this.formUrlValue, {
         credentials: 'same-origin',
         method: this.formMethodValue,
-        headers: {
-          'Requested-With': 'XMLHttpRequest',
-        },
+        headers: requestHeaders,
         body,
       })
     } catch (error) {
-      throw new Error('A network error occurred, please try again.')
+      throw new Error(`A network error occurred, please try again: ${error.message}`)
     }
 
     if (!response.ok) {
       throw new Error(await response.text())
     }
+
+    const contentType = response.headers.get('Content-Type')
+    if (window.Turbo && this.turbo && contentType?.startsWith('text/vnd.turbo-stream.html')) {
+      window.Turbo.renderStreamMessage(await response.text())
+    }
   }
 
   // the authenticity token is passed into the element and is not generated in js land

data/app/components/ariadne/ui/accordion/component.ts

@@ -13,7 +13,11 @@ export default class Controller extends controllerFactory()({
   connect() {
     // Set the initial state of the accordion
     this.animationDurationValue = 0.15
-    this.openValue ? this.open() : this.close()
+    if (this.openValue) {
+      this.open()
+    } else {
+      this.close()
+    }
   }
 
   // Toggle the 'open' value
@@ -22,7 +26,7 @@ export default class Controller extends controllerFactory()({
   }
 
   // Handle changes in the 'open' value
-  openValueChanged(isOpen, wasOpen) {
+  openValueChanged(isOpen) {
     if (isOpen) {
       this.open()
     } else {
@@ -34,7 +38,9 @@ export default class Controller extends controllerFactory()({
   open() {
     if (this.hasContentTarget) {
       this.revealContent()
-      this.hasIconTarget && this.rotateIcon()
+      if (this.hasIconTarget) {
+        this.rotateIcon()
+      }
       this.openValue = true
     }
   }
@@ -42,7 +48,9 @@ export default class Controller extends controllerFactory()({
   close() {
     if (this.hasContentTarget) {
       this.hideContent()
-      this.hasIconTarget && this.rotateIcon()
+      if (this.hasIconTarget) {
+        this.rotateIcon()
+      }
       this.openValue = false
     }
   }

data/app/components/ariadne/ui/combobox/component.ts

@@ -108,9 +108,8 @@ export default class ComboboxController extends controllerFactory<HTMLDetailsEle
 
     const selectedText = (checkedRadioButton.labels?.item(0) as HTMLLabelElement).textContent
 
-    this.buttonTarget.querySelector(
-      '[data-ariadne-ui-button-target="content"]',
-    ).textContent = `${this.dynamicLabelPrefixValue}${selectedText}`
+    this.buttonTarget.querySelector('[data-ariadne-ui-button-target="content"]').textContent =
+      `${this.dynamicLabelPrefixValue}${selectedText}`
   }
 
   toggle(): void {

data/app/components/ariadne/ui/list/component.ts

@@ -42,7 +42,7 @@ export default class InputFilterController extends controllerFactory()({
     useIntersection(this)
   }
 
-  appear(entry, observer) {
+  appear() {
     this.reset()
   }
 

data/app/components/ariadne/ui/overlay/component.ts

@@ -1,4 +1,4 @@
-import {type Placement, autoUpdate, computePosition, flip, offset, shift, size} from '@floating-ui/dom'
+import {type Placement, autoUpdate, computePosition, flip, offset, shift} from '@floating-ui/dom'
 import {controllerFactory} from '@utils/createController'
 import {useClickOutside, useMutation} from 'stimulus-use'
 

data/app/components/ariadne/ui/time_ago/component.ts

@@ -1,8 +1,6 @@
-
 import '@github/relative-time-element'
 import {controllerFactory} from '@utils/createController'
 
 export default class TimeAgoController extends controllerFactory<HTMLDetailsElement>()({
   targets: {},
-}) {
-}
+}) {}

data/lib/ariadne/view_components/version.rb

@@ -3,6 +3,6 @@
 # :nocov:
 module Ariadne
   module ViewComponents
-    VERSION = "0.0.86.6"
+    VERSION = "0.0.86.8"
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: ariadne_view_components
 version: !ruby/object:Gem::Version
-  version: 0.0.86.6
+  version: 0.0.86.8
 platform: ruby
 authors:
 - Garen J. Torikian
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2024-08-11 00:00:00.000000000 Z
+date: 2024-08-15 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: tailwind_merge