layered-ui-rails 0.1.1 → 0.1.2
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/AGENTS.md +34 -1
- data/CHANGELOG.md +29 -0
- data/README.md +7 -5
- data/app/assets/images/layered_ui/icon_chevron_down.svg +3 -0
- data/app/assets/images/layered_ui/icon_chevron_right.svg +3 -0
- data/app/assets/images/layered_ui/icon_close.svg +3 -0
- data/app/assets/images/layered_ui/icon_hamburger.svg +3 -0
- data/app/assets/images/layered_ui/icon_moon.svg +3 -0
- data/app/assets/images/layered_ui/icon_sun.svg +3 -0
- data/app/assets/tailwind/layered/ui/styles.css +367 -78
- data/app/javascript/layered_ui/controllers/l_ui/mobile_navigation_controller.js +75 -15
- data/app/javascript/layered_ui/controllers/l_ui/modal_controller.js +6 -28
- data/app/javascript/layered_ui/controllers/l_ui/panel_button_controller.js +361 -0
- data/app/javascript/layered_ui/controllers/l_ui/panel_controller.js +52 -212
- data/app/javascript/layered_ui/controllers/l_ui/panel_resize_controller.js +172 -0
- data/app/javascript/layered_ui/controllers/l_ui/tabs_controller.js +9 -15
- data/app/javascript/layered_ui/controllers/l_ui/theme_controller.js +6 -18
- data/app/javascript/layered_ui/index.js +4 -0
- data/app/javascript/layered_ui/utilities/announce.js +14 -0
- data/app/javascript/layered_ui/utilities/layout.js +21 -0
- data/app/javascript/layered_ui/utilities/storage.js +18 -0
- data/app/views/layered_ui/shared/_field_error.html.erb +11 -5
- data/app/views/layered_ui/shared/_form_errors.html.erb +1 -1
- data/app/views/layouts/layered_ui/_header.html.erb +10 -66
- data/app/views/layouts/layered_ui/_navigation.html.erb +1 -1
- data/app/views/layouts/layered_ui/_panel.html.erb +14 -9
- data/app/views/layouts/layered_ui/application.html.erb +1 -1
- data/config/importmap.rb +11 -2
- data/lib/generators/layered/ui/create_overrides_generator.rb +2 -0
- data/lib/layered/ui/version.rb +1 -1
- metadata +13 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: fe1154d1875a81940b409ffb0e923946c22ae9f7cf59aa9ab0d46512d5966662
|
|
4
|
+
data.tar.gz: a21bee7115c594e4ef9add2e357daa0b56730067594a628ff44d80bb63d74778
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 984d5fc4224b7a2bfa1ff81ff63168ea95aa7f3dd7d643fb536eeca17f1de9656b17944af354846cbf8b6063c1ea7788eee91dfb9995b6ee9081ddb88662c6ce
|
|
7
|
+
data.tar.gz: 28646db923197efe733f2af98a2e10ea8be238f0c7b409d3f85be8c032d445257cb0a252b962b420771dce2d3f8c6e306494f12193a6ad5bc83c95656d5c5c8d
|
data/AGENTS.md
CHANGED
|
@@ -29,5 +29,38 @@ Guidance for AI agents working in this repository.
|
|
|
29
29
|
- Document new styles in the dummy app
|
|
30
30
|
- Use l-ui classes only in engine views, with no additional Tailwind utilities, as Tailwind classes referenced only inside the engine will not be generated by the host app’s build
|
|
31
31
|
- Dummy app documentation pages may use additional Tailwind utilities, but should favour l-ui classes where possible
|
|
32
|
-
- Retain WCAG 2.2 AA compliance
|
|
33
32
|
- Importmap for JS (no bundler)
|
|
33
|
+
|
|
34
|
+
- CRITICAL: Retain WCAG 2.2 AA compliance. Do not be too pedantic though as this introduces audit loops which are undesirable.
|
|
35
|
+
- A WCAG 2.2 AA table looks like this:
|
|
36
|
+
```
|
|
37
|
+
<table>
|
|
38
|
+
<caption>Agent availability by region</caption>
|
|
39
|
+
|
|
40
|
+
<thead>
|
|
41
|
+
<tr>
|
|
42
|
+
<th scope="col">Agent</th>
|
|
43
|
+
<th scope="col">Region</th>
|
|
44
|
+
<th scope="col">Status</th>
|
|
45
|
+
</tr>
|
|
46
|
+
</thead>
|
|
47
|
+
|
|
48
|
+
<tbody>
|
|
49
|
+
<tr>
|
|
50
|
+
<th scope="row">Agent A</th>
|
|
51
|
+
<td>UK</td>
|
|
52
|
+
<td>Available</td>
|
|
53
|
+
</tr>
|
|
54
|
+
<tr>
|
|
55
|
+
<th scope="row">Agent B</th>
|
|
56
|
+
<td>EU</td>
|
|
57
|
+
<td>Busy</td>
|
|
58
|
+
</tr>
|
|
59
|
+
<tr>
|
|
60
|
+
<th scope="row">Agent C</th>
|
|
61
|
+
<td>US</td>
|
|
62
|
+
<td>Offline</td>
|
|
63
|
+
</tr>
|
|
64
|
+
</tbody>
|
|
65
|
+
</table>
|
|
66
|
+
```
|
data/CHANGELOG.md
CHANGED
|
@@ -4,6 +4,35 @@ All notable changes to this project will be documented in this file. This projec
|
|
|
4
4
|
|
|
5
5
|
## [Unreleased]
|
|
6
6
|
|
|
7
|
+
## [0.1.2] - 2026-02-27
|
|
8
|
+
|
|
9
|
+
### Added
|
|
10
|
+
|
|
11
|
+
- Conversation component with markdown support, typing indicators, and token fade-in animation
|
|
12
|
+
- Scroll-to-bottom button in conversations
|
|
13
|
+
- Movable panel toggle button with drag-and-drop repositioning
|
|
14
|
+
- Link utility class
|
|
15
|
+
- Form field utility class
|
|
16
|
+
|
|
17
|
+
### Changed
|
|
18
|
+
|
|
19
|
+
- Improved message styles and spacing
|
|
20
|
+
- Better table header and secondary nav styling
|
|
21
|
+
- Improved WCAG 2.2 AA compliance across components
|
|
22
|
+
- Switch track unchecked state uses neutral colour instead of danger
|
|
23
|
+
- Extracted shared JavaScript into utility modules (announce, layout, storage)
|
|
24
|
+
- Extracted inline SVG icons (close, moon, sun, hamburger, chevron right) into engine assets
|
|
25
|
+
- Rebuilt CSS from engine source every 5 seconds in development
|
|
26
|
+
|
|
27
|
+
### Fixed
|
|
28
|
+
|
|
29
|
+
- Use `main_app` Devise routes in engine views
|
|
30
|
+
- Overflow on code blocks, surfaces, and markdown tables
|
|
31
|
+
- Margins on small screens when vertically centred
|
|
32
|
+
- Select element styling
|
|
33
|
+
- Tabs controller issue
|
|
34
|
+
- Odd scrolling behaviour
|
|
35
|
+
|
|
7
36
|
## [0.1.1] - 2026-02-17
|
|
8
37
|
|
|
9
38
|
### Added
|
data/README.md
CHANGED
|
@@ -9,13 +9,13 @@ An open source, Rails 8+ engine that provides WCAG 2.2 AA compliant design token
|
|
|
9
9
|
<table align="center">
|
|
10
10
|
<tr>
|
|
11
11
|
<td align="center">
|
|
12
|
-
<img src="test/dummy/app/assets/images/light_desktop.webp" alt="Light theme (desktop)" height="300">
|
|
13
|
-
<img src="test/dummy/app/assets/images/light_mobile.webp" alt="Light theme (mobile)" height="300">
|
|
12
|
+
<img src="https://github.com/layered-ai-public/layered-ui-rails/raw/refs/heads/main/test/dummy/app/assets/images/light_desktop.webp" alt="Light theme (desktop)" height="300">
|
|
13
|
+
<img src="https://github.com/layered-ai-public/layered-ui-rails/raw/refs/heads/main/test/dummy/app/assets/images/light_mobile.webp" alt="Light theme (mobile)" height="300">
|
|
14
14
|
</td>
|
|
15
15
|
<td width="20"></td>
|
|
16
16
|
<td align="center">
|
|
17
|
-
<img src="test/dummy/app/assets/images/dark_desktop.webp" alt="Dark theme (desktop)" height="300">
|
|
18
|
-
<img src="test/dummy/app/assets/images/dark_mobile.webp" alt="Dark theme (mobile)" height="300">
|
|
17
|
+
<img src="https://github.com/layered-ai-public/layered-ui-rails/raw/refs/heads/main/test/dummy/app/assets/images/dark_desktop.webp" alt="Dark theme (desktop)" height="300">
|
|
18
|
+
<img src="https://github.com/layered-ai-public/layered-ui-rails/raw/refs/heads/main/test/dummy/app/assets/images/dark_mobile.webp" alt="Dark theme (mobile)" height="300">
|
|
19
19
|
</td>
|
|
20
20
|
</tr>
|
|
21
21
|
<tr>
|
|
@@ -60,12 +60,14 @@ Then update your application layout to render the engine layout:
|
|
|
60
60
|
- **Components** - buttons, forms, surfaces, tables, tabs, notices, badges, conversations, modals, and pagination
|
|
61
61
|
- **Optional integrations** - Devise authentication and Pagy pagination with styled views
|
|
62
62
|
- **Customisable branding** - Override the default logos and icons and colors
|
|
63
|
-
- **Google Lighthouse** - `layered-ui-rails` scores a [perfect 100](test/dummy/app/assets/images/lighthouse.webp) across all four Google Lighthouse categories - performance, accessibility, best practices, and SEO
|
|
63
|
+
- **Google Lighthouse** - `layered-ui-rails` scores a [perfect 100](https://github.com/layered-ai-public/layered-ui-rails/raw/refs/heads/main/test/dummy/app/assets/images/lighthouse.webp) across all four Google Lighthouse categories - performance, accessibility, best practices, and SEO
|
|
64
64
|
|
|
65
65
|
## Documentation
|
|
66
66
|
|
|
67
67
|
An online version of the documentation is available at **[layered-ui-rails.layered.ai](https://layered-ui-rails.layered.ai)**.
|
|
68
68
|
|
|
69
|
+
The latest accessibility audit is available at **[audits/accessibility/codex-5_3.md](https://github.com/layered-ai-public/layered-ui-rails/blob/main/audits/accessibility/codex-5_3.md)**.
|
|
70
|
+
|
|
69
71
|
You can also run the included dummy app locally for development and testing:
|
|
70
72
|
|
|
71
73
|
```bash
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
<svg fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z" />
|
|
3
|
+
</svg>
|