IS-11682 Consume UI Kit CSS from source instead of the built artifact

package.json

@@ -25,7 +25,7 @@
     "src/haapi-react-app"
   ],
   "scripts": {
-    "prestart": "npm run build --workspace @curity/ui-kit-icons --workspace @curity/ui-kit-css-lib --workspace @curity/ui-kit-css --workspace @curity/ui-kit-component-library --workspace @curity/ui-kit-identity-server && npm run unzip-libs --workspace @curity/ui-kit-identity-server",
+    "prestart": "npm run build --workspace @curity/ui-kit-icons --workspace @curity/ui-kit-component-library --workspace @curity/ui-kit-identity-server && npm run unzip-libs --workspace @curity/ui-kit-identity-server",
     "start": "cross-env SKIP_PRESTART=1 concurrently \"npm run start:identity-server\" \"npm run start:ssp\" \"npm run start:haapi-react-app\" \"npm run start:css\" \"npm run start:component-library\" \"open index.html\"",
     "start:ssp": "npm run -w src/self-service-portal/app start",
     "start:css": "npm run -w src/common/css start",

src/common/component-library/README.md

@@ -151,12 +151,16 @@ src/
 - `react-dom` ^18.0.0
 
 ### Internal Dependencies
-- `@curity/ui-kit-css` - Base CSS styles
 - `@curity/ui-kit-icons` - Icon library
 - `react`
 - `react-router` - Routing support
 - `@radix-ui/react-dialog` - Dialog support
 
+### Runtime Requirements
+- `@curity/ui-kit-css` - not an npm dependency, but the component styles consume its theme variables
+  (`--color-primary`, `--button-border-radius`, `--form-field-*`, ...), so the consuming app must load the
+  Curity CSS (e.g. `import "@curity/ui-kit-css"`) for components to render correctly.
+
 ## Browser Support
 
 - Chrome (latest)

src/common/component-library/package.json

@@ -28,7 +28,7 @@
     "dev": "vite",
     "start": "vite",
     "watch": "vite build --watch",
-    "prebuild": "npm run build --workspace @curity/ui-kit-icons --workspace @curity/ui-kit-css || true",
+    "prebuild": "npm run build --workspace @curity/ui-kit-icons || true",
     "build": "npm run tsBuild && vite build",
     "tsBuild": "tsc -b",
     "tsBuild:watch": "tsc -b -w",
@@ -42,7 +42,6 @@
     "react-dom": "^19.0.0"
   },
   "dependencies": {
-    "@curity/ui-kit-css": "^1.0.0",
     "@curity/ui-kit-icons": "^1.0.0",
     "@radix-ui/react-dialog": "^1.1.15",
     "react": "^19.2.0",

src/common/component-library/tsconfig.app.json

@@ -27,8 +27,7 @@
     "paths": {
       "@/*": ["./src/*"],
       "@components/*": ["./src/components/*"],
-      "@curity/ui-kit-icons/*": ["./src/packages/icons/*"],
-      "@curity/ui-kit-css/*": ["./src/packages/css/*"]
+      "@curity/ui-kit-icons/*": ["./src/packages/icons/*"]
     },
 
     "declaration": true,

src/common/css/docs/src/components/BaseHead.astro

@@ -1,5 +1,5 @@
 ---
-import "@curity/ui-kit-css-lib/dist/index.css";
+import "@curity/ui-kit-css";
 import '../styles/global.css';
 
 export interface Props {

src/common/css/docs/src/components/Install.mdx

@@ -1,3 +1,3 @@
 ```shell
-npm install @curity/ui-kit-css
+git clone https://github.com/curityio/ui-kit.git
 ```

src/common/css/docs/src/pages/index.mdx

@@ -13,7 +13,7 @@ import { Intro } from '@components/Intro';
 
 ## Use in Curity UI Kit repository
 
-```shell
-import "@curity/ui-kit-css-lib/dist/index.css";
+```js
+import "@curity/ui-kit-css";
 ```
 </div>

src/common/css/docs/src/pages/introduction/gettingstarted.mdx

@@ -2,15 +2,33 @@
 layout: "../../layouts/Page.astro"
 title: "Install and usage"
 description: "Usage on how to install and use the library"
-updatedAt: "August 08 2022"
+updatedAt: "August 18 2026"
 ---
 
 # Install and Usage
 
-## How to use the CSS library
+`@curity/ui-kit-css` is not published to the npm registry. It is consumed from this repository — either as a workspace package inside the Curity UI Kit monorepo, or from a clone of the repository.
 
-In most modern JS tooling and frameworks or when using a separate bundler, you can import the CSS directly from `node_modules` like this:
+## With a module bundler
+
+In workspace packages of this repository, or in any project with modern JS tooling that can resolve the package (for example via a `file:` dependency on a clone), import the CSS source directly:
 
 ```js
-import "@curity/ui-kit-css-lib/dist/index.css";
+import "@curity/ui-kit-css";
+```
+
+The bundler inlines the `@import`ed partials and minifies the output as part of your normal build — no separate CSS build step is needed.
+
+## Without a module bundler
+
+Projects that link stylesheets directly (plain HTML pages, server-rendered templates) need a single flat CSS file. Build it from the repository root:
+
+```shell
+npm run build:css
+```
+
+Then copy `src/common/css/lib/dist/index.css` into your project and link it:
+
+```html
+<link rel="stylesheet" href="index.css" />
 ```