@oneli8/core 1.0.0-beta.6 → 1.0.0-beta.8

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.
Files changed (3) hide show
  1. package/README.md +44 -28
  2. package/ai-context.json +3 -3
  3. package/package.json +2 -2
package/README.md CHANGED
@@ -1,51 +1,67 @@
1
1
  # @oneli8/core
2
2
 
3
- OneLi8 Design System, framework agnostic components.
3
+ [![npm](https://img.shields.io/npm/v/@oneli8/core?color=2c438b&label=npm)](https://www.npmjs.com/package/@oneli8/core)
4
+ [![licence](https://img.shields.io/npm/l/@oneli8/core?color=2c438b)](https://github.com/Akshay007ad/OneLi8-Design-System/blob/main/LICENSE)
4
5
 
5
- Every component is two functions: `renderX(...)` returns an HTML **string**, and
6
- `hydrateX(root)` enforces the runtime contract on markup that already exists.
7
- There is no framework dependency, no virtual DOM and no build step.
6
+ **OneLi8 means One Light.**
7
+
8
+ A design system created by Akshay Dhore, intended for broad human benefit and
9
+ conceived as service to Guruji Shrii Arnav, whose teachings inspire it. Service,
10
+ clarity, harmony, proportion, restraint and evolution guide its decisions.
11
+
12
+ The practical intention is narrower and easier to check. Most design systems
13
+ hand you components and hope you stay inside them. This one hands you the
14
+ reasoning as well, so when you need something it does not ship, you can build it
15
+ and have it still belong. The rules travel inside this package, not in a wiki
16
+ someone forgets to read.
17
+
18
+ This is the framework free build. It runs anywhere HTML is produced as a string:
19
+ Rails, Django, Laravel, Astro, Eleventy, a CMS theme, or hand written markup.
8
20
 
9
21
  ```sh
10
22
  npm install @oneli8/core
11
23
  ```
12
24
 
13
25
  ```js
14
- import { renderButton, hydrateButtons } from '@oneli8/core';
26
+ import { renderMultiSelectField, hydrateMultiSelectFields } from '@oneli8/core';
15
27
  import '@oneli8/core/styles.css';
16
28
 
17
- document.querySelector('#toolbar').innerHTML = renderButton('Save', {
18
- variant: 'primary',
19
- leadingIcon: 'add',
29
+ element.innerHTML = renderMultiSelectField({
30
+ label: 'Skills',
31
+ options: skills,
32
+ values: chosen,
33
+ placeholder: 'Add skill…',
20
34
  });
21
-
22
- hydrateButtons();
35
+ hydrateMultiSelectFields();
23
36
  ```
24
37
 
38
+ `render*` returns markup. `hydrate*` wires up only what markup genuinely cannot
39
+ express. Both halves produce the same DOM as `@oneli8/react`, checked on every
40
+ build.
41
+
25
42
  ## What is included
26
43
 
27
- | Tier | Component |
28
- |---|---|
29
- | Atom | `Icon`, `Selection Indicator` (checkbox, radio, switch), `Navigation Badge` |
30
- | Molecule | `Button`, `Icon Button`, `Link`, `Text Field`, `Form Message`, `Select`, `Choice Item`, `Selection Option`, `Choice Chip`, `Token` |
31
- | Organism | `Tabs`, `Tab Bar`, `Segmented Control`, `Choice Group`, `Selection Popup`, `Combobox`, `Multi-select Field`, `Choice Picker` |
32
- | Material | `Gem`, an attribute adapter, not a tier |
44
+ Twenty one components, every one of them drawn from a component set in the Figma
45
+ source rather than invented here. Anything not listed is not exported. Tokens
46
+ exist for families whose implementations are not in this release; a token is not
47
+ a promise of a component.
33
48
 
34
- Twenty one components, every one of them drawn from a component set in the
35
- Figma file rather than invented here. Anything not listed is not exported.
36
- Tokens exist for families whose implementations are not in this release; a token
37
- is not a promise of a component.
49
+ **Atoms** · `Icon` · `Selection Indicator` (checkbox, radio, switch)
50
+ · `Navigation Badge`
38
51
 
39
- ## Why this exists
52
+ **Molecules** · `Button` · `Icon Button` · `Link` · `Text Field` · `Form Message`
53
+ · `Select` · `Choice Item` · `Selection Option` · `Choice Chip` · `Token`
54
+
55
+ **Organisms** · `Tabs` · `Tab Bar` · `Segmented Control` · `Choice Group`
56
+ · `Selection Popup` · `Combobox` · `Multi-select Field` · `Choice Picker`
40
57
 
41
- OneLi8 means One Light. It was created by Akshay Dhore, intended for broad human
42
- benefit and conceived as service to Guruji Shrii Arnav, whose teachings inspire
43
- it. Service, clarity, harmony, proportion, restraint and evolution guide its
44
- decisions. `PRINCIPLES.md` ships inside this package and sets them out in full.
58
+ **Material** · `Gem`, an attribute adapter, not a tier
59
+
60
+ ## Why this exists
45
61
 
46
- The practical intention: most design systems hand you components and hope you
47
- stay inside them. This one hands you the reasoning too, so when you need
48
- something it does not ship you can build it and have it still belong.
62
+ `PRINCIPLES.md` ships inside this package and sets out the six values in full,
63
+ along with the three operating laws every component obeys. It is the document to
64
+ read before extending anything.
49
65
 
50
66
  ## Naming
51
67
 
package/ai-context.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$comment": "GENERATED by packages/sync/src/build-package-context.mjs — do not edit.",
3
3
  "system": "OneLi8",
4
- "version": "1.0.0-beta.6",
4
+ "version": "1.0.0-beta.8",
5
5
  "meaning": "OneLi8 means One Light.",
6
6
  "foundations": {
7
7
  "package": "@oneli8/tokens",
@@ -13,7 +13,7 @@
13
13
  "color-primary-* is an alias ramp onto color-blue-* — identical values, distinct names. Prefer the semantic role over either.",
14
14
  "Dimension scale is 3px-atomic. Even multiples for structural layout; odd multiples are deliberate optical or micro-gap choices.",
15
15
  "Elevation ink is cyan-840 rgb(22,63,75) — never default black.",
16
- "Typography roles are composite. Use the .ol8-type-<role> class, not the individual font vars.",
16
+ "Typography roles are composite. Apply a whole role, all five of --ol8-typography-<role>-{font-family,font-size,font-weight,line-height,letter-spacing}, rather than picking loose font vars. This package ships custom properties and no class names.",
17
17
  "shape-radius-full (999px) is reserved for pills and circles. Soft hexagons are component-specific recipes, not a radius token."
18
18
  ]
19
19
  },
@@ -307,7 +307,7 @@
307
307
  "A literal colour, size or font value anywhere in a component.",
308
308
  "A primitive token in a component. Primitives are hidden from the Figma pickers for the same reason.",
309
309
  "An invented icon name. Choose from OL8_ICONS.",
310
- "A per-size icon stroke. The 1.8 stroke is shared, and the 18px master is an exact 0.75 scale of the 24px one.",
310
+ "A per-size icon stroke. The 1.8 stroke is shared, and an Icon Frame instance is an exact scale of the 24px master, so an 18px one carries a 1.35 stroke. The selection masters are the exception: Icon / Selection / Check keeps the same 10.2 x 6.9 artwork at 1.8 in both its 18 and 24 boxes, so it is not scaled.",
311
311
  "Mixing a filled treatment with an outlined one across selection controls. Checkbox and Radio share one language."
312
312
  ]
313
313
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@oneli8/core",
3
- "version": "1.0.0-beta.6",
3
+ "version": "1.0.0-beta.8",
4
4
  "description": "OneLi8 Design System, framework agnostic. renderX returns an HTML string, hydrateX wires existing DOM. Ships the design language and the rules it follows.",
5
5
  "keywords": [
6
6
  "design-system",
@@ -89,7 +89,7 @@
89
89
  "NOTICE"
90
90
  ],
91
91
  "dependencies": {
92
- "@oneli8/tokens": "1.0.0-beta.6"
92
+ "@oneli8/tokens": "1.0.0-beta.8"
93
93
  },
94
94
  "engines": {
95
95
  "node": ">=20"