giles
a64b693a09
Phase 1 Step 1 of the architecture roadmap. The old cssx.sx (cssx-resolve, cssx-process-token, cssx-template, old tw function) is superseded by the ~tw component system in tw.sx. - Delete shared/sx/templates/cssx.sx - Remove cssx.sx from all load lists (sx_server.ml, run_tests.ml, mcp_tree.ml, compile-modules.js, bundle.sh, sx-build-all.sh) - Replace (tw "tokens") inline style calls with (~tw :tokens "tokens") in layouts.sx and not-found.sx - Remove _css-hash / init-css-tracking / SX-Css header plumbing (dead code — ~tw/flush + flush-collected-styles handle CSS now) - Remove sx-css-classes param and meta tag from shell template - Update stale data-cssx references to data-sx-css in tests Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
44 lines
2.0 KiB
Plaintext
44 lines
2.0 KiB
Plaintext
;; ---------------------------------------------------------------------------
|
|
;; SX app boot — styles, behaviors, and post-render hooks
|
|
;;
|
|
;; Replaces inline_css and init_sx from Python app config.
|
|
;; Called as a data-init script on every page.
|
|
;; ---------------------------------------------------------------------------
|
|
|
|
;; Framework styles — request indicators + link jiggle
|
|
(collect! "cssx" ".sx-indicator{display:none}")
|
|
(collect! "cssx" ".sx-request .sx-indicator{display:inline-flex}")
|
|
(collect! "cssx" "@keyframes sxJiggle{0%,100%{transform:translateX(0)}25%{transform:translateX(-.5px)}75%{transform:translateX(.5px)}}")
|
|
(collect! "cssx" "a.sx-request{animation:sxJiggle .3s ease-in-out infinite}")
|
|
|
|
;; CSSX flush hook — inject collected CSS rules into a <style> tag.
|
|
;; The spec calls (run-post-render-hooks) after hydration/swap/mount.
|
|
;; This is the application's CSS injection strategy.
|
|
(log-info (str "init-client: registering cssx flush hook, type:" (type-of (fn () nil))))
|
|
(register-post-render-hook
|
|
(fn ()
|
|
(log-info (str "cssx flush: running, rules:" (len (collected "cssx"))))
|
|
(let ((rules (collected "cssx")))
|
|
(when (not (empty? rules))
|
|
(let ((style (or (dom-query "[data-sx-css]")
|
|
(let ((s (dom-create-element "style" nil)))
|
|
(dom-set-attr s "data-sx-css" "")
|
|
(dom-append-to-head s)
|
|
s))))
|
|
(dom-set-prop style "textContent"
|
|
(str (or (dom-get-prop style "textContent") "")
|
|
(join "" rules))))
|
|
(clear-collected! "cssx")))))
|
|
|
|
;; Nav link aria-selected update on client-side routing
|
|
(dom-listen (dom-body) "sx:clientRoute"
|
|
(fn (e)
|
|
(let ((p (get (event-detail e) "pathname")))
|
|
(when p
|
|
(for-each
|
|
(fn (a) (dom-set-attr a "aria-selected" "false"))
|
|
(dom-query-all "nav a[aria-selected]"))
|
|
(for-each
|
|
(fn (a) (dom-set-attr a "aria-selected" "true"))
|
|
(dom-query-all (str "nav a[href=\"" p "\"]")))))))
|