@holaboss/ui 0.1.0 → 0.1.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.
package/README.md CHANGED
@@ -14,16 +14,24 @@ bun add @holaboss/ui
14
14
 
15
15
  Peer deps: `react ^19`, `react-dom ^19`.
16
16
 
17
- ## Mount the tokens
17
+ ## Mount the styles
18
18
 
19
19
  At the root of your app (e.g. `routes/__root.tsx`):
20
20
 
21
+ ```tsx
22
+ import "@holaboss/ui/styles.css";
23
+ ```
24
+
25
+ That one import covers everything: the design tokens, the default theme, and every Tailwind utility class the library's primitives + layouts use (pre-compiled at build time, so you do **not** need to add `@holaboss/ui` to your own Tailwind `@source` list).
26
+
27
+ If you want just the raw tokens without the baked-in utility set, the escape hatch is:
28
+
21
29
  ```tsx
22
30
  import "@holaboss/ui/tokens.css";
23
31
  import "@holaboss/ui/themes/holaos.css";
24
32
  ```
25
33
 
26
- Both stylesheets ship inside the npm package and are required — without them the CSS variables (`--background`, `--primary`, `--border`, `--radius`, etc.) fall back to defaults and every primitive renders wrong.
34
+ But the recommended path is the single `styles.css` import.
27
35
 
28
36
  ## What ships
29
37
 
package/dist/index.d.cts CHANGED
@@ -38,7 +38,7 @@ declare function AlertAction({
38
38
  //#endregion
39
39
  //#region src/primitives/badge.d.ts
40
40
  declare const badgeVariants: (props?: ({
41
- variant?: "default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined;
41
+ variant?: "default" | "destructive" | "secondary" | "outline" | "ghost" | "link" | null | undefined;
42
42
  } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
43
43
  declare function Badge({
44
44
  className,
@@ -49,7 +49,7 @@ declare function Badge({
49
49
  //#endregion
50
50
  //#region src/primitives/button.d.ts
51
51
  declare const buttonVariants: (props?: ({
52
- variant?: "default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | "bordered" | null | undefined;
52
+ variant?: "default" | "destructive" | "secondary" | "outline" | "ghost" | "link" | "bordered" | null | undefined;
53
53
  size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
54
54
  } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
55
55
  declare function Button({
package/dist/index.d.ts CHANGED
@@ -38,7 +38,7 @@ declare function AlertAction({
38
38
  //#endregion
39
39
  //#region src/primitives/badge.d.ts
40
40
  declare const badgeVariants: (props?: ({
41
- variant?: "default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined;
41
+ variant?: "default" | "destructive" | "secondary" | "outline" | "ghost" | "link" | null | undefined;
42
42
  } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
43
43
  declare function Badge({
44
44
  className,
@@ -49,7 +49,7 @@ declare function Badge({
49
49
  //#endregion
50
50
  //#region src/primitives/button.d.ts
51
51
  declare const buttonVariants: (props?: ({
52
- variant?: "default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | "bordered" | null | undefined;
52
+ variant?: "default" | "destructive" | "secondary" | "outline" | "ghost" | "link" | "bordered" | null | undefined;
53
53
  size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
54
54
  } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
55
55
  declare function Button({