@konce-pt/styles 0.1.0 → 0.1.2

package/README.md

@@ -0,0 +1,75 @@
+<div align="center">
+
+# Koncept UI — Base Styles
+
+**Base CSS for Koncept UI — reset, cascade layers and neutral light/dark theme.**
+
+[![npm version](https://img.shields.io/npm/v/@konce-pt/styles?color=%233b82f6&label=npm)](https://www.npmjs.com/package/@konce-pt/styles)
+[![minzipped size](https://img.shields.io/bundlephobia/minzip/@konce-pt/styles)](https://bundlephobia.com/package/@konce-pt/styles)
+[![license](https://img.shields.io/npm/l/@konce-pt/styles?color=%2310b981)](https://gitlab.com/konce-pt/koncept-ui/-/blob/main/LICENSE)
+
+</div>
+
+---
+
+The base stylesheet for [Koncept UI](https://www.npmjs.com/package/@konce-pt/angular): a modern reset, typography, and CSS **`@layer`** ordering (`kpt.reset, kpt.base, kpt.components, kpt.utilities`) so consumers can override styles without specificity wars. Built on top of [`@konce-pt/tokens`](https://www.npmjs.com/package/@konce-pt/tokens).
+
+## Installation
+
+```bash
+npm i @konce-pt/styles @konce-pt/tokens
+```
+
+## Usage
+
+Load **after** the tokens (it consumes the `--kpt-*` custom properties at runtime).
+
+**Angular CLI** — `angular.json → styles[]` (tokens first, then this, then your `src/styles.scss`):
+
+```jsonc
+"styles": [
+  "node_modules/@konce-pt/tokens/dist/css/tokens.css",
+  "node_modules/@konce-pt/tokens/dist/css/tokens.dark.css",
+  "node_modules/@konce-pt/styles/index.css",
+  "src/styles.scss"
+]
+```
+
+**Vite / webpack** — import directly (after the tokens CSS):
+
+```ts
+import '@konce-pt/tokens/css';
+import '@konce-pt/tokens/css/dark';
+import '@konce-pt/styles';
+```
+
+Or compose the SCSS source into your own build:
+
+```scss
+@use '@konce-pt/styles/scss';
+```
+
+## License
+
+[MIT](./LICENSE) © konce.pt
+
+---
+
+## 🇵🇱 Wersja polska
+
+Bazowy arkusz stylów [Koncept UI](https://www.npmjs.com/package/@konce-pt/angular): nowoczesny reset, typografia i warstwy CSS **`@layer`** (`kpt.reset, kpt.base, kpt.components, kpt.utilities`) — łatwe nadpisywanie bez wojen specyficzności. Bazuje na [`@konce-pt/tokens`](https://www.npmjs.com/package/@konce-pt/tokens); ładuj **po** tokenach.
+
+**Angular CLI** — `angular.json → styles[]` (najpierw tokeny, potem ten plik, na końcu Twój `src/styles.scss`):
+
+```jsonc
+"styles": [
+  "node_modules/@konce-pt/tokens/dist/css/tokens.css",
+  "node_modules/@konce-pt/tokens/dist/css/tokens.dark.css",
+  "node_modules/@konce-pt/styles/index.css",
+  "src/styles.scss"
+]
+```
+
+**Vite/webpack** — `import '@konce-pt/tokens/css'; import '@konce-pt/tokens/css/dark'; import '@konce-pt/styles';`
+
+Licencja: [MIT](./LICENSE) © konce.pt

package/index.css

@@ -5,10 +5,12 @@
  * Komponenty (@konce-pt/angular) deklarują style w warstwie `kpt.components`,
  * dzięki czemu aplikacja łatwo je nadpisuje bez wojny specyficzności.
  *
- * Wymaga wcześniejszego zaimportowania tokenów:
- *   import '@konce-pt/tokens/css';
- *   import '@konce-pt/tokens/css/dark';
- *   import '@konce-pt/styles';
+ * Wymaga wcześniejszego załadowania tokenów (custom properties --kpt-*).
+ * Angular CLI — angular.json → styles[] (kolejność: tokeny, potem ten plik):
+ *   node_modules/@konce-pt/tokens/dist/css/tokens.css
+ *   node_modules/@konce-pt/tokens/dist/css/tokens.dark.css
+ *   node_modules/@konce-pt/styles/index.css
+ * Vite/webpack — import '@konce-pt/tokens/css'; import '@konce-pt/tokens/css/dark'; import '@konce-pt/styles';
  */
 @layer kpt.reset, kpt.base, kpt.components, kpt.utilities;
 @layer kpt.reset {

package/index.d.ts

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,23 +1,48 @@
 {
   "name": "@konce-pt/styles",
-  "version": "0.1.0",
-  "description": "Bazowy CSS Koncept UI — reset, warstwy @layer, style bazowe motywu (źródło SCSS).",
+  "version": "0.1.2",
+  "description": "Base CSS for Koncept UI — reset, cascade @layer ordering and neutral light/dark theme (SCSS source).",
   "license": "MIT",
   "author": "konce.pt",
+  "homepage": "https://gitlab.com/konce-pt/koncept-ui#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://gitlab.com/konce-pt/koncept-ui.git",
+    "directory": "packages/styles"
+  },
+  "bugs": {
+    "url": "https://gitlab.com/konce-pt/koncept-ui/-/issues"
+  },
+  "keywords": [
+    "css",
+    "css-layers",
+    "design-system",
+    "theme",
+    "dark-mode",
+    "reset",
+    "koncept-ui"
+  ],
   "sideEffects": [
     "*.css"
   ],
   "exports": {
-    ".": "./index.css",
-    "./index.css": "./index.css",
+    ".": {
+      "types": "./index.d.ts",
+      "default": "./index.css"
+    },
+    "./index.css": {
+      "types": "./index.d.ts",
+      "default": "./index.css"
+    },
     "./scss": "./src/index.scss"
   },
   "files": [
     "index.css",
+    "index.d.ts",
     "src"
   ],
   "peerDependencies": {
-    "@konce-pt/tokens": "0.1.0"
+    "@konce-pt/tokens": "0.1.2"
   },
   "devDependencies": {
     "sass": "^1.77.0"

package/src/index.scss

@@ -4,10 +4,12 @@
  * Komponenty (@konce-pt/angular) deklarują style w warstwie `kpt.components`,
  * dzięki czemu aplikacja łatwo je nadpisuje bez wojny specyficzności.
  *
- * Wymaga wcześniejszego zaimportowania tokenów:
- *   import '@konce-pt/tokens/css';
- *   import '@konce-pt/tokens/css/dark';
- *   import '@konce-pt/styles';
+ * Wymaga wcześniejszego załadowania tokenów (custom properties --kpt-*).
+ * Angular CLI — angular.json → styles[] (kolejność: tokeny, potem ten plik):
+ *   node_modules/@konce-pt/tokens/dist/css/tokens.css
+ *   node_modules/@konce-pt/tokens/dist/css/tokens.dark.css
+ *   node_modules/@konce-pt/styles/index.css
+ * Vite/webpack — import '@konce-pt/tokens/css'; import '@konce-pt/tokens/css/dark'; import '@konce-pt/styles';
  */
 @layer kpt.reset, kpt.base, kpt.components, kpt.utilities;