@pol-cova/gessi 0.0.1 → 0.0.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.
package/AGENTS.md ADDED
@@ -0,0 +1,237 @@
1
+ # Gessi repository guide
2
+
3
+ This file gives coding agents and contributors the context needed to change or
4
+ integrate Gessi without first reverse-engineering the repository.
5
+
6
+ ## Product
7
+
8
+ Gessi is a dependency-free CSS and native Web Component library for expressive
9
+ HTML, retro interfaces, and browser-based desktop environments.
10
+
11
+ The primary usage target is plain HTML:
12
+
13
+ ```html
14
+ <script
15
+ type="module"
16
+ src="https://cdn.jsdelivr.net/npm/@pol-cova/gessi/dist/gessi.js"
17
+ ></script>
18
+ ```
19
+
20
+ The same package supports npm, static-site generators, server-rendered
21
+ templates, and JavaScript frameworks. Do not make a framework runtime required.
22
+
23
+ ## Design principles
24
+
25
+ - Plain HTML is the public API.
26
+ - Keep the runtime dependency-free.
27
+ - Prefer a small semantic component vocabulary over utility-class expansion.
28
+ - Preserve light DOM so content is visible to static output, search engines,
29
+ project CSS, and no-JavaScript fallbacks.
30
+ - Treat interaction as progressive enhancement.
31
+ - Keep imports safe during SSR and static builds.
32
+ - Components must remain useful across every visual system.
33
+ - Responsive behavior should produce readable document flow without separate
34
+ mobile markup.
35
+
36
+ ## Repository map
37
+
38
+ ```txt
39
+ src/gessi.css source stylesheet and all visual systems
40
+ src/components.js native custom elements and interactions
41
+ src/gessi.js CDN entry; registers components and loads sibling CSS
42
+ src/fonts/ bundled font assets and license
43
+
44
+ dist/ published package output; generated from src/
45
+ docs/ custom static documentation source
46
+ examples/ complete HTML examples and visual fixtures
47
+ scripts/ build, verification, preview, and release scripts
48
+ .github/workflows/ package verification and GitHub Pages deployment
49
+ ```
50
+
51
+ `dist` is committed and must always match `src`.
52
+
53
+ ## Public entry points
54
+
55
+ The package exports:
56
+
57
+ ```txt
58
+ @pol-cova/gessi
59
+ @pol-cova/gessi/css
60
+ @pol-cova/gessi/components
61
+ @pol-cova/gessi/gessi.js
62
+ ```
63
+
64
+ - `css` is the stylesheet-only entry.
65
+ - `components` is safe for bundlers and SSR. It does not inject CSS.
66
+ - `gessi.js` is the one-script CDN entry and automatically loads `gessi.css`.
67
+
68
+ ## Visual systems
69
+
70
+ All themes are selected with `data-gs-style` or the `theme` attribute on
71
+ `gessi-desktop`:
72
+
73
+ ```txt
74
+ neo
75
+ minimal
76
+ retro
77
+ old-tech
78
+ classic-os
79
+ ```
80
+
81
+ Theme CSS must stay scoped. A theme must not alter an unrelated page unless the
82
+ page or component explicitly opts into it.
83
+
84
+ ## Component families
85
+
86
+ Environment:
87
+
88
+ ```txt
89
+ gessi-desktop
90
+ gessi-window
91
+ gessi-dialog
92
+ ```
93
+
94
+ Navigation and structure:
95
+
96
+ ```txt
97
+ gessi-menu
98
+ gessi-toolbar
99
+ gessi-dock
100
+ gessi-breadcrumb
101
+ gessi-tabs
102
+ gessi-icons
103
+ gessi-icon
104
+ gessi-tree
105
+ gessi-list
106
+ ```
107
+
108
+ System UI:
109
+
110
+ ```txt
111
+ gessi-panel
112
+ gessi-meter
113
+ gessi-alert
114
+ gessi-toast
115
+ gessi-tooltip
116
+ gessi-separator
117
+ ```
118
+
119
+ Media:
120
+
121
+ ```txt
122
+ gessi-media
123
+ gessi-map
124
+ gessi-marker
125
+ gessi-carousel
126
+ ```
127
+
128
+ Use native links, buttons, lists, images, and headings inside components. Do
129
+ not replace semantic elements with click handlers on generic containers.
130
+
131
+ ## Component implementation rules
132
+
133
+ - Extend the SSR-safe `HTMLElementBase`; never access browser-only globals at
134
+ module evaluation time without a guard.
135
+ - Enhance once by checking `data-enhanced`.
136
+ - Keep content in light DOM; do not introduce Shadow DOM.
137
+ - Generated controls need an accessible name and correct native element.
138
+ - Public methods and events should be small and documented.
139
+ - Clean up global listeners and timers in `disconnectedCallback`.
140
+ - Keep attribute APIs declarative and usable in static templates.
141
+ - Test keyboard behavior for every interactive component.
142
+ - On narrow screens, positioned OS UI must remain readable and reachable.
143
+
144
+ ## CSS rules
145
+
146
+ - Public class names use the `gs-` prefix.
147
+ - Reuse existing layout primitives before adding a new class.
148
+ - Scope theme variants beneath `[data-gs-style="…"]`.
149
+ - Use custom properties for intentional public configuration.
150
+ - Respect `prefers-reduced-motion`.
151
+ - Check high contrast, focus-visible states, overflow, and long content.
152
+ - Media effects should compose and must not mutate the original file.
153
+
154
+ ## Documentation
155
+
156
+ The documentation is intentionally custom and dependency-free. It lives in:
157
+
158
+ ```txt
159
+ docs/index.html
160
+ docs/docs.css
161
+ docs/docs.js
162
+ ```
163
+
164
+ It provides search, copy-ready snippets, live theme previews, component
165
+ reference, media examples, and links to full environments.
166
+
167
+ When changing public API:
168
+
169
+ 1. Update the relevant docs section.
170
+ 2. Add or update a copy-ready example.
171
+ 3. Update an example page when visual interaction is involved.
172
+ 4. Keep the root README short; detailed reference belongs in `docs/`.
173
+
174
+ Build the deployable Pages artifact with:
175
+
176
+ ```bash
177
+ npm run docs:build
178
+ ```
179
+
180
+ The generated `_site/` directory is ignored and must not be committed.
181
+
182
+ ## Development commands
183
+
184
+ ```bash
185
+ npm run build # copy source assets into dist
186
+ npm run check # verify dist parity, imports, docs, and examples
187
+ npm run docs:build # build _site for GitHub Pages
188
+ npm run pack:check # inspect the npm package
189
+ npm run preview # local server on port 4173
190
+ ```
191
+
192
+ Before committing a public change, run:
193
+
194
+ ```bash
195
+ npm run build
196
+ npm run check
197
+ npm run docs:build
198
+ npm pack --dry-run
199
+ git diff --check
200
+ ```
201
+
202
+ For visual changes, verify both desktop and mobile in a browser. Check the
203
+ custom docs and any affected complete example.
204
+
205
+ ## Integration guidance
206
+
207
+ When adding Gessi to another repository:
208
+
209
+ - Use the CDN `gessi.js` entry for plain HTML without a build step.
210
+ - In a bundler, import `@pol-cova/gessi/css` and
211
+ `@pol-cova/gessi/components`.
212
+ - In Astro, import the CSS in frontmatter and components in a browser module
213
+ script; native custom elements do not require a framework hydration
214
+ directive.
215
+ - In SSR code, import `components` normally; registration is browser-guarded.
216
+ - Keep project-specific content layout in ordinary CSS. Gessi owns reusable
217
+ chrome and interaction, not every application grid.
218
+ - Avoid wrapping custom elements in framework components unless the wrapper
219
+ adds project-specific behavior.
220
+
221
+ ## GitHub automation
222
+
223
+ - `verify.yml` builds assets, checks source/output parity, builds docs, and
224
+ validates npm package contents.
225
+ - `pages.yml` builds `_site` and deploys it to GitHub Pages after pushes to
226
+ `main`.
227
+ - Public roadmap work is tracked in GitHub issues instead of repository
228
+ roadmap files.
229
+
230
+ ## Do not
231
+
232
+ - Add Tailwind-style one-purpose class proliferation.
233
+ - Add React, Vue, or another framework as a runtime requirement.
234
+ - Add a build requirement for CDN/plain HTML users.
235
+ - edit only `dist`; make source changes in `src` and rebuild.
236
+ - Commit `_site`, package tarballs, browser QA captures, or temporary files.
237
+ - Break semantic links/actions by replacing them with visual-only elements.
@@ -0,0 +1,41 @@
1
+ # Code of Conduct
2
+
3
+ Gessi follows the Contributor Covenant Code of Conduct.
4
+
5
+ ## Our Pledge
6
+
7
+ We pledge to make participation in this project a respectful, harassment-free
8
+ experience for everyone, regardless of age, body size, disability, ethnicity,
9
+ sex characteristics, gender identity and expression, level of experience,
10
+ education, socio-economic status, nationality, personal appearance, race,
11
+ religion, or sexual identity and orientation.
12
+
13
+ ## Expected Behavior
14
+
15
+ - Use welcoming and inclusive language.
16
+ - Respect different viewpoints and experiences.
17
+ - Accept constructive feedback gracefully.
18
+ - Focus on what is best for the project and its users.
19
+ - Show empathy toward other community members.
20
+
21
+ ## Unacceptable Behavior
22
+
23
+ - Harassment, intimidation, or discrimination.
24
+ - Trolling, insulting comments, or personal attacks.
25
+ - Public or private harassment.
26
+ - Publishing others' private information without explicit permission.
27
+ - Conduct that would reasonably be considered inappropriate in a professional
28
+ setting.
29
+
30
+ ## Enforcement
31
+
32
+ Project maintainers may remove, edit, or reject comments, commits, code, issues,
33
+ and other contributions that do not align with this Code of Conduct. Maintainers
34
+ may also temporarily or permanently ban contributors for behavior they deem
35
+ inappropriate, threatening, offensive, or harmful.
36
+
37
+ ## Reporting
38
+
39
+ Report concerns by opening a private channel with the project maintainer. Reports
40
+ will be reviewed and handled as respectfully and privately as possible.
41
+
@@ -0,0 +1,52 @@
1
+ # Contributing to Gessi
2
+
3
+ Thanks for helping improve Gessi. It is a dependency-free CSS and Web Component
4
+ library built around plain HTML and progressive enhancement.
5
+
6
+ Read [AGENTS.md](AGENTS.md) for the architecture, public API constraints, and
7
+ repository map.
8
+
9
+ ## Development
10
+
11
+ Work from the repository root:
12
+
13
+ ```bash
14
+ npm run build
15
+ npm run check
16
+ npm run docs:build
17
+ ```
18
+
19
+ Preview the documentation and examples:
20
+
21
+ ```bash
22
+ npm run preview
23
+ ```
24
+
25
+ Open `http://localhost:4173/docs/`.
26
+
27
+ ## CSS Guidelines
28
+
29
+ - Keep public class names under the `gs-` prefix.
30
+ - Prefer semantic components and composable primitives over utility-class
31
+ proliferation.
32
+ - Keep style systems scoped through `data-gs-style`.
33
+ - Keep the package usable from a CDN in plain HTML.
34
+ - Preserve light DOM, SSR-safe imports, and no-JavaScript readability.
35
+ - Respect `prefers-reduced-motion` for animations.
36
+
37
+ ## Pull Requests
38
+
39
+ Before opening a pull request:
40
+
41
+ ```bash
42
+ npm run build
43
+ npm run check
44
+ npm run docs:build
45
+ npm pack --dry-run
46
+ ```
47
+
48
+ Include screenshots or a short screen recording for visual changes.
49
+
50
+ ## Releases
51
+
52
+ Releases are published manually to npm. Do not publish from a pull request.
package/README.md CHANGED
@@ -1,33 +1,106 @@
1
1
  # gessi
2
2
 
3
- A tiny style kit for expressive HTML.
3
+ [![npm](https://img.shields.io/npm/v/@pol-cova/gessi?color=15151f&label=npm)](https://www.npmjs.com/package/@pol-cova/gessi)
4
+ [![license](https://img.shields.io/npm/l/@pol-cova/gessi?color=15151f)](LICENSE)
5
+ [![documentation](https://img.shields.io/badge/docs-live-3468e8)](https://pol-cova.github.io/gessi/)
4
6
 
5
- Gessi gives plain HTML a little more rhythm without asking for classes,
6
- components, or build tooling. Drop in the stylesheet and write semantic markup.
7
+ Gessi is a dependency-free CSS and Web Component library for expressive HTML,
8
+ retro interfaces, and browser-based desktop environments.
7
9
 
8
- ## Install
10
+ It works directly in plain HTML from a CDN and also supports npm, static-site
11
+ generators, server-rendered templates, and JavaScript frameworks.
9
12
 
10
- ```bash
11
- npm install @pol-cova/gessi
12
- ```
13
+ [Documentation](https://pol-cova.github.io/gessi/) ·
14
+ [Examples](https://pol-cova.github.io/gessi/examples/) ·
15
+ [npm](https://www.npmjs.com/package/@pol-cova/gessi)
13
16
 
14
- ## CDN
17
+ ## Quick start
15
18
 
16
19
  ```html
17
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@pol-cova/gessi/dist/gessi.css">
20
+ <script
21
+ type="module"
22
+ src="https://cdn.jsdelivr.net/npm/@pol-cova/gessi/dist/gessi.js"
23
+ ></script>
24
+
25
+ <gessi-desktop menu="◆ My OS,File,View,Help" clock="09:41">
26
+ <gessi-window title="hello.html" width="38rem" active draggable>
27
+ <h1>One script, plain HTML</h1>
28
+ <p>No package manager, bundler, or framework required.</p>
29
+ </gessi-window>
30
+ </gessi-desktop>
18
31
  ```
19
32
 
33
+ The script registers the components and loads the stylesheet. For the earliest
34
+ styled paint, include the CSS separately:
35
+
20
36
  ```html
21
- <link rel="stylesheet" href="https://unpkg.com/@pol-cova/gessi/dist/gessi.css">
37
+ <link
38
+ rel="stylesheet"
39
+ href="https://cdn.jsdelivr.net/npm/@pol-cova/gessi/dist/gessi.css"
40
+ data-gessi-styles
41
+ >
22
42
  ```
23
43
 
24
- ## Local usage
44
+ ## Install
45
+
46
+ ```bash
47
+ npm install @pol-cova/gessi
48
+ ```
25
49
 
26
- ```html
27
- <link rel="stylesheet" href="./dist/gessi.css">
50
+ ```js
51
+ import "@pol-cova/gessi/css";
52
+ import "@pol-cova/gessi/components";
28
53
  ```
29
54
 
55
+ ## What is included
56
+
57
+ - Five visual systems: `neo`, `minimal`, `retro`, `old-tech`, and `classic-os`.
58
+ - Desktop environments, draggable windows, nested windows, and dialogs.
59
+ - Menus, toolbars, docks, breadcrumbs, tabs, trees, icons, and notifications.
60
+ - Maps, markers, carousels, and composable image effects.
61
+ - Responsive behavior that converts desktop layouts into readable mobile flow.
62
+ - Light DOM, progressive enhancement, SSR-safe imports, and zero dependencies.
63
+ - CSS primitives for cards, buttons, forms, layouts, badges, and content pages.
64
+
65
+ The complete component API, attributes, keyboard controls, effects, and
66
+ copy-ready recipes are available in the
67
+ [interactive documentation](https://pol-cova.github.io/gessi/).
68
+
69
+ ## Examples
70
+
71
+ - [Product OS](https://pol-cova.github.io/gessi/examples/product-os.html)
72
+ - [Classic OS](https://pol-cova.github.io/gessi/examples/classic-os.html)
73
+ - [Media OS](https://pol-cova.github.io/gessi/examples/media-os.html)
74
+ - [Plain HTML](https://pol-cova.github.io/gessi/examples/standalone.html)
75
+ - [CSS-only fallback](https://pol-cova.github.io/gessi/examples/no-js.html)
76
+
30
77
  ## Development
31
78
 
32
- The source file lives at `src/gessi.css`. The published CSS is copied to
33
- `dist/gessi.css`.
79
+ ```bash
80
+ npm run build
81
+ npm run check
82
+ npm run docs:build
83
+ npm run preview
84
+ ```
85
+
86
+ Open `http://localhost:4173/docs/`.
87
+
88
+ Source:
89
+
90
+ ```txt
91
+ src/gessi.css
92
+ src/components.js
93
+ src/gessi.js
94
+ ```
95
+
96
+ `npm run build` copies the public assets into `dist`. Pushes to `main` verify
97
+ the package and deploy the documentation site to GitHub Pages.
98
+
99
+ ## Contributing
100
+
101
+ Issues and pull requests are welcome. Read [CONTRIBUTING.md](CONTRIBUTING.md)
102
+ before proposing public API changes.
103
+
104
+ ## License
105
+
106
+ MIT. Departure Mono is included under its own MIT license.
package/SECURITY.md ADDED
@@ -0,0 +1,20 @@
1
+ # Security Policy
2
+
3
+ ## Supported Versions
4
+
5
+ Gessi is early-stage. Security fixes target the latest published version.
6
+
7
+ ## Reporting a Vulnerability
8
+
9
+ If you find a security issue, please do not open a public issue with exploit
10
+ details.
11
+
12
+ Instead, contact the maintainer privately through GitHub or npm. Include:
13
+
14
+ - A short description of the issue.
15
+ - Steps to reproduce it.
16
+ - Any affected versions or CDN URLs.
17
+ - Suggested fixes, if you have them.
18
+
19
+ The maintainer will review the report and respond as soon as possible.
20
+