Skip to content

Commit eaf790b

Browse files
htmx fixes
1 parent 68e5883 commit eaf790b

File tree

2 files changed

+78
-17
lines changed

2 files changed

+78
-17
lines changed

Sources/HTMLKitUtilities/HTMX.swift

Lines changed: 65 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ public extension HTMLElementAttribute {
3434
case get(String)
3535
case post(String)
3636
case on(Event, String)
37+
case onevent(HTMLElementAttribute.Extra.event, String)
3738
case pushURL(URL)
3839
case select(String)
3940
case selectOOB(String)
@@ -88,7 +89,7 @@ public extension HTMLElementAttribute {
8889

8990
case "get": self = .get(string())
9091
case "post": self = .post(string())
91-
case "on":
92+
case "on", "onevent":
9293
let string:String = literal()
9394
let values:[Substring] = string.split(separator: ",")
9495
let event_string:String = String(values[0])
@@ -97,8 +98,13 @@ public extension HTMLElementAttribute {
9798
value.removeFirst()
9899
}
99100
value.removeLast()
100-
let event:Event = Event(rawValue: event_string)!
101-
self = .on(event, value)
101+
if key == "on" {
102+
let event:Event = Event(rawValue: event_string)!
103+
self = .on(event, value)
104+
} else {
105+
let event:HTMLElementAttribute.Extra.event = .init(rawValue: event_string)!
106+
self = .onevent(event, value)
107+
}
102108
break
103109
case "pushURL": self = .pushURL(URL(rawValue: string())!)
104110
case "select": self = .select(string())
@@ -126,7 +132,7 @@ public extension HTMLElementAttribute {
126132
case .ext(_): return "ext"
127133
case .headers(_, _): return "headers"
128134
case .history(_): return "history"
129-
case .historyElt(_): return "historyElt"
135+
case .historyElt(_): return "history-elt"
130136
case .include(_): return "include"
131137
case .indicator(_): return "indicator"
132138
case .inherit(_): return "inherit"
@@ -142,7 +148,8 @@ public extension HTMLElementAttribute {
142148

143149
case .get(_): return "get"
144150
case .post(_): return "post"
145-
case .on(let event, _): return "on:" + event.rawValue
151+
case .on(let event, _): return "on:" + event.key
152+
case .onevent(let event, _): return "on:" + event.rawValue
146153
case .pushURL(_): return "push-url"
147154
case .select(_): return "select"
148155
case .selectOOB(_): return "select-oob"
@@ -188,6 +195,7 @@ public extension HTMLElementAttribute {
188195
case .get(let value): return value
189196
case .post(let value): return value
190197
case .on(_, let value): return value
198+
case .onevent(_, let value): return value
191199
case .pushURL(let url): return url.htmlValue
192200
case .select(let value): return value
193201
case .selectOOB(let value): return value
@@ -226,8 +234,8 @@ public extension HTMLElementAttribute.HTMX {
226234
case beforeOnLoad
227235
case beforeProcessNode
228236
case beforeRequest
229-
case beforeSwap
230237
case beforeSend
238+
case beforeSwap
231239
case beforeTransition
232240
case configRequest
233241
case confirm
@@ -244,14 +252,18 @@ public extension HTMLElementAttribute.HTMX {
244252
case oobBeforeSwap
245253
case oobErrorNoTarget
246254
case prompt
255+
case beforeHistoryUpdate
247256
case pushedIntoHistory
257+
case replacedInHistory
248258
case responseError
249259
case sendError
250260
case sseError
251261
case sseOpen
252262
case swapError
253263
case targetError
254264
case timeout
265+
case trigger
266+
case validateURL
255267
case validationValidate
256268
case validationFailed
257269
case validationHalted
@@ -260,17 +272,54 @@ public extension HTMLElementAttribute.HTMX {
260272
case xhrLoadStart
261273
case xhrProgress
262274

263-
public var htmlValue : String {
264-
switch self {
265-
case .validationValidate: return "validation:validate"
266-
case .validationFailed: return "validation:failed"
267-
case .validationHalted: return "validation:halted"
268-
case .xhrAbort: return "xhr:abort"
269-
case .xhrLoadEnd: return "xhr:loadend"
270-
case .xhrLoadStart: return "xhr:loadstart"
271-
case .xhrProgress: return "xhr:progress"
272-
default: return rawValue
275+
public var key : String {
276+
func slug() -> String {
277+
switch self {
278+
case .afterOnLoad: return "after-on-load"
279+
case .afterProcessNode: return "after-process-node"
280+
case .afterRequest: return "after-request"
281+
case .afterSettle: return "after-settle"
282+
case .afterSwap: return "after-swap"
283+
case .beforeCleanupElement: return "before-cleanup-element"
284+
case .beforeOnLoad: return "before-on-load"
285+
case .beforeProcessNode: return "before-process-node"
286+
case .beforeRequest: return "before-request"
287+
case .beforeSend: return "before-send"
288+
case .beforeSwap: return "before-swap"
289+
case .beforeTransition: return "before-transition"
290+
case .configRequest: return "config-request"
291+
case .historyCacheError: return "history-cache-error"
292+
case .historyCacheMiss: return "history-cache-miss"
293+
case .historyCacheMissError: return "history-cache-miss-error"
294+
case .historyCacheMissLoad: return "history-cache-miss-load"
295+
case .historyRestore: return "history-restore"
296+
case .beforeHistorySave: return "before-history-save"
297+
case .noSSESourceError: return "no-sse-source-error"
298+
case .onLoadError: return "on-load-error"
299+
case .oobAfterSwap: return "oob-after-swap"
300+
case .oobBeforeSwap: return "oob-before-swap"
301+
case .oobErrorNoTarget: return "oob-error-no-target"
302+
case .beforeHistoryUpdate: return "before-history-update"
303+
case .pushedIntoHistory: return "pushed-into-history"
304+
case .replacedInHistory: return "replaced-in-history"
305+
case .responseError: return "response-error"
306+
case .sendError: return "send-error"
307+
case .sseError: return "sse-error"
308+
case .sseOpen: return "sse-open"
309+
case .swapError: return "swap-error"
310+
case .targetError: return "target-error"
311+
case .validateURL: return "validate-url"
312+
case .validationValidate: return "validation:validate"
313+
case .validationFailed: return "validation:failed"
314+
case .validationHalted: return "validation:halted"
315+
case .xhrAbort: return "xhr:abort"
316+
case .xhrLoadEnd: return "xhr:loadend"
317+
case .xhrLoadStart: return "xhr:loadstart"
318+
case .xhrProgress: return "xhr:progress"
319+
default: return rawValue
320+
}
273321
}
322+
return ":" + slug()
274323
}
275324
}
276325

Tests/HTMLKitTests/HTMXTests.swift

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,19 @@ struct HTMXTests {
1818
// MARK: on
1919
@Test func on() {
2020
var string:StaticString = #div(attributes: [.htmx(.on(.abort, "bruh"))])
21-
#expect(string == "<div hx-on:abort=\"bruh\"></div>")
21+
#expect(string == "<div hx-on::abort=\"bruh\"></div>")
22+
23+
string = #div(attributes: [.htmx(.on(.afterOnLoad, "test()"))])
24+
#expect(string == "<div hx-on::after-on-load=\"test()\"></div>")
25+
}
26+
27+
// MARK: onevent
28+
@Test func onevent() {
29+
var string:StaticString = #div(attributes: [.htmx(.onevent(.click, "thing()"))])
30+
#expect(string == "<div hx-on:click=\"thing()\"></div>")
31+
32+
string = #div(attributes: [.htmx(.onevent(.durationchange, "durationChanged()"))])
33+
#expect(string == "<div hx-on:durationchange=\"durationChanged()\"></div>")
2234
}
2335

2436
// MARK: post

0 commit comments

Comments
 (0)