ssovee-os-web-ui 0.1.6 → 0.1.7

package/README.md

@@ -49,15 +49,28 @@ export default {
 };
 ```
 
-For Tailwind v4, add the package as a source in your global CSS file and load a config containing the same preset:
+For Tailwind v4, import the package theme stylesheet directly in your global CSS. The package theme entry already carries the Tailwind bootstrap and library source scanning for the built dist output, so consumers do not need to repeat the `@source`/`@import "tailwindcss"` lines in their app CSS:
 
 ```css
-@import "tailwindcss";
-@source "../node_modules/ssovee-os-web-ui/dist";
-@config "../tailwind.config.js";
 @import "ssovee-os-web-ui/theme.css";
 ```
 
+If you use a project-level `tailwind.config.js`, the package also publishes a ready-to-reference config entry that already applies the preset by default:
+
+```js
+import ssoveePreset from "ssovee-os-web-ui/tailwind-preset";
+
+export default {
+  presets: [ssoveePreset],
+};
+```
+
+You can also point your app at the published config file directly via the package export:
+
+```js
+import ssoveePreset from "ssovee-os-web-ui/tailwind.config.js";
+```
+
 The preset includes the library's semantic colors (`primary`, `secondary`, `surface-*`, `brand-color`, `border-1`, and `muted`). Override the `--ssovee-*` CSS variables in your application to customize the theme.
 
 ## Usage

package/dist/index.css

@@ -1,4 +1,7 @@
+@import "tailwindcss";
+
 /* theme.css */
+@source "./dist";
 :root {
   --ssovee-primary: 15 23 42;
   --ssovee-secondary: 30 41 59;

package/dist/index.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../theme.css"],"sourcesContent":[":root {\n  --ssovee-primary: 15 23 42;\n  --ssovee-secondary: 30 41 59;\n  --ssovee-surface-1: 51 65 85;\n  --ssovee-surface-2: 40 53 72;\n  --ssovee-surface-3: 30 41 59;\n  --ssovee-surface-4: 51 65 85;\n  --ssovee-brand-color: 59 130 246;\n  --ssovee-border-1: 71 85 105;\n  --ssovee-muted: 100 116 139;\n}\n"],"mappings":";AAAA;AACE,oBAAkB,GAAG,GAAG;AACxB,sBAAoB,GAAG,GAAG;AAC1B,sBAAoB,GAAG,GAAG;AAC1B,sBAAoB,GAAG,GAAG;AAC1B,sBAAoB,GAAG,GAAG;AAC1B,sBAAoB,GAAG,GAAG;AAC1B,wBAAsB,GAAG,IAAI;AAC7B,qBAAmB,GAAG,GAAG;AACzB,kBAAgB,IAAI,IAAI;AAC1B;","names":[]}
+{"version":3,"sources":["../theme.css"],"sourcesContent":["@import \"tailwindcss\";\n@source \"./dist\";\n\n:root {\n  --ssovee-primary: 15 23 42;\n  --ssovee-secondary: 30 41 59;\n  --ssovee-surface-1: 51 65 85;\n  --ssovee-surface-2: 40 53 72;\n  --ssovee-surface-3: 30 41 59;\n  --ssovee-surface-4: 51 65 85;\n  --ssovee-brand-color: 59 130 246;\n  --ssovee-border-1: 71 85 105;\n  --ssovee-muted: 100 116 139;\n}\n"],"mappings":";;;AACA,QAAQ;AAER;AACE,oBAAkB,GAAG,GAAG;AACxB,sBAAoB,GAAG,GAAG;AAC1B,sBAAoB,GAAG,GAAG;AAC1B,sBAAoB,GAAG,GAAG;AAC1B,sBAAoB,GAAG,GAAG;AAC1B,sBAAoB,GAAG,GAAG;AAC1B,wBAAsB,GAAG,IAAI;AAC7B,qBAAmB,GAAG,GAAG;AACzB,kBAAgB,IAAI,IAAI;AAC1B;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ssovee-os-web-ui",
-  "version": "0.1.6",
+  "version": "0.1.7",
   "description": "Reusable UI component library for shared applications.",
   "author": "SSOVEE",
   "license": "MIT",
@@ -30,6 +30,7 @@
       "require": "./dist/index.cjs"
     },
     "./tailwind-preset": "./tailwind-preset.js",
+    "./tailwind.config.js": "./tailwind.config.js",
     "./theme.css": "./theme.css"
   },
   "files": [
@@ -37,6 +38,7 @@
     "README.md",
     "LICENSE",
     "tailwind-preset.js",
+    "tailwind.config.js",
     "theme.css"
   ],
   "scripts": {

package/tailwind.config.js

@@ -0,0 +1,6 @@
+/** @type {import('tailwindcss').Config} */
+import ssoveePreset from "./tailwind-preset.js";
+
+export default {
+  presets: [ssoveePreset],
+};

package/theme.css

@@ -1,3 +1,6 @@
+@import "tailwindcss";
+@source "./dist";
+
 :root {
   --ssovee-primary: 15 23 42;
   --ssovee-secondary: 30 41 59;