turbo_boost-elements 0.0.10 → 0.0.11

Sign up to get free protection for your applications and to get access to all the features.
@@ -44,10 +44,9 @@ function focusTrixEditorElement (element) {
44
44
  }
45
45
 
46
46
  function shouldEnhanceFocus (element) {
47
- return (
48
- element.closest('turbo-boost-toggle-target') &&
49
- element.tagName.match(/^input|textarea|trix-editor$/i)
50
- )
47
+ if (!element.tagName.match(/^input|textarea|trix-editor$/i)) return false
48
+ const toggleTargetElement = element.closest('turbo-boost-toggle-target')
49
+ return toggleTargetElement && toggleTargetElement.focusSelector
51
50
  }
52
51
 
53
52
  function enhanceFocus (element) {
@@ -91,11 +91,8 @@ export default class ToggleTargetElement extends ToggleElement {
91
91
  )
92
92
  }
93
93
 
94
- focus () {
95
- clearTimeout(this.focusTimeout)
96
- this.focusTimeout = setTimeout(() => {
97
- if (this.focusElement) this.focusElement.focus()
98
- }, 50)
94
+ applyFocus () {
95
+ if (this.focusElement) this.focusElement.focus()
99
96
  }
100
97
 
101
98
  get focusSelector () {
@@ -110,12 +107,7 @@ export default class ToggleTargetElement extends ToggleElement {
110
107
  }
111
108
 
112
109
  get triggerElement () {
113
- return (
114
- document.getElementById(this.labeledBy) ||
115
- document.querySelector(
116
- `turbo-boost-toggle-trigger[aria-controls="${this.id}"]`
117
- )
118
- )
110
+ return document.getElementById(this.labeledBy)
119
111
  }
120
112
 
121
113
  get labeledBy () {
@@ -85,13 +85,13 @@ export default class ToggleTriggerElement extends ToggleElement {
85
85
  this.busy = false
86
86
  this.targetElement.busy = false
87
87
  this.morphToggleElements.forEach(el => (el.busy = false))
88
- this.expanded = !this.expanded
89
88
  }, delay - 10)
90
89
 
91
90
  // runs after the morph is executed
92
91
  setTimeout(() => {
93
- if (this.expanded) this.targetElement.focus()
94
- }, delay + 10)
92
+ this.targetElement.setAttribute('aria-labeledby', this.id)
93
+ this.targetElement.applyFocus()
94
+ }, delay + 100)
95
95
  }
96
96
 
97
97
  // a list of views shared between the trigger and target
@@ -22,12 +22,13 @@ class TurboBoost::Elements::TagBuilders::ToggleTagsBuilder < TurboBoost::Element
22
22
  focus_selector: nil, # CSS selector for the element to focus when the target is expanded
23
23
  method: :toggle, # method to inovke (:show, :hide, :toggle)
24
24
  disabled: false, # disable the trigger
25
+ expanded: false, # override to force expansion
25
26
  remember: false, # remember ephemeral UI state between requests
26
27
  **kwargs, # generic support for additional element attributes like `class` etc.
27
28
  &block # a Ruby block that emits this trigger's content
28
29
  )
29
30
  kwargs = kwargs.with_indifferent_access
30
- kwargs[:id] ||= "#{controls}-toggle-trigger-#{SecureRandom.hex(6)}"
31
+ kwargs[:id] ||= "#{controls}-toggle-trigger"
31
32
 
32
33
  # command
33
34
  kwargs[:data] ||= {}
@@ -36,7 +37,7 @@ class TurboBoost::Elements::TagBuilders::ToggleTagsBuilder < TurboBoost::Element
36
37
  # aria
37
38
  kwargs[:aria] ||= {}
38
39
  kwargs[:aria][:controls] = controls # toggle target
39
- kwargs[:aria][:expanded] = target_expanded?(controls)
40
+ kwargs[:aria][:expanded] = expanded || target_expanded?(controls)
40
41
  kwargs[:aria][:atomic] ||= true
41
42
  kwargs[:aria][:relevant] ||= "all"
42
43
 
@@ -57,8 +58,8 @@ class TurboBoost::Elements::TagBuilders::ToggleTagsBuilder < TurboBoost::Element
57
58
  id, # REQUIRED, the `dom_id` for the element
58
59
  collapse_on: [], # list of events that will collapse this target
59
60
  collapse_selector: nil, # CSS selector for other matching targets to collapse when this target is expanded
60
- expanded: false, # override to force expansion
61
61
  focus_selector: nil, # CSS selector for the element to focus when this target is expanded
62
+ expanded: false, # override to force expansion
62
63
  **kwargs, # generic support for additional element attributes like `class` etc.
63
64
  &block # a Ruby block that emits this target's content
64
65
  )
@@ -2,6 +2,6 @@
2
2
 
3
3
  module TurboBoost
4
4
  module Elements
5
- VERSION = "0.0.10"
5
+ VERSION = "0.0.11"
6
6
  end
7
7
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: turbo_boost-elements
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.10
4
+ version: 0.0.11
5
5
  platform: ruby
6
6
  authors:
7
7
  - Nate Hopkins (hopsoft)
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2023-01-29 00:00:00.000000000 Z
11
+ date: 2023-02-07 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: rails