elder_docs 0.1.2 → 0.1.4
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.
- checksums.yaml +4 -4
- data/README.md +43 -0
- data/frontend/index.html +18 -0
- data/frontend/package.json +28 -0
- data/frontend/postcss.config.js +7 -0
- data/frontend/public/data.js +2 -0
- data/frontend/src/App.jsx +170 -0
- data/frontend/src/UiConfigApp.jsx +11 -0
- data/frontend/src/components/ApiExplorer.jsx +323 -0
- data/frontend/src/components/ContentPanel.jsx +228 -0
- data/frontend/src/components/Sidebar.jsx +157 -0
- data/frontend/src/components/UiConfigurator.jsx +494 -0
- data/frontend/src/contexts/ApiKeyContext.jsx +41 -0
- data/frontend/src/index.css +215 -0
- data/frontend/src/main.jsx +11 -0
- data/frontend/tailwind.config.js +40 -0
- data/frontend/vite.config.js +17 -0
- data/lib/elder_docs/generator.rb +19 -3
- data/lib/elder_docs/version.rb +1 -1
- metadata +18 -3
|
@@ -0,0 +1,215 @@
|
|
|
1
|
+
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600&family=Inter:wght@400;600;800&family=Space+Grotesk:wght@400;600;700&family=Oswald:wght@400;600;700&family=Fira+Code:wght@400;600&family=Roboto:wght@400;500;700&family=Open+Sans:wght@400;600;700&display=swap');
|
|
2
|
+
|
|
3
|
+
@tailwind base;
|
|
4
|
+
@tailwind components;
|
|
5
|
+
@tailwind utilities;
|
|
6
|
+
|
|
7
|
+
@layer base {
|
|
8
|
+
:root {
|
|
9
|
+
--bd-yellow: #f8d447;
|
|
10
|
+
--bd-charcoal: #000000;
|
|
11
|
+
--bd-ink: #121212;
|
|
12
|
+
--bd-white: #ffffff;
|
|
13
|
+
--bd-muted: #666666;
|
|
14
|
+
--bd-panel: #ffffff;
|
|
15
|
+
--bd-border: #000000;
|
|
16
|
+
|
|
17
|
+
--bd-radius: 0px;
|
|
18
|
+
--font-heading: 'Syne';
|
|
19
|
+
--font-body: 'IBM Plex Sans';
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
* {
|
|
23
|
+
border-width: 0;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
body {
|
|
27
|
+
font-family: var(--font-body), system-ui, -apple-system, BlinkMacSystemFont;
|
|
28
|
+
font-size: 15px;
|
|
29
|
+
line-height: 1.55;
|
|
30
|
+
color: var(--bd-ink);
|
|
31
|
+
background: var(--bd-white);
|
|
32
|
+
min-height: 100vh;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
body::before {
|
|
36
|
+
display: none;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
body::after {
|
|
40
|
+
display: none;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
body[data-mounted='true'] .reveal {
|
|
44
|
+
opacity: 1;
|
|
45
|
+
transform: translateY(0) scale(1);
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
@layer components {
|
|
50
|
+
.app-shell {
|
|
51
|
+
position: relative;
|
|
52
|
+
z-index: 1;
|
|
53
|
+
width: 100%;
|
|
54
|
+
height: 100%;
|
|
55
|
+
display: flex;
|
|
56
|
+
background: #ffffff;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.surface {
|
|
60
|
+
background: var(--bd-panel);
|
|
61
|
+
border: 3px solid var(--bd-border);
|
|
62
|
+
box-shadow: 8px 8px 0px 0px var(--bd-border);
|
|
63
|
+
border-radius: var(--bd-radius);
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
.surface--glass {
|
|
67
|
+
backdrop-filter: none;
|
|
68
|
+
background: var(--bd-panel);
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
.surface--highlight {
|
|
72
|
+
border-color: var(--bd-border);
|
|
73
|
+
box-shadow: 4px 4px 0px 0px var(--bd-yellow);
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.pill {
|
|
77
|
+
font-family: var(--font-heading), system-ui;
|
|
78
|
+
letter-spacing: 0.1em;
|
|
79
|
+
font-size: 0.7rem;
|
|
80
|
+
text-transform: uppercase;
|
|
81
|
+
border: 2px solid var(--bd-border);
|
|
82
|
+
padding: 0.35rem 1rem;
|
|
83
|
+
border-radius: var(--bd-radius);
|
|
84
|
+
font-weight: 700;
|
|
85
|
+
color: var(--bd-charcoal);
|
|
86
|
+
background: var(--bd-yellow);
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
.chip {
|
|
90
|
+
display: inline-flex;
|
|
91
|
+
align-items: center;
|
|
92
|
+
gap: 0.25rem;
|
|
93
|
+
font-size: 0.7rem;
|
|
94
|
+
text-transform: uppercase;
|
|
95
|
+
letter-spacing: 0.1em;
|
|
96
|
+
padding: 0.3rem 0.9rem;
|
|
97
|
+
border-radius: var(--bd-radius);
|
|
98
|
+
border: 2px solid var(--bd-border);
|
|
99
|
+
font-weight: 700;
|
|
100
|
+
background: var(--bd-panel);
|
|
101
|
+
color: var(--bd-ink);
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
.btn-primary {
|
|
105
|
+
font-family: var(--font-heading), system-ui;
|
|
106
|
+
text-transform: uppercase;
|
|
107
|
+
letter-spacing: 0.1em;
|
|
108
|
+
font-size: 0.8rem;
|
|
109
|
+
background: var(--bd-charcoal);
|
|
110
|
+
color: var(--bd-white);
|
|
111
|
+
padding: 0.85rem 1.6rem;
|
|
112
|
+
border: 3px solid var(--bd-border);
|
|
113
|
+
border-radius: var(--bd-radius);
|
|
114
|
+
transition: transform 0.1s ease, box-shadow 0.1s ease;
|
|
115
|
+
font-weight: 700;
|
|
116
|
+
box-shadow: 4px 4px 0px 0px var(--bd-yellow);
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
.btn-primary:hover {
|
|
120
|
+
transform: translate(-2px, -2px);
|
|
121
|
+
box-shadow: 6px 6px 0px 0px var(--bd-yellow);
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
.btn-primary:active {
|
|
125
|
+
transform: translate(2px, 2px);
|
|
126
|
+
box-shadow: 0px 0px 0px 0px var(--bd-yellow);
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
.btn-secondary {
|
|
130
|
+
font-family: var(--font-heading), system-ui;
|
|
131
|
+
text-transform: uppercase;
|
|
132
|
+
letter-spacing: 0.1em;
|
|
133
|
+
font-size: 0.7rem;
|
|
134
|
+
background: var(--bd-panel);
|
|
135
|
+
color: var(--bd-ink);
|
|
136
|
+
padding: 0.75rem 1.3rem;
|
|
137
|
+
border: 2px solid var(--bd-border);
|
|
138
|
+
border-radius: var(--bd-radius);
|
|
139
|
+
transition: transform 0.1s ease;
|
|
140
|
+
font-weight: 700;
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
.btn-secondary:hover {
|
|
144
|
+
background: var(--bd-yellow);
|
|
145
|
+
color: var(--bd-charcoal);
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
.input-field {
|
|
149
|
+
background: var(--bd-panel);
|
|
150
|
+
border: 3px solid var(--bd-border);
|
|
151
|
+
color: var(--bd-ink);
|
|
152
|
+
border-radius: var(--bd-radius);
|
|
153
|
+
padding: 0.65rem 0.9rem;
|
|
154
|
+
transition: box-shadow 0.1s ease;
|
|
155
|
+
font-weight: 500;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
.input-field:focus {
|
|
159
|
+
outline: none;
|
|
160
|
+
box-shadow: 4px 4px 0px 0px var(--bd-yellow);
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
.nav-card {
|
|
164
|
+
border-radius: var(--bd-radius);
|
|
165
|
+
border: 2px solid transparent;
|
|
166
|
+
background: transparent;
|
|
167
|
+
transition: transform 0.1s ease;
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
.nav-card:hover {
|
|
171
|
+
background: var(--bd-panel);
|
|
172
|
+
border: 2px solid var(--bd-border);
|
|
173
|
+
transform: translate(-2px, -2px);
|
|
174
|
+
box-shadow: 4px 4px 0px 0px var(--bd-charcoal);
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
.nav-card--active {
|
|
178
|
+
background: var(--bd-yellow);
|
|
179
|
+
border: 2px solid var(--bd-border);
|
|
180
|
+
color: var(--bd-charcoal);
|
|
181
|
+
box-shadow: 4px 4px 0px 0px var(--bd-charcoal);
|
|
182
|
+
transform: translate(-2px, -2px);
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
.reveal {
|
|
186
|
+
opacity: 0;
|
|
187
|
+
transform: translateY(15px);
|
|
188
|
+
transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1), transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
|
|
189
|
+
}
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
@keyframes floatGlow {
|
|
193
|
+
0% {
|
|
194
|
+
transform: translateY(0px);
|
|
195
|
+
opacity: 0.5;
|
|
196
|
+
}
|
|
197
|
+
50% {
|
|
198
|
+
transform: translateY(-12px);
|
|
199
|
+
opacity: 1;
|
|
200
|
+
}
|
|
201
|
+
100% {
|
|
202
|
+
transform: translateY(0px);
|
|
203
|
+
opacity: 0.5;
|
|
204
|
+
}
|
|
205
|
+
}
|
|
206
|
+
|
|
207
|
+
@keyframes shimmer {
|
|
208
|
+
0% {
|
|
209
|
+
background-position: 0% 50%;
|
|
210
|
+
}
|
|
211
|
+
100% {
|
|
212
|
+
background-position: 200% 50%;
|
|
213
|
+
}
|
|
214
|
+
}
|
|
215
|
+
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
/** @type {import('tailwindcss').Config} */
|
|
2
|
+
export default {
|
|
3
|
+
content: [
|
|
4
|
+
"./index.html",
|
|
5
|
+
"./src/**/*.{js,ts,jsx,tsx}",
|
|
6
|
+
],
|
|
7
|
+
theme: {
|
|
8
|
+
extend: {
|
|
9
|
+
fontFamily: {
|
|
10
|
+
sans: ['Inter', 'system-ui', 'sans-serif'],
|
|
11
|
+
},
|
|
12
|
+
fontSize: {
|
|
13
|
+
'xs': '16px',
|
|
14
|
+
'sm': '18px',
|
|
15
|
+
'base': '20px',
|
|
16
|
+
'lg': '24px',
|
|
17
|
+
'xl': '28px',
|
|
18
|
+
'2xl': '32px',
|
|
19
|
+
'3xl': '40px',
|
|
20
|
+
'4xl': '48px',
|
|
21
|
+
},
|
|
22
|
+
colors: {
|
|
23
|
+
'yellow': {
|
|
24
|
+
50: '#FFFBEB',
|
|
25
|
+
100: '#FEF3C7',
|
|
26
|
+
200: '#FDE68A',
|
|
27
|
+
300: '#FCD34D',
|
|
28
|
+
400: '#FBBF24',
|
|
29
|
+
500: '#F59E0B',
|
|
30
|
+
600: '#D97706',
|
|
31
|
+
}
|
|
32
|
+
},
|
|
33
|
+
borderRadius: {
|
|
34
|
+
'none': '0',
|
|
35
|
+
}
|
|
36
|
+
},
|
|
37
|
+
},
|
|
38
|
+
plugins: [],
|
|
39
|
+
}
|
|
40
|
+
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { defineConfig } from 'vite'
|
|
2
|
+
import react from '@vitejs/plugin-react'
|
|
3
|
+
|
|
4
|
+
export default defineConfig({
|
|
5
|
+
plugins: [react()],
|
|
6
|
+
build: {
|
|
7
|
+
outDir: 'dist',
|
|
8
|
+
assetsDir: 'assets',
|
|
9
|
+
rollupOptions: {
|
|
10
|
+
output: {
|
|
11
|
+
manualChunks: undefined
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
base: './'
|
|
16
|
+
})
|
|
17
|
+
|
data/lib/elder_docs/generator.rb
CHANGED
|
@@ -185,12 +185,28 @@ module ElderDocs
|
|
|
185
185
|
def build_frontend!
|
|
186
186
|
say '🔨 Building frontend...', :cyan
|
|
187
187
|
|
|
188
|
-
|
|
188
|
+
# Try multiple locations for frontend directory
|
|
189
|
+
# 1. Relative to lib (development repo)
|
|
190
|
+
# 2. At gem root (installed gem)
|
|
191
|
+
# 3. Using Engine.root if available (Rails context)
|
|
192
|
+
possible_paths = [
|
|
193
|
+
File.join(File.dirname(__FILE__), '..', '..', 'frontend'), # Development: lib/elder_docs/../../frontend
|
|
194
|
+
File.join(File.dirname(__FILE__), '..', '..', '..', 'frontend'), # Installed gem: lib/elder_docs/../../../frontend
|
|
195
|
+
]
|
|
189
196
|
|
|
190
|
-
|
|
191
|
-
|
|
197
|
+
# If Engine is available, try relative to gem root
|
|
198
|
+
if defined?(ElderDocs::Engine) && ElderDocs::Engine.root
|
|
199
|
+
possible_paths << ElderDocs::Engine.root.join('frontend').to_s
|
|
192
200
|
end
|
|
193
201
|
|
|
202
|
+
frontend_dir = possible_paths.find { |path| Dir.exist?(path) }
|
|
203
|
+
|
|
204
|
+
unless frontend_dir && Dir.exist?(frontend_dir)
|
|
205
|
+
raise ValidationError, "Frontend directory not found. Tried: #{possible_paths.join(', ')}"
|
|
206
|
+
end
|
|
207
|
+
|
|
208
|
+
frontend_dir = File.expand_path(frontend_dir)
|
|
209
|
+
|
|
194
210
|
# Write compiled data to frontend public directory
|
|
195
211
|
public_dir = File.join(frontend_dir, 'public')
|
|
196
212
|
FileUtils.mkdir_p(public_dir)
|
data/lib/elder_docs/version.rb
CHANGED
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: elder_docs
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.1.
|
|
4
|
+
version: 0.1.4
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- ElderDocs
|
|
@@ -30,14 +30,14 @@ dependencies:
|
|
|
30
30
|
requirements:
|
|
31
31
|
- - "~>"
|
|
32
32
|
- !ruby/object:Gem::Version
|
|
33
|
-
version: '
|
|
33
|
+
version: '2.0'
|
|
34
34
|
type: :runtime
|
|
35
35
|
prerelease: false
|
|
36
36
|
version_requirements: !ruby/object:Gem::Requirement
|
|
37
37
|
requirements:
|
|
38
38
|
- - "~>"
|
|
39
39
|
- !ruby/object:Gem::Version
|
|
40
|
-
version: '
|
|
40
|
+
version: '2.0'
|
|
41
41
|
- !ruby/object:Gem::Dependency
|
|
42
42
|
name: rails
|
|
43
43
|
requirement: !ruby/object:Gem::Requirement
|
|
@@ -107,6 +107,21 @@ files:
|
|
|
107
107
|
- README.md
|
|
108
108
|
- elderdocs.yml.example
|
|
109
109
|
- exe/elderdocs
|
|
110
|
+
- frontend/index.html
|
|
111
|
+
- frontend/package.json
|
|
112
|
+
- frontend/postcss.config.js
|
|
113
|
+
- frontend/public/data.js
|
|
114
|
+
- frontend/src/App.jsx
|
|
115
|
+
- frontend/src/UiConfigApp.jsx
|
|
116
|
+
- frontend/src/components/ApiExplorer.jsx
|
|
117
|
+
- frontend/src/components/ContentPanel.jsx
|
|
118
|
+
- frontend/src/components/Sidebar.jsx
|
|
119
|
+
- frontend/src/components/UiConfigurator.jsx
|
|
120
|
+
- frontend/src/contexts/ApiKeyContext.jsx
|
|
121
|
+
- frontend/src/index.css
|
|
122
|
+
- frontend/src/main.jsx
|
|
123
|
+
- frontend/tailwind.config.js
|
|
124
|
+
- frontend/vite.config.js
|
|
110
125
|
- lib/elder_docs.rb
|
|
111
126
|
- lib/elder_docs/assets/ui_config.html
|
|
112
127
|
- lib/elder_docs/assets/viewer/assets/index-161b367b.css
|