@praxisflux/gates 0.5.0 → 0.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -8
- package/codebase-to-course/lib/html/base.html +11 -11
- package/codebase-to-course/lib/toolkit/README.md +1 -1
- package/codebase-to-course/lib/toolkit/diagrams.md +1 -1
- package/codebase-to-course/lib/toolkit/pedagogy.md +1 -1
- package/codebase-to-course/lib/toolkit/svg-diagrams.md +1 -1
- package/codebase-to-course/lib/toolkit/tooltip.md +4 -4
- package/grounding-wiki/lib/html/base.html +11 -11
- package/grounding-wiki/lib/toolkit/README.md +1 -1
- package/grounding-wiki/lib/toolkit/diagrams.md +1 -1
- package/grounding-wiki/lib/toolkit/pedagogy.md +1 -1
- package/grounding-wiki/lib/toolkit/svg-diagrams.md +1 -1
- package/grounding-wiki/lib/toolkit/tooltip.md +4 -4
- package/lib/html/base.html +11 -11
- package/lib/toolkit/README.md +1 -1
- package/lib/toolkit/diagrams.md +1 -1
- package/lib/toolkit/pedagogy.md +1 -1
- package/lib/toolkit/svg-diagrams.md +1 -1
- package/lib/toolkit/tooltip.md +4 -4
- package/package.json +4 -4
- package/scripts/run-gates.mjs +3 -3
- package/spec-bridge/lib/html/base.html +11 -11
- package/spec-bridge/lib/toolkit/README.md +1 -1
- package/spec-bridge/lib/toolkit/diagrams.md +1 -1
- package/spec-bridge/lib/toolkit/pedagogy.md +1 -1
- package/spec-bridge/lib/toolkit/svg-diagrams.md +1 -1
- package/spec-bridge/lib/toolkit/tooltip.md +4 -4
package/README.md
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
# Consuming
|
|
1
|
+
# Consuming praxisflux gates from another repo
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
carry
|
|
3
|
+
praxisflux's gates — "status can't exceed proven artifacts" — are enforceable in repos that don't
|
|
4
|
+
carry praxisflux itself. There are two enforcement points, deliberately split the same way praxisflux
|
|
5
5
|
splits them for its own development:
|
|
6
6
|
|
|
7
7
|
- **Locally / interactively**: the installed plugins' Stop hooks run the gates as you work.
|
|
@@ -19,7 +19,7 @@ jobs:
|
|
|
19
19
|
- uses: actions/checkout@v4
|
|
20
20
|
with:
|
|
21
21
|
fetch-depth: 0 # wiki-freshness resolves pins through git history
|
|
22
|
-
- uses: evanstern/
|
|
22
|
+
- uses: evanstern/praxisflux@v0.5.0
|
|
23
23
|
with:
|
|
24
24
|
gates: spec-bridge, wiki-freshness
|
|
25
25
|
```
|
|
@@ -52,22 +52,22 @@ Dependabot's `github-actions` ecosystem automates that.
|
|
|
52
52
|
|
|
53
53
|
The same surface ships on npm as **`@praxisflux/gates`** (published with provenance by the
|
|
54
54
|
release pipeline, version lockstep with the marketplace release), so non-GitHub CI and
|
|
55
|
-
one-off local runs need no
|
|
55
|
+
one-off local runs need no praxisflux checkout:
|
|
56
56
|
|
|
57
57
|
```sh
|
|
58
58
|
npx @praxisflux/gates --gates spec-bridge,wiki-freshness --path /path/to/repo
|
|
59
59
|
```
|
|
60
60
|
|
|
61
|
-
The package's bin (`
|
|
61
|
+
The package's bin (`praxisflux-gates`) is `scripts/run-gates.mjs` itself, carved out by
|
|
62
62
|
`scripts/build-npm.mjs` with the chassis and gate modules alongside — same flags, same exit
|
|
63
63
|
codes, same failure lines.
|
|
64
64
|
|
|
65
65
|
## The contract
|
|
66
66
|
|
|
67
67
|
Gate names, inputs, and exit codes (0 all pass · 1 any gate failed · 2 usage error) are
|
|
68
|
-
|
|
68
|
+
praxisflux's versioned consumer interface, released and semver-bumped like everything else
|
|
69
69
|
(`docs/releasing.md`); each failure line names its fix. You can also invoke the runner
|
|
70
|
-
directly from any
|
|
70
|
+
directly from any praxisflux checkout:
|
|
71
71
|
|
|
72
72
|
```sh
|
|
73
73
|
node scripts/run-gates.mjs --gates spec-bridge,wiki-freshness --path /path/to/repo
|
|
@@ -3,9 +3,9 @@
|
|
|
3
3
|
<head>
|
|
4
4
|
<meta charset="utf-8">
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
6
|
-
<title>
|
|
6
|
+
<title>praxisflux — self-contained page base</title>
|
|
7
7
|
<!--
|
|
8
|
-
base.html — the SHARED, self-contained, theme-aware foundation for every
|
|
8
|
+
base.html — the SHARED, self-contained, theme-aware foundation for every praxisflux HTML artifact
|
|
9
9
|
(educate decks AND research briefings). Copy the token block, reset, theme-toggle, and table
|
|
10
10
|
component from here; never load anything external (the Artifact CSP blocks remote hosts —
|
|
11
11
|
inline all CSS/JS, embed images as data: URIs). Validate the result with lib/selfcontained.mjs.
|
|
@@ -15,9 +15,9 @@
|
|
|
15
15
|
:root[data-theme="light"] block lets the on-page toggle override the OS in either direction.
|
|
16
16
|
-->
|
|
17
17
|
<style>
|
|
18
|
-
/* The canonical token schema. Hand-edit ONLY here (between the
|
|
18
|
+
/* The canonical token schema. Hand-edit ONLY here (between the praxisflux:tokens markers);
|
|
19
19
|
consumers (educate's deck template) carry a stamped copy — scripts/sync-shared.mjs. */
|
|
20
|
-
/*
|
|
20
|
+
/* praxisflux:tokens:start */
|
|
21
21
|
/* ---- design tokens (light) ---- */
|
|
22
22
|
:root{
|
|
23
23
|
--bg:#f4f6f9; --card:#ffffff; --ink:#1b2733; --muted:#5a6776;
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
--line:#dde3ea; --chip:#f3f5f8;
|
|
50
50
|
--callout-bg:#f5f5ff; --warn-bg:#fff6ee; --ok-bg:#eefaf7;
|
|
51
51
|
}
|
|
52
|
-
/*
|
|
52
|
+
/* praxisflux:tokens:end */
|
|
53
53
|
|
|
54
54
|
/* ---- reset + base ---- */
|
|
55
55
|
*{box-sizing:border-box}
|
|
@@ -89,7 +89,7 @@
|
|
|
89
89
|
<button class="theme-toggle" id="themeToggle" aria-label="Toggle light/dark theme">◐ theme</button>
|
|
90
90
|
<div class="wrap">
|
|
91
91
|
<h1>Self-contained page base</h1>
|
|
92
|
-
<p class="muted">The shared foundation for
|
|
92
|
+
<p class="muted">The shared foundation for praxisflux artifacts — theme-aware, offline, CSP-safe.
|
|
93
93
|
Replace this content; keep the tokens, reset, toggle, and table.</p>
|
|
94
94
|
|
|
95
95
|
<div class="callout">Lead with the point. A briefing leads with the analysis's verdict; a deck
|
|
@@ -109,21 +109,21 @@
|
|
|
109
109
|
</div>
|
|
110
110
|
</div>
|
|
111
111
|
<script>
|
|
112
|
-
// The shared theme-cycle core. Hand-edit ONLY here (between the
|
|
112
|
+
// The shared theme-cycle core. Hand-edit ONLY here (between the praxisflux:theme markers);
|
|
113
113
|
// consumers carry a stamped copy — scripts/sync-shared.mjs.
|
|
114
|
-
//
|
|
114
|
+
// praxisflux:theme:start
|
|
115
115
|
// Cycles auto -> light -> dark, stamping data-theme on <html> so the CSS token overrides win
|
|
116
116
|
// over the OS preference. No storage, no external calls. State rides on the button
|
|
117
117
|
// (dataset.mode) so any page can bind its own button.
|
|
118
|
-
function
|
|
118
|
+
function praxisfluxCycleTheme(btn){
|
|
119
119
|
const order=["auto","light","dark"], label={auto:"◐ auto",light:"☀ light",dark:"☾ dark"};
|
|
120
120
|
const next=order[(order.indexOf(btn.dataset.mode||"auto")+1)%order.length];
|
|
121
121
|
if(next==="auto") document.documentElement.removeAttribute("data-theme");
|
|
122
122
|
else document.documentElement.setAttribute("data-theme",next);
|
|
123
123
|
btn.dataset.mode=next; btn.textContent=label[next]; return next;
|
|
124
124
|
}
|
|
125
|
-
//
|
|
126
|
-
document.getElementById('themeToggle').addEventListener('click',(e)=>
|
|
125
|
+
// praxisflux:theme:end
|
|
126
|
+
document.getElementById('themeToggle').addEventListener('click',(e)=>praxisfluxCycleTheme(e.currentTarget));
|
|
127
127
|
</script>
|
|
128
128
|
</body>
|
|
129
129
|
</html>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# lib/toolkit — shared educational content modules
|
|
2
2
|
|
|
3
|
-
Reusable teaching and visual tools shared across the
|
|
3
|
+
Reusable teaching and visual tools shared across the praxisflux plugins. Where the rest of `lib/`
|
|
4
4
|
is shared *plumbing* (code the gates and scripts import), `toolkit/` is shared *content*:
|
|
5
5
|
authoring guidance and copy-paste CSS/JS snippets a skill reads while producing a deck, course,
|
|
6
6
|
or briefing. The full convention lives in
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Diagrams that are plain HTML + CSS (boxes, arrows, trees — often with an emoji as the icon)
|
|
4
4
|
inherit the theme tokens, wrap responsively, and never hit SVG's text pitfalls. This is
|
|
5
|
-
codebase-to-course's native diagram idiom, portable to any
|
|
5
|
+
codebase-to-course's native diagram idiom, portable to any praxisflux surface. For hand-drawn
|
|
6
6
|
SVG figures instead, see `svg-diagrams.md`.
|
|
7
7
|
|
|
8
8
|
**Graceful degradation:** if this module isn't available, a numbered list of steps or an
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Visual-teaching principles
|
|
2
2
|
|
|
3
|
-
The shared pedagogy behind every
|
|
3
|
+
The shared pedagogy behind every praxisflux teaching surface — codebase-to-course's course screens,
|
|
4
4
|
educate's deck slides, research's briefing pages. Written once here; each skill keeps only its
|
|
5
5
|
medium-specific rules (and a one-line distillation as fallback) and points at this module.
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Inline-SVG diagram rules
|
|
2
2
|
|
|
3
|
-
Hand-drawn inline SVG is the
|
|
3
|
+
Hand-drawn inline SVG is the praxisflux idiom for explanatory figures (educate decks draw
|
|
4
4
|
diagrams this way; research briefings draw charts as inline SVG). SVG has sharp edges that
|
|
5
5
|
HTML habits walk straight into — these are the hard-won rules, originally from educate's
|
|
6
6
|
deck template.
|
|
@@ -38,7 +38,7 @@ Consumers embed the marked regions verbatim; `scripts/sync-shared.mjs` re-stamps
|
|
|
38
38
|
fails the test suite). Hand-edit only here.
|
|
39
39
|
|
|
40
40
|
```css
|
|
41
|
-
/*
|
|
41
|
+
/* praxisflux:tooltip-css:start */
|
|
42
42
|
[data-tip]{cursor:help}
|
|
43
43
|
.tip-pop{position:fixed;z-index:1000;max-width:min(420px,80vw);background:var(--ink);color:var(--bg);
|
|
44
44
|
font-size:var(--tip-size,1rem);line-height:1.4;padding:.65em .9em;border-radius:10px;
|
|
@@ -46,11 +46,11 @@ fails the test suite). Hand-edit only here.
|
|
|
46
46
|
transition:opacity .12s ease,transform .12s ease}
|
|
47
47
|
.tip-pop.show{opacity:1;transform:translateY(0)}
|
|
48
48
|
@media print{ .tip-pop{display:none} }
|
|
49
|
-
/*
|
|
49
|
+
/* praxisflux:tooltip-css:end */
|
|
50
50
|
```
|
|
51
51
|
|
|
52
52
|
```js
|
|
53
|
-
//
|
|
53
|
+
// praxisflux:tooltip-js:start
|
|
54
54
|
// One shared popover: follows the cursor on hover, toggles on click/tap (touch), clamps to
|
|
55
55
|
// the viewport, and closes on tap-away. Works for HTML and SVG [data-tip] elements alike.
|
|
56
56
|
(function(){
|
|
@@ -69,7 +69,7 @@ fails the test suite). Hand-edit only here.
|
|
|
69
69
|
document.addEventListener('click',e=>{ const t=e.target.closest&&e.target.closest('[data-tip]');
|
|
70
70
|
if(t){ e.stopPropagation(); (shownFor===t)?hide():show(t,e.clientX,e.clientY); } else hide(); });
|
|
71
71
|
})();
|
|
72
|
-
//
|
|
72
|
+
// praxisflux:tooltip-js:end
|
|
73
73
|
```
|
|
74
74
|
|
|
75
75
|
## Where each plugin gets it
|
|
@@ -3,9 +3,9 @@
|
|
|
3
3
|
<head>
|
|
4
4
|
<meta charset="utf-8">
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
6
|
-
<title>
|
|
6
|
+
<title>praxisflux — self-contained page base</title>
|
|
7
7
|
<!--
|
|
8
|
-
base.html — the SHARED, self-contained, theme-aware foundation for every
|
|
8
|
+
base.html — the SHARED, self-contained, theme-aware foundation for every praxisflux HTML artifact
|
|
9
9
|
(educate decks AND research briefings). Copy the token block, reset, theme-toggle, and table
|
|
10
10
|
component from here; never load anything external (the Artifact CSP blocks remote hosts —
|
|
11
11
|
inline all CSS/JS, embed images as data: URIs). Validate the result with lib/selfcontained.mjs.
|
|
@@ -15,9 +15,9 @@
|
|
|
15
15
|
:root[data-theme="light"] block lets the on-page toggle override the OS in either direction.
|
|
16
16
|
-->
|
|
17
17
|
<style>
|
|
18
|
-
/* The canonical token schema. Hand-edit ONLY here (between the
|
|
18
|
+
/* The canonical token schema. Hand-edit ONLY here (between the praxisflux:tokens markers);
|
|
19
19
|
consumers (educate's deck template) carry a stamped copy — scripts/sync-shared.mjs. */
|
|
20
|
-
/*
|
|
20
|
+
/* praxisflux:tokens:start */
|
|
21
21
|
/* ---- design tokens (light) ---- */
|
|
22
22
|
:root{
|
|
23
23
|
--bg:#f4f6f9; --card:#ffffff; --ink:#1b2733; --muted:#5a6776;
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
--line:#dde3ea; --chip:#f3f5f8;
|
|
50
50
|
--callout-bg:#f5f5ff; --warn-bg:#fff6ee; --ok-bg:#eefaf7;
|
|
51
51
|
}
|
|
52
|
-
/*
|
|
52
|
+
/* praxisflux:tokens:end */
|
|
53
53
|
|
|
54
54
|
/* ---- reset + base ---- */
|
|
55
55
|
*{box-sizing:border-box}
|
|
@@ -89,7 +89,7 @@
|
|
|
89
89
|
<button class="theme-toggle" id="themeToggle" aria-label="Toggle light/dark theme">◐ theme</button>
|
|
90
90
|
<div class="wrap">
|
|
91
91
|
<h1>Self-contained page base</h1>
|
|
92
|
-
<p class="muted">The shared foundation for
|
|
92
|
+
<p class="muted">The shared foundation for praxisflux artifacts — theme-aware, offline, CSP-safe.
|
|
93
93
|
Replace this content; keep the tokens, reset, toggle, and table.</p>
|
|
94
94
|
|
|
95
95
|
<div class="callout">Lead with the point. A briefing leads with the analysis's verdict; a deck
|
|
@@ -109,21 +109,21 @@
|
|
|
109
109
|
</div>
|
|
110
110
|
</div>
|
|
111
111
|
<script>
|
|
112
|
-
// The shared theme-cycle core. Hand-edit ONLY here (between the
|
|
112
|
+
// The shared theme-cycle core. Hand-edit ONLY here (between the praxisflux:theme markers);
|
|
113
113
|
// consumers carry a stamped copy — scripts/sync-shared.mjs.
|
|
114
|
-
//
|
|
114
|
+
// praxisflux:theme:start
|
|
115
115
|
// Cycles auto -> light -> dark, stamping data-theme on <html> so the CSS token overrides win
|
|
116
116
|
// over the OS preference. No storage, no external calls. State rides on the button
|
|
117
117
|
// (dataset.mode) so any page can bind its own button.
|
|
118
|
-
function
|
|
118
|
+
function praxisfluxCycleTheme(btn){
|
|
119
119
|
const order=["auto","light","dark"], label={auto:"◐ auto",light:"☀ light",dark:"☾ dark"};
|
|
120
120
|
const next=order[(order.indexOf(btn.dataset.mode||"auto")+1)%order.length];
|
|
121
121
|
if(next==="auto") document.documentElement.removeAttribute("data-theme");
|
|
122
122
|
else document.documentElement.setAttribute("data-theme",next);
|
|
123
123
|
btn.dataset.mode=next; btn.textContent=label[next]; return next;
|
|
124
124
|
}
|
|
125
|
-
//
|
|
126
|
-
document.getElementById('themeToggle').addEventListener('click',(e)=>
|
|
125
|
+
// praxisflux:theme:end
|
|
126
|
+
document.getElementById('themeToggle').addEventListener('click',(e)=>praxisfluxCycleTheme(e.currentTarget));
|
|
127
127
|
</script>
|
|
128
128
|
</body>
|
|
129
129
|
</html>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# lib/toolkit — shared educational content modules
|
|
2
2
|
|
|
3
|
-
Reusable teaching and visual tools shared across the
|
|
3
|
+
Reusable teaching and visual tools shared across the praxisflux plugins. Where the rest of `lib/`
|
|
4
4
|
is shared *plumbing* (code the gates and scripts import), `toolkit/` is shared *content*:
|
|
5
5
|
authoring guidance and copy-paste CSS/JS snippets a skill reads while producing a deck, course,
|
|
6
6
|
or briefing. The full convention lives in
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Diagrams that are plain HTML + CSS (boxes, arrows, trees — often with an emoji as the icon)
|
|
4
4
|
inherit the theme tokens, wrap responsively, and never hit SVG's text pitfalls. This is
|
|
5
|
-
codebase-to-course's native diagram idiom, portable to any
|
|
5
|
+
codebase-to-course's native diagram idiom, portable to any praxisflux surface. For hand-drawn
|
|
6
6
|
SVG figures instead, see `svg-diagrams.md`.
|
|
7
7
|
|
|
8
8
|
**Graceful degradation:** if this module isn't available, a numbered list of steps or an
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Visual-teaching principles
|
|
2
2
|
|
|
3
|
-
The shared pedagogy behind every
|
|
3
|
+
The shared pedagogy behind every praxisflux teaching surface — codebase-to-course's course screens,
|
|
4
4
|
educate's deck slides, research's briefing pages. Written once here; each skill keeps only its
|
|
5
5
|
medium-specific rules (and a one-line distillation as fallback) and points at this module.
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Inline-SVG diagram rules
|
|
2
2
|
|
|
3
|
-
Hand-drawn inline SVG is the
|
|
3
|
+
Hand-drawn inline SVG is the praxisflux idiom for explanatory figures (educate decks draw
|
|
4
4
|
diagrams this way; research briefings draw charts as inline SVG). SVG has sharp edges that
|
|
5
5
|
HTML habits walk straight into — these are the hard-won rules, originally from educate's
|
|
6
6
|
deck template.
|
|
@@ -38,7 +38,7 @@ Consumers embed the marked regions verbatim; `scripts/sync-shared.mjs` re-stamps
|
|
|
38
38
|
fails the test suite). Hand-edit only here.
|
|
39
39
|
|
|
40
40
|
```css
|
|
41
|
-
/*
|
|
41
|
+
/* praxisflux:tooltip-css:start */
|
|
42
42
|
[data-tip]{cursor:help}
|
|
43
43
|
.tip-pop{position:fixed;z-index:1000;max-width:min(420px,80vw);background:var(--ink);color:var(--bg);
|
|
44
44
|
font-size:var(--tip-size,1rem);line-height:1.4;padding:.65em .9em;border-radius:10px;
|
|
@@ -46,11 +46,11 @@ fails the test suite). Hand-edit only here.
|
|
|
46
46
|
transition:opacity .12s ease,transform .12s ease}
|
|
47
47
|
.tip-pop.show{opacity:1;transform:translateY(0)}
|
|
48
48
|
@media print{ .tip-pop{display:none} }
|
|
49
|
-
/*
|
|
49
|
+
/* praxisflux:tooltip-css:end */
|
|
50
50
|
```
|
|
51
51
|
|
|
52
52
|
```js
|
|
53
|
-
//
|
|
53
|
+
// praxisflux:tooltip-js:start
|
|
54
54
|
// One shared popover: follows the cursor on hover, toggles on click/tap (touch), clamps to
|
|
55
55
|
// the viewport, and closes on tap-away. Works for HTML and SVG [data-tip] elements alike.
|
|
56
56
|
(function(){
|
|
@@ -69,7 +69,7 @@ fails the test suite). Hand-edit only here.
|
|
|
69
69
|
document.addEventListener('click',e=>{ const t=e.target.closest&&e.target.closest('[data-tip]');
|
|
70
70
|
if(t){ e.stopPropagation(); (shownFor===t)?hide():show(t,e.clientX,e.clientY); } else hide(); });
|
|
71
71
|
})();
|
|
72
|
-
//
|
|
72
|
+
// praxisflux:tooltip-js:end
|
|
73
73
|
```
|
|
74
74
|
|
|
75
75
|
## Where each plugin gets it
|
package/lib/html/base.html
CHANGED
|
@@ -3,9 +3,9 @@
|
|
|
3
3
|
<head>
|
|
4
4
|
<meta charset="utf-8">
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
6
|
-
<title>
|
|
6
|
+
<title>praxisflux — self-contained page base</title>
|
|
7
7
|
<!--
|
|
8
|
-
base.html — the SHARED, self-contained, theme-aware foundation for every
|
|
8
|
+
base.html — the SHARED, self-contained, theme-aware foundation for every praxisflux HTML artifact
|
|
9
9
|
(educate decks AND research briefings). Copy the token block, reset, theme-toggle, and table
|
|
10
10
|
component from here; never load anything external (the Artifact CSP blocks remote hosts —
|
|
11
11
|
inline all CSS/JS, embed images as data: URIs). Validate the result with lib/selfcontained.mjs.
|
|
@@ -15,9 +15,9 @@
|
|
|
15
15
|
:root[data-theme="light"] block lets the on-page toggle override the OS in either direction.
|
|
16
16
|
-->
|
|
17
17
|
<style>
|
|
18
|
-
/* The canonical token schema. Hand-edit ONLY here (between the
|
|
18
|
+
/* The canonical token schema. Hand-edit ONLY here (between the praxisflux:tokens markers);
|
|
19
19
|
consumers (educate's deck template) carry a stamped copy — scripts/sync-shared.mjs. */
|
|
20
|
-
/*
|
|
20
|
+
/* praxisflux:tokens:start */
|
|
21
21
|
/* ---- design tokens (light) ---- */
|
|
22
22
|
:root{
|
|
23
23
|
--bg:#f4f6f9; --card:#ffffff; --ink:#1b2733; --muted:#5a6776;
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
--line:#dde3ea; --chip:#f3f5f8;
|
|
50
50
|
--callout-bg:#f5f5ff; --warn-bg:#fff6ee; --ok-bg:#eefaf7;
|
|
51
51
|
}
|
|
52
|
-
/*
|
|
52
|
+
/* praxisflux:tokens:end */
|
|
53
53
|
|
|
54
54
|
/* ---- reset + base ---- */
|
|
55
55
|
*{box-sizing:border-box}
|
|
@@ -89,7 +89,7 @@
|
|
|
89
89
|
<button class="theme-toggle" id="themeToggle" aria-label="Toggle light/dark theme">◐ theme</button>
|
|
90
90
|
<div class="wrap">
|
|
91
91
|
<h1>Self-contained page base</h1>
|
|
92
|
-
<p class="muted">The shared foundation for
|
|
92
|
+
<p class="muted">The shared foundation for praxisflux artifacts — theme-aware, offline, CSP-safe.
|
|
93
93
|
Replace this content; keep the tokens, reset, toggle, and table.</p>
|
|
94
94
|
|
|
95
95
|
<div class="callout">Lead with the point. A briefing leads with the analysis's verdict; a deck
|
|
@@ -109,21 +109,21 @@
|
|
|
109
109
|
</div>
|
|
110
110
|
</div>
|
|
111
111
|
<script>
|
|
112
|
-
// The shared theme-cycle core. Hand-edit ONLY here (between the
|
|
112
|
+
// The shared theme-cycle core. Hand-edit ONLY here (between the praxisflux:theme markers);
|
|
113
113
|
// consumers carry a stamped copy — scripts/sync-shared.mjs.
|
|
114
|
-
//
|
|
114
|
+
// praxisflux:theme:start
|
|
115
115
|
// Cycles auto -> light -> dark, stamping data-theme on <html> so the CSS token overrides win
|
|
116
116
|
// over the OS preference. No storage, no external calls. State rides on the button
|
|
117
117
|
// (dataset.mode) so any page can bind its own button.
|
|
118
|
-
function
|
|
118
|
+
function praxisfluxCycleTheme(btn){
|
|
119
119
|
const order=["auto","light","dark"], label={auto:"◐ auto",light:"☀ light",dark:"☾ dark"};
|
|
120
120
|
const next=order[(order.indexOf(btn.dataset.mode||"auto")+1)%order.length];
|
|
121
121
|
if(next==="auto") document.documentElement.removeAttribute("data-theme");
|
|
122
122
|
else document.documentElement.setAttribute("data-theme",next);
|
|
123
123
|
btn.dataset.mode=next; btn.textContent=label[next]; return next;
|
|
124
124
|
}
|
|
125
|
-
//
|
|
126
|
-
document.getElementById('themeToggle').addEventListener('click',(e)=>
|
|
125
|
+
// praxisflux:theme:end
|
|
126
|
+
document.getElementById('themeToggle').addEventListener('click',(e)=>praxisfluxCycleTheme(e.currentTarget));
|
|
127
127
|
</script>
|
|
128
128
|
</body>
|
|
129
129
|
</html>
|
package/lib/toolkit/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# lib/toolkit — shared educational content modules
|
|
2
2
|
|
|
3
|
-
Reusable teaching and visual tools shared across the
|
|
3
|
+
Reusable teaching and visual tools shared across the praxisflux plugins. Where the rest of `lib/`
|
|
4
4
|
is shared *plumbing* (code the gates and scripts import), `toolkit/` is shared *content*:
|
|
5
5
|
authoring guidance and copy-paste CSS/JS snippets a skill reads while producing a deck, course,
|
|
6
6
|
or briefing. The full convention lives in
|
package/lib/toolkit/diagrams.md
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Diagrams that are plain HTML + CSS (boxes, arrows, trees — often with an emoji as the icon)
|
|
4
4
|
inherit the theme tokens, wrap responsively, and never hit SVG's text pitfalls. This is
|
|
5
|
-
codebase-to-course's native diagram idiom, portable to any
|
|
5
|
+
codebase-to-course's native diagram idiom, portable to any praxisflux surface. For hand-drawn
|
|
6
6
|
SVG figures instead, see `svg-diagrams.md`.
|
|
7
7
|
|
|
8
8
|
**Graceful degradation:** if this module isn't available, a numbered list of steps or an
|
package/lib/toolkit/pedagogy.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Visual-teaching principles
|
|
2
2
|
|
|
3
|
-
The shared pedagogy behind every
|
|
3
|
+
The shared pedagogy behind every praxisflux teaching surface — codebase-to-course's course screens,
|
|
4
4
|
educate's deck slides, research's briefing pages. Written once here; each skill keeps only its
|
|
5
5
|
medium-specific rules (and a one-line distillation as fallback) and points at this module.
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Inline-SVG diagram rules
|
|
2
2
|
|
|
3
|
-
Hand-drawn inline SVG is the
|
|
3
|
+
Hand-drawn inline SVG is the praxisflux idiom for explanatory figures (educate decks draw
|
|
4
4
|
diagrams this way; research briefings draw charts as inline SVG). SVG has sharp edges that
|
|
5
5
|
HTML habits walk straight into — these are the hard-won rules, originally from educate's
|
|
6
6
|
deck template.
|
package/lib/toolkit/tooltip.md
CHANGED
|
@@ -38,7 +38,7 @@ Consumers embed the marked regions verbatim; `scripts/sync-shared.mjs` re-stamps
|
|
|
38
38
|
fails the test suite). Hand-edit only here.
|
|
39
39
|
|
|
40
40
|
```css
|
|
41
|
-
/*
|
|
41
|
+
/* praxisflux:tooltip-css:start */
|
|
42
42
|
[data-tip]{cursor:help}
|
|
43
43
|
.tip-pop{position:fixed;z-index:1000;max-width:min(420px,80vw);background:var(--ink);color:var(--bg);
|
|
44
44
|
font-size:var(--tip-size,1rem);line-height:1.4;padding:.65em .9em;border-radius:10px;
|
|
@@ -46,11 +46,11 @@ fails the test suite). Hand-edit only here.
|
|
|
46
46
|
transition:opacity .12s ease,transform .12s ease}
|
|
47
47
|
.tip-pop.show{opacity:1;transform:translateY(0)}
|
|
48
48
|
@media print{ .tip-pop{display:none} }
|
|
49
|
-
/*
|
|
49
|
+
/* praxisflux:tooltip-css:end */
|
|
50
50
|
```
|
|
51
51
|
|
|
52
52
|
```js
|
|
53
|
-
//
|
|
53
|
+
// praxisflux:tooltip-js:start
|
|
54
54
|
// One shared popover: follows the cursor on hover, toggles on click/tap (touch), clamps to
|
|
55
55
|
// the viewport, and closes on tap-away. Works for HTML and SVG [data-tip] elements alike.
|
|
56
56
|
(function(){
|
|
@@ -69,7 +69,7 @@ fails the test suite). Hand-edit only here.
|
|
|
69
69
|
document.addEventListener('click',e=>{ const t=e.target.closest&&e.target.closest('[data-tip]');
|
|
70
70
|
if(t){ e.stopPropagation(); (shownFor===t)?hide():show(t,e.clientX,e.clientY); } else hide(); });
|
|
71
71
|
})();
|
|
72
|
-
//
|
|
72
|
+
// praxisflux:tooltip-js:end
|
|
73
73
|
```
|
|
74
74
|
|
|
75
75
|
## Where each plugin gets it
|
package/package.json
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@praxisflux/gates",
|
|
3
|
-
"version": "0.
|
|
4
|
-
"description": "
|
|
3
|
+
"version": "0.6.1",
|
|
4
|
+
"description": "praxisflux gate checks as a zero-dependency CLI (spec-bridge, wiki-freshness, course) — status can't exceed proven artifacts",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
8
|
-
"url": "git+https://github.com/evanstern/
|
|
8
|
+
"url": "git+https://github.com/evanstern/praxisflux.git"
|
|
9
9
|
},
|
|
10
10
|
"type": "module",
|
|
11
11
|
"bin": {
|
|
12
|
-
"
|
|
12
|
+
"praxisflux-gates": "scripts/run-gates.mjs"
|
|
13
13
|
},
|
|
14
14
|
"engines": {
|
|
15
15
|
"node": ">=18"
|
package/scripts/run-gates.mjs
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
#!/usr/bin/env node
|
|
2
|
-
// run-gates.mjs — the
|
|
2
|
+
// run-gates.mjs — the praxisflux CI consumption surface: run selected praxisflux gates against a
|
|
3
3
|
// consumer repository. This is what action.yml (the composite GitHub Action) invokes; it also
|
|
4
|
-
// runs by hand from any
|
|
4
|
+
// runs by hand from any praxisflux checkout:
|
|
5
5
|
//
|
|
6
6
|
// node scripts/run-gates.mjs --gates spec-bridge,wiki-freshness [--path <root>]
|
|
7
7
|
// [--wiki-dir docs/wiki] [--course-dir docs/course]
|
|
8
8
|
//
|
|
9
|
-
// Gate names, options, and exit codes are
|
|
9
|
+
// Gate names, options, and exit codes are praxisflux's versioned consumer contract
|
|
10
10
|
// (docs/consuming-gates.md): exit 0 when every gate passes, 1 when any gate fails, 2 on a
|
|
11
11
|
// usage error (unknown gate, missing --gates). Each failure line names its fix. This same
|
|
12
12
|
// file ships as the @praxisflux/gates npm bin (scripts/build-npm.mjs carves the package).
|
|
@@ -3,9 +3,9 @@
|
|
|
3
3
|
<head>
|
|
4
4
|
<meta charset="utf-8">
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
6
|
-
<title>
|
|
6
|
+
<title>praxisflux — self-contained page base</title>
|
|
7
7
|
<!--
|
|
8
|
-
base.html — the SHARED, self-contained, theme-aware foundation for every
|
|
8
|
+
base.html — the SHARED, self-contained, theme-aware foundation for every praxisflux HTML artifact
|
|
9
9
|
(educate decks AND research briefings). Copy the token block, reset, theme-toggle, and table
|
|
10
10
|
component from here; never load anything external (the Artifact CSP blocks remote hosts —
|
|
11
11
|
inline all CSS/JS, embed images as data: URIs). Validate the result with lib/selfcontained.mjs.
|
|
@@ -15,9 +15,9 @@
|
|
|
15
15
|
:root[data-theme="light"] block lets the on-page toggle override the OS in either direction.
|
|
16
16
|
-->
|
|
17
17
|
<style>
|
|
18
|
-
/* The canonical token schema. Hand-edit ONLY here (between the
|
|
18
|
+
/* The canonical token schema. Hand-edit ONLY here (between the praxisflux:tokens markers);
|
|
19
19
|
consumers (educate's deck template) carry a stamped copy — scripts/sync-shared.mjs. */
|
|
20
|
-
/*
|
|
20
|
+
/* praxisflux:tokens:start */
|
|
21
21
|
/* ---- design tokens (light) ---- */
|
|
22
22
|
:root{
|
|
23
23
|
--bg:#f4f6f9; --card:#ffffff; --ink:#1b2733; --muted:#5a6776;
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
--line:#dde3ea; --chip:#f3f5f8;
|
|
50
50
|
--callout-bg:#f5f5ff; --warn-bg:#fff6ee; --ok-bg:#eefaf7;
|
|
51
51
|
}
|
|
52
|
-
/*
|
|
52
|
+
/* praxisflux:tokens:end */
|
|
53
53
|
|
|
54
54
|
/* ---- reset + base ---- */
|
|
55
55
|
*{box-sizing:border-box}
|
|
@@ -89,7 +89,7 @@
|
|
|
89
89
|
<button class="theme-toggle" id="themeToggle" aria-label="Toggle light/dark theme">◐ theme</button>
|
|
90
90
|
<div class="wrap">
|
|
91
91
|
<h1>Self-contained page base</h1>
|
|
92
|
-
<p class="muted">The shared foundation for
|
|
92
|
+
<p class="muted">The shared foundation for praxisflux artifacts — theme-aware, offline, CSP-safe.
|
|
93
93
|
Replace this content; keep the tokens, reset, toggle, and table.</p>
|
|
94
94
|
|
|
95
95
|
<div class="callout">Lead with the point. A briefing leads with the analysis's verdict; a deck
|
|
@@ -109,21 +109,21 @@
|
|
|
109
109
|
</div>
|
|
110
110
|
</div>
|
|
111
111
|
<script>
|
|
112
|
-
// The shared theme-cycle core. Hand-edit ONLY here (between the
|
|
112
|
+
// The shared theme-cycle core. Hand-edit ONLY here (between the praxisflux:theme markers);
|
|
113
113
|
// consumers carry a stamped copy — scripts/sync-shared.mjs.
|
|
114
|
-
//
|
|
114
|
+
// praxisflux:theme:start
|
|
115
115
|
// Cycles auto -> light -> dark, stamping data-theme on <html> so the CSS token overrides win
|
|
116
116
|
// over the OS preference. No storage, no external calls. State rides on the button
|
|
117
117
|
// (dataset.mode) so any page can bind its own button.
|
|
118
|
-
function
|
|
118
|
+
function praxisfluxCycleTheme(btn){
|
|
119
119
|
const order=["auto","light","dark"], label={auto:"◐ auto",light:"☀ light",dark:"☾ dark"};
|
|
120
120
|
const next=order[(order.indexOf(btn.dataset.mode||"auto")+1)%order.length];
|
|
121
121
|
if(next==="auto") document.documentElement.removeAttribute("data-theme");
|
|
122
122
|
else document.documentElement.setAttribute("data-theme",next);
|
|
123
123
|
btn.dataset.mode=next; btn.textContent=label[next]; return next;
|
|
124
124
|
}
|
|
125
|
-
//
|
|
126
|
-
document.getElementById('themeToggle').addEventListener('click',(e)=>
|
|
125
|
+
// praxisflux:theme:end
|
|
126
|
+
document.getElementById('themeToggle').addEventListener('click',(e)=>praxisfluxCycleTheme(e.currentTarget));
|
|
127
127
|
</script>
|
|
128
128
|
</body>
|
|
129
129
|
</html>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# lib/toolkit — shared educational content modules
|
|
2
2
|
|
|
3
|
-
Reusable teaching and visual tools shared across the
|
|
3
|
+
Reusable teaching and visual tools shared across the praxisflux plugins. Where the rest of `lib/`
|
|
4
4
|
is shared *plumbing* (code the gates and scripts import), `toolkit/` is shared *content*:
|
|
5
5
|
authoring guidance and copy-paste CSS/JS snippets a skill reads while producing a deck, course,
|
|
6
6
|
or briefing. The full convention lives in
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Diagrams that are plain HTML + CSS (boxes, arrows, trees — often with an emoji as the icon)
|
|
4
4
|
inherit the theme tokens, wrap responsively, and never hit SVG's text pitfalls. This is
|
|
5
|
-
codebase-to-course's native diagram idiom, portable to any
|
|
5
|
+
codebase-to-course's native diagram idiom, portable to any praxisflux surface. For hand-drawn
|
|
6
6
|
SVG figures instead, see `svg-diagrams.md`.
|
|
7
7
|
|
|
8
8
|
**Graceful degradation:** if this module isn't available, a numbered list of steps or an
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Visual-teaching principles
|
|
2
2
|
|
|
3
|
-
The shared pedagogy behind every
|
|
3
|
+
The shared pedagogy behind every praxisflux teaching surface — codebase-to-course's course screens,
|
|
4
4
|
educate's deck slides, research's briefing pages. Written once here; each skill keeps only its
|
|
5
5
|
medium-specific rules (and a one-line distillation as fallback) and points at this module.
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Inline-SVG diagram rules
|
|
2
2
|
|
|
3
|
-
Hand-drawn inline SVG is the
|
|
3
|
+
Hand-drawn inline SVG is the praxisflux idiom for explanatory figures (educate decks draw
|
|
4
4
|
diagrams this way; research briefings draw charts as inline SVG). SVG has sharp edges that
|
|
5
5
|
HTML habits walk straight into — these are the hard-won rules, originally from educate's
|
|
6
6
|
deck template.
|
|
@@ -38,7 +38,7 @@ Consumers embed the marked regions verbatim; `scripts/sync-shared.mjs` re-stamps
|
|
|
38
38
|
fails the test suite). Hand-edit only here.
|
|
39
39
|
|
|
40
40
|
```css
|
|
41
|
-
/*
|
|
41
|
+
/* praxisflux:tooltip-css:start */
|
|
42
42
|
[data-tip]{cursor:help}
|
|
43
43
|
.tip-pop{position:fixed;z-index:1000;max-width:min(420px,80vw);background:var(--ink);color:var(--bg);
|
|
44
44
|
font-size:var(--tip-size,1rem);line-height:1.4;padding:.65em .9em;border-radius:10px;
|
|
@@ -46,11 +46,11 @@ fails the test suite). Hand-edit only here.
|
|
|
46
46
|
transition:opacity .12s ease,transform .12s ease}
|
|
47
47
|
.tip-pop.show{opacity:1;transform:translateY(0)}
|
|
48
48
|
@media print{ .tip-pop{display:none} }
|
|
49
|
-
/*
|
|
49
|
+
/* praxisflux:tooltip-css:end */
|
|
50
50
|
```
|
|
51
51
|
|
|
52
52
|
```js
|
|
53
|
-
//
|
|
53
|
+
// praxisflux:tooltip-js:start
|
|
54
54
|
// One shared popover: follows the cursor on hover, toggles on click/tap (touch), clamps to
|
|
55
55
|
// the viewport, and closes on tap-away. Works for HTML and SVG [data-tip] elements alike.
|
|
56
56
|
(function(){
|
|
@@ -69,7 +69,7 @@ fails the test suite). Hand-edit only here.
|
|
|
69
69
|
document.addEventListener('click',e=>{ const t=e.target.closest&&e.target.closest('[data-tip]');
|
|
70
70
|
if(t){ e.stopPropagation(); (shownFor===t)?hide():show(t,e.clientX,e.clientY); } else hide(); });
|
|
71
71
|
})();
|
|
72
|
-
//
|
|
72
|
+
// praxisflux:tooltip-js:end
|
|
73
73
|
```
|
|
74
74
|
|
|
75
75
|
## Where each plugin gets it
|