@nova-design-system/nova-base 3.0.0-beta.16
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/LICENSE.MD +157 -0
- package/README.md +94 -0
- package/assets/fonts/TT_Norms_Pro_Bold.woff2 +0 -0
- package/assets/fonts/TT_Norms_Pro_Medium.woff2 +0 -0
- package/assets/fonts/TT_Norms_Pro_Mono_Bold.woff2 +0 -0
- package/assets/fonts/TT_Norms_Pro_Mono_Medium.woff2 +0 -0
- package/assets/fonts/TT_Norms_Pro_Mono_Regular.woff2 +0 -0
- package/assets/fonts/TT_Norms_Pro_Regular.woff2 +0 -0
- package/assets/icons/icon-sprite.svg +1 -0
- package/assets/nova-fonts.css +3 -0
- package/dist/css/nova-utils.css +27979 -0
- package/dist/css/ocean.css +1391 -0
- package/dist/css/spark.css +1391 -0
- package/dist/js/ocean_dark.d.ts +412 -0
- package/dist/js/ocean_dark.js +412 -0
- package/dist/js/ocean_light.d.ts +412 -0
- package/dist/js/ocean_light.js +412 -0
- package/dist/js/primitives.d.ts +282 -0
- package/dist/js/primitives.js +282 -0
- package/dist/js/spacings.d.ts +250 -0
- package/dist/js/spacings.js +250 -0
- package/dist/js/spark_dark.d.ts +412 -0
- package/dist/js/spark_dark.js +412 -0
- package/dist/js/spark_light.d.ts +412 -0
- package/dist/js/spark_light.js +412 -0
- package/dist/lib/cjs/index.js +19 -0
- package/dist/lib/cjs/nova-plugin.js +163 -0
- package/dist/lib/cjs/nova-safelist.js +333 -0
- package/dist/lib/cjs/nova-theme.js +236 -0
- package/dist/lib/index.d.ts +3 -0
- package/dist/lib/index.js +3 -0
- package/dist/lib/nova-plugin.d.ts +7 -0
- package/dist/lib/nova-plugin.js +156 -0
- package/dist/lib/nova-safelist.d.ts +26 -0
- package/dist/lib/nova-safelist.js +344 -0
- package/dist/lib/nova-theme.d.ts +88 -0
- package/dist/lib/nova-theme.js +233 -0
- package/dist/tokens/ocean_dark.json +1900 -0
- package/dist/tokens/ocean_light.json +1900 -0
- package/dist/tokens/primitives.json +1358 -0
- package/dist/tokens/spacings.json +1110 -0
- package/dist/tokens/spark_dark.json +1901 -0
- package/dist/tokens/spark_light.json +1900 -0
- package/package.json +40 -0
package/LICENSE.MD
ADDED
|
@@ -0,0 +1,157 @@
|
|
|
1
|
+
# End-User License Agreement: Nova Design System
|
|
2
|
+
|
|
3
|
+
This End-User License Agreement ("Agreement") is entered into between:
|
|
4
|
+
|
|
5
|
+
1. **Elia Group NV**
|
|
6
|
+
|
|
7
|
+
Located at Keizerslaan 20, 1000 Brussel, registered at the Crossroads Bank for Enterprises in Belgium under number 0476.388.378 (hereafter: “Licensor”, “Elia”, “We”, “Our” or “Us”), and
|
|
8
|
+
|
|
9
|
+
2. **Subsidiaries, Partners, or Affiliates**
|
|
10
|
+
|
|
11
|
+
Collectively referred to as the "Licensee".
|
|
12
|
+
|
|
13
|
+
**Licensor** and **Licensee** may both be referred to as a “Party” and jointly as the “Parties”.
|
|
14
|
+
|
|
15
|
+
This Agreement can only be entered into by a party which qualifies as the “Licensee”. Any attempt by Third Parties to claim rights or licenses under this Agreement shall be considered null and void, as the Agreement is strictly limited to the Licensee, as defined herein.
|
|
16
|
+
|
|
17
|
+
## Article 1: Definitions
|
|
18
|
+
|
|
19
|
+
### 1.1 Affiliate
|
|
20
|
+
|
|
21
|
+
A business entity related to Elia through ownership, control, or shared interests, as per Article 1:15 of the Belgian Code of Companies and Associations.
|
|
22
|
+
|
|
23
|
+
### 1.2 Effective Date
|
|
24
|
+
|
|
25
|
+
The date from which the Licensee accesses and downloads the Works.
|
|
26
|
+
|
|
27
|
+
### 1.3 Elia Projects
|
|
28
|
+
|
|
29
|
+
Initiatives, projects, or tasks directly relating to Elia’s business operations or those of Subsidiaries, Affiliates, or Partners, including development, execution, or management of services or products.
|
|
30
|
+
|
|
31
|
+
### 1.4 Intellectual Property Rights
|
|
32
|
+
|
|
33
|
+
Any intellectual property rights, including copyrights, trademarks, patents, and related rights worldwide.
|
|
34
|
+
|
|
35
|
+
### 1.5 License
|
|
36
|
+
|
|
37
|
+
As described in Article 2.1.
|
|
38
|
+
|
|
39
|
+
### 1.6 Partner
|
|
40
|
+
|
|
41
|
+
A business partner, subcontractor, or service provider of Elia engaged in Elia Projects.
|
|
42
|
+
|
|
43
|
+
### 1.7 Subsidiary
|
|
44
|
+
|
|
45
|
+
An entity directly or indirectly controlled by the Licensee, per Article 1:14 of the Belgian Code of Companies and Associations.
|
|
46
|
+
|
|
47
|
+
### 1.8 Territory
|
|
48
|
+
|
|
49
|
+
The entire world.
|
|
50
|
+
|
|
51
|
+
### 1.9 Third Party
|
|
52
|
+
|
|
53
|
+
A person or entity not defined as a Party, Subsidiary, Affiliate, or Partner of the Licensor.
|
|
54
|
+
|
|
55
|
+
### 1.10 Works
|
|
56
|
+
|
|
57
|
+
All elements and visuals in the UI library of the "Nova Design System", including source code and associated materials.
|
|
58
|
+
|
|
59
|
+
## Article 2: Grant of License
|
|
60
|
+
|
|
61
|
+
### 2.1 License Grant
|
|
62
|
+
|
|
63
|
+
The **Licensor** grants the **Licensee** a non-exclusive, revocable, sublicensable, and non-transferable right to use the Works worldwide solely for Elia Projects.
|
|
64
|
+
|
|
65
|
+
### 2.2 Usage Rights
|
|
66
|
+
|
|
67
|
+
The usage rights include reproduction, translation, and public communication, provided the Licensee complies with the Agreement.
|
|
68
|
+
|
|
69
|
+
### 2.3 Reporting Infringements
|
|
70
|
+
|
|
71
|
+
Licensee must inform Licensor of any Intellectual Property infringement.
|
|
72
|
+
|
|
73
|
+
## Article 3: Ownership of Intellectual Property Rights
|
|
74
|
+
|
|
75
|
+
### 3.1 Ownership Retained
|
|
76
|
+
|
|
77
|
+
The **Licensor** retains all ownership rights to the Intellectual Property related to the Works.
|
|
78
|
+
|
|
79
|
+
### 3.2 Updates
|
|
80
|
+
|
|
81
|
+
Updates may be implemented by the Licensor without prior notice. Licensee may choose whether to implement updates.
|
|
82
|
+
|
|
83
|
+
## Article 4: Permitted Use and Restrictions
|
|
84
|
+
|
|
85
|
+
### 4.1 Permitted Use
|
|
86
|
+
|
|
87
|
+
- The Works may only be used by employees or contractors of the Licensee in Elia Projects.
|
|
88
|
+
|
|
89
|
+
- Installation is restricted to devices owned or controlled by the Licensee.
|
|
90
|
+
|
|
91
|
+
### 4.2 Restrictions
|
|
92
|
+
|
|
93
|
+
The Works must not be:
|
|
94
|
+
|
|
95
|
+
- Shared, sublicensed, or otherwise transferred to Third Parties.
|
|
96
|
+
|
|
97
|
+
- Reverse-engineered, decompiled, or disassembled.
|
|
98
|
+
|
|
99
|
+
## Article 5: Liability and Disclaimer of Warranties
|
|
100
|
+
|
|
101
|
+
### 5.1 Disclaimer
|
|
102
|
+
|
|
103
|
+
The Works are provided "as is", without warranty of any kind. The **Licensor** disclaims all implied warranties.
|
|
104
|
+
|
|
105
|
+
### 5.2 Limitation of Liability
|
|
106
|
+
|
|
107
|
+
The **Licensor** limits its liability to €1,000. The Licensee assumes all risks related to the use of the Works.
|
|
108
|
+
|
|
109
|
+
## Article 6: Term and Termination
|
|
110
|
+
|
|
111
|
+
### 6.1 Initial Term
|
|
112
|
+
|
|
113
|
+
The Agreement is effective indefinitely from the Effective Date unless terminated.
|
|
114
|
+
|
|
115
|
+
### 6.2 Termination by Notice
|
|
116
|
+
|
|
117
|
+
Either Party may terminate with one month's written notice.
|
|
118
|
+
|
|
119
|
+
### 6.3 Automatic Termination
|
|
120
|
+
|
|
121
|
+
Termination occurs automatically upon:
|
|
122
|
+
|
|
123
|
+
- Changes in control, ownership, or project participation.
|
|
124
|
+
|
|
125
|
+
- Breach of material terms by the Licensee, following written notice.
|
|
126
|
+
|
|
127
|
+
### 6.4 Post-Termination Obligations
|
|
128
|
+
|
|
129
|
+
Upon termination, the **Licensee** must cease using and destroy all copies of the Works.
|
|
130
|
+
|
|
131
|
+
## Article 7: Miscellaneous
|
|
132
|
+
|
|
133
|
+
### 7.1 Waiver
|
|
134
|
+
|
|
135
|
+
Waivers must be in writing and do not constitute ongoing waivers of similar rights.
|
|
136
|
+
|
|
137
|
+
### 7.2 Costs
|
|
138
|
+
|
|
139
|
+
Each Party bears its own implementation costs.
|
|
140
|
+
|
|
141
|
+
### 7.3 Assignment
|
|
142
|
+
|
|
143
|
+
The Agreement may not be assigned without prior consent from the **Licensor**.
|
|
144
|
+
|
|
145
|
+
### 7.4 Severability
|
|
146
|
+
|
|
147
|
+
Invalid provisions will not affect the remainder of the Agreement.
|
|
148
|
+
|
|
149
|
+
## Article 8: Governing Law and Jurisdiction
|
|
150
|
+
|
|
151
|
+
### 8.1 Governing Law
|
|
152
|
+
|
|
153
|
+
This Agreement is governed by Belgian law.
|
|
154
|
+
|
|
155
|
+
### 8.2 Jurisdiction
|
|
156
|
+
|
|
157
|
+
The Dutch-speaking courts of Brussels have exclusive jurisdiction for disputes.
|
package/README.md
ADDED
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
# Nova Components Base
|
|
2
|
+
|
|
3
|
+
The Nova Components Base package provides essential tokens and precompiled CSS for the Nova Design System. It aims to streamline the use of Nova’s design tokens and offer flexibility in customizing the setup with Tailwind CSS.
|
|
4
|
+
|
|
5
|
+
## Features
|
|
6
|
+
|
|
7
|
+
- **Precompiled CSS:** A simple css file tailored with Nova’s design theme and a collection of utilities. Ideal for quick integration.
|
|
8
|
+
- **Tokens:** Design tokens defined by the Nova Design.
|
|
9
|
+
- **Tailwind Theme and Plugin:** Configure your own Tailwind CSS setup with the Nova theme and plugin, eliminating the need for the precompiled CSS and significantly reducing CSS size.
|
|
10
|
+
|
|
11
|
+
---
|
|
12
|
+
|
|
13
|
+
## Installation
|
|
14
|
+
|
|
15
|
+
```bash
|
|
16
|
+
npm install @nova-design-system/nova-base
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
## Usage
|
|
20
|
+
|
|
21
|
+
### Include Tokens CSS
|
|
22
|
+
|
|
23
|
+
Include the tokens CSS in your project (two themes are available: Spark and Ocean):
|
|
24
|
+
|
|
25
|
+
```css
|
|
26
|
+
/* For the Spark theme */
|
|
27
|
+
@import '@nova-design-system/nova-base/dist/css/spark.css';
|
|
28
|
+
|
|
29
|
+
/* Or, for the Ocean theme */
|
|
30
|
+
@import '@nova-design-system/nova-base/dist/css/ocean.css';
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
### Recommended Approach: Using Tailwind CSS with Nova Theme and Plugin
|
|
34
|
+
|
|
35
|
+
The recommended approach is to set up Tailwind CSS and use our tokens, `novaTailwindTheme`, and `novaTailwindPlugin` for the Tailwind configuration. This method provides a smaller CSS bundle and access to more utilities than the precompiled CSS.
|
|
36
|
+
|
|
37
|
+
#### Prerequisites
|
|
38
|
+
|
|
39
|
+
Ensure that Tailwind CSS is installed in your project. If not, you can install it by following the [Tailwind CSS installation guide](https://tailwindcss.com/docs/installation).
|
|
40
|
+
|
|
41
|
+
#### Tailwind Configuration
|
|
42
|
+
|
|
43
|
+
After setting up Tailwind CSS, add the following to your `tailwind.config.js`:
|
|
44
|
+
|
|
45
|
+
```js
|
|
46
|
+
import {
|
|
47
|
+
novaTailwindTheme,
|
|
48
|
+
novaTailwindPlugin,
|
|
49
|
+
} from '@nova-design-system/nova-base/theme';
|
|
50
|
+
|
|
51
|
+
/** @type {import('tailwindcss').Config} */
|
|
52
|
+
export default {
|
|
53
|
+
// ...
|
|
54
|
+
theme: novaTailwindTheme,
|
|
55
|
+
plugins: [novaTailwindPlugin],
|
|
56
|
+
};
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
The `novaTailwindTheme` maps our CSS variable tokens to utilities, ensuring consistent styling across your project. The `novaTailwindPlugin` adds additional base styles, components, and utilities.
|
|
60
|
+
|
|
61
|
+
#### Importing Theme Tokens in CSS
|
|
62
|
+
|
|
63
|
+
In your CSS file, along with the default Tailwind imports, you should import the tokens for the theme:
|
|
64
|
+
|
|
65
|
+
```css
|
|
66
|
+
/* Import the theme tokens */
|
|
67
|
+
@import '@nova-design-system/nova-base/dist/css/spark.css';
|
|
68
|
+
|
|
69
|
+
/* Tailwind CSS imports */
|
|
70
|
+
@tailwind base;
|
|
71
|
+
@tailwind components;
|
|
72
|
+
@tailwind utilities;
|
|
73
|
+
|
|
74
|
+
/* Or, for the Ocean theme */
|
|
75
|
+
/* @import '@nova-design-system/nova-base/dist/css/ocean.css'; */
|
|
76
|
+
```
|
|
77
|
+
|
|
78
|
+
#### Benefits of Using Tailwind CSS with Nova Theme and Plugin
|
|
79
|
+
|
|
80
|
+
- **Smaller CSS Bundle:** By configuring Tailwind CSS with our theme and plugin, you eliminate unused styles, resulting in a significantly smaller CSS file.
|
|
81
|
+
- **More Utilities:** Gain access to a wider range of utilities beyond those included in the precompiled CSS.
|
|
82
|
+
- **Customization:** Tailwind CSS allows you to customize and extend your styles as needed.
|
|
83
|
+
|
|
84
|
+
### Alternative Approach: Using Precompiled CSS
|
|
85
|
+
|
|
86
|
+
If it's not possible to set up Tailwind CSS in your project, you can include the precompiled CSS along with the tokens:
|
|
87
|
+
|
|
88
|
+
```js
|
|
89
|
+
import '@nova-design-system/nova-base/dist/css/spark.css';
|
|
90
|
+
// or import '@nova-design-system/nova-base/dist/css/ocean.css';
|
|
91
|
+
import '@nova-design-system/nova-base/dist/css/nova-utils.css';
|
|
92
|
+
```
|
|
93
|
+
|
|
94
|
+
**Note:** The precompiled CSS includes a whitelist of Tailwind classes and is quite large. This approach is only recommended if you cannot set up Tailwind CSS yourself.
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|