@joanroucoux/cairn-ui 0.8.0 → 0.8.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.
Files changed (3) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/README.md +67 -0
  3. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,18 @@
1
1
  # Changelog
2
2
 
3
+ ## 0.8.1
4
+
5
+ ### Added
6
+
7
+ - The npm page now carries a README: what the package is, how to install it, the stylesheets and the `@source`
8
+ line to add, the `fonts.css` setup and the per-folder imports.
9
+ - The Storybook is published at https://joanroucoux.github.io/cairn-ui/ on every push to `main`.
10
+ - A GitHub Release is created for every `vX.Y.Z` tag, with the matching section of this changelog as its notes.
11
+
12
+ ### Changed
13
+
14
+ - Stories and specs use fictional data. No component or style changes.
15
+
3
16
  ## 0.8.0
4
17
 
5
18
  ### Breaking
package/README.md ADDED
@@ -0,0 +1,67 @@
1
+ # @joanroucoux/cairn-ui
2
+
3
+ A monochrome, accessible Angular design system, built for [Cairn](https://github.com/JoanRoucoux/cairn).
4
+
5
+ Browse every component, live, in the [Storybook](https://joanroucoux.github.io/cairn-ui/).
6
+
7
+ ## Installation
8
+
9
+ ```bash
10
+ pnpm add @joanroucoux/cairn-ui
11
+ ```
12
+
13
+ Peer dependencies: `@angular/common` and `@angular/core`, version 22. The styles use Tailwind CSS 4, which the consuming
14
+ application provides.
15
+
16
+ ## Setup
17
+
18
+ Import three stylesheets, in order, and register the package as a Tailwind source (templates in `node_modules` are
19
+ not scanned by default):
20
+
21
+ ```css
22
+ @import 'tailwindcss';
23
+ @import '@joanroucoux/cairn-ui/styles/tokens.css';
24
+ @import '@joanroucoux/cairn-ui/styles/theme.css';
25
+ @import '@joanroucoux/cairn-ui/styles/motion.css';
26
+ @source '../node_modules/@joanroucoux/cairn-ui';
27
+ ```
28
+
29
+ `fonts.css` self-hosts Rubik and must not be imported through the Tailwind entry above: its `@font-face` rules use
30
+ `url(./fonts/...)` paths relative to the file, and Tailwind's CSS-first pipeline does not rebase them. Add it to the
31
+ `styles` array of `angular.json` instead:
32
+
33
+ ```json
34
+ "styles": ["src/styles.css", "node_modules/@joanroucoux/cairn-ui/styles/fonts.css"]
35
+ ```
36
+
37
+ An application that does not use Tailwind can import `@joanroucoux/cairn-ui/styles/tokens.css` alone: it is a pure
38
+ token sheet.
39
+
40
+ ## Usage
41
+
42
+ The package root exports nothing. Each component folder is its own entry point, so your bundler only ships what you
43
+ import:
44
+
45
+ ```ts
46
+ import { Component } from '@angular/core';
47
+
48
+ import { UiBadge } from '@joanroucoux/cairn-ui/badge';
49
+ import { UiButton } from '@joanroucoux/cairn-ui/button';
50
+
51
+ @Component({
52
+ selector: 'app-example',
53
+ imports: [UiButton, UiBadge],
54
+ template: `
55
+ <ui-badge>Synced</ui-badge>
56
+ <button ui-button>Save</button>
57
+ `,
58
+ })
59
+ export class Example {}
60
+ ```
61
+
62
+ ## More
63
+
64
+ - [Repository README](https://github.com/JoanRoucoux/cairn-ui#readme): the component list, design principles and development guide
65
+ - [Changelog](https://github.com/JoanRoucoux/cairn-ui/blob/main/projects/ui/CHANGELOG.md)
66
+
67
+ MIT licensed.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@joanroucoux/cairn-ui",
3
- "version": "0.8.0",
3
+ "version": "0.8.1",
4
4
  "description": "Cairn UI — a monochrome, accessible Angular design system.",
5
5
  "keywords": [
6
6
  "angular",