@kbach/react 0.5.14 → 0.5.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/dist/index.d.ts CHANGED
@@ -1,74 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import React__default, { ReactNode, ComponentType, ForwardRefExoticComponent } from 'react';
3
-
4
- type ThemeMode = 'light' | 'dark' | 'system';
5
- interface StyleValue {
6
- [key: string]: string | number | undefined | null | StyleValue | unknown[];
7
- }
8
- interface ParsedClass {
9
- /** The original class string, e.g. "dark:hover:bg-[#fff]" */
10
- original: string;
11
- /** Up to 3 modifier prefixes, e.g. ['dark', 'hover'] */
12
- modifiers: string[];
13
- /** Whether a leading `-` was present for negative values */
14
- negative: boolean;
15
- /** Whether a leading `!` was present — applies !important to all CSS declarations */
16
- important: boolean;
17
- /** The utility name, e.g. 'bg', 'p', 'text' */
18
- utility: string;
19
- /** The resolved value, e.g. 'white', '#fff', '4' */
20
- value: string;
21
- /** Whether the value was specified with bracket notation [value] */
22
- isArbitrary: boolean;
23
- }
24
- interface ResolvedStyle {
25
- /** Base styles applied unconditionally */
26
- base?: StyleValue;
27
- /** Styles keyed by modifier or modifier combo, e.g. 'dark', 'hover', 'dark:hover' */
28
- [modifierKey: string]: StyleValue | undefined;
29
- }
30
- type ColorShades = Record<string, string>;
31
- type ThemeColors = Record<string, string | ColorShades>;
32
- type ThemeSpacing = Record<string, number | string>;
33
- interface ThemeConfig {
34
- colors: ThemeColors;
35
- spacing: ThemeSpacing;
36
- fontSize: Record<string, number | string>;
37
- fontFamily: Record<string, string | string[]>;
38
- fontWeight: Record<string, string | number>;
39
- borderRadius: Record<string, number | string>;
40
- borderWidth: Record<string, number>;
41
- opacity: Record<string, number>;
42
- lineHeight: Record<string, number | string>;
43
- letterSpacing: Record<string, number | string>;
44
- zIndex: Record<string, number | string>;
45
- flex: Record<string, number>;
46
- shadow: Record<string, StyleValue>;
47
- screens: Record<string, string | number>;
48
- [key: string]: unknown;
49
- }
50
- type DarkMode = 'attribute' | 'class' | 'media';
51
- interface PluginAPI {
52
- addUtility(name: string, styles: StyleValue): void;
53
- addVariant(name: string, selector: string): void;
54
- theme(path: string, defaultValue?: unknown): unknown;
55
- e(className: string): string;
56
- }
57
- interface FrameworkConfig {
58
- darkMode?: DarkMode;
59
- theme?: Partial<ThemeConfig>;
60
- /** Additive theme extension — accepts either `extend.theme.X` or `extend.X` directly. */
61
- extend?: {
62
- theme?: Partial<ThemeConfig>;
63
- } & Partial<ThemeConfig>;
64
- plugins?: Array<(api: PluginAPI) => void>;
65
- content?: string[];
66
- }
67
- interface ResolvedConfig {
68
- darkMode: DarkMode;
69
- theme: ThemeConfig;
70
- plugins: Array<(api: PluginAPI) => void>;
71
- }
3
+ import { T as ThemeColors, a as ThemeConfig, P as ParsedClass, R as ResolvedStyle, S as StyleValue, F as FrameworkConfig, b as ResolvedConfig, c as ThemeMode } from './types-CV5vXnSH.js';
4
+ export { d as PluginAPI } from './types-CV5vXnSH.js';
72
5
 
73
6
  declare const defaultColors: ThemeColors;
74
7
  declare const defaultTheme: ThemeConfig;
@@ -368,4 +301,4 @@ declare function kb(classString: string, isDark?: boolean): StyleValue | string;
368
301
  */
369
302
  declare function cx(...classes: Array<string | false | null | undefined>): string;
370
303
 
371
- export { type ColorScale, type ColorsAPI, type FrameworkConfig, type InteractionState, InteractiveWrapper, type InteractiveWrapperProps, type ParsedClass, type PluginAPI, type ResolvedConfig, type ResolvedStyle, type StyleValue, type StyledProps, type ThemeConfig, ThemeContext, type ThemeContextValue, type ThemeMode, ThemeProvider, type ThemeProviderProps, ThemeToggle, type ThemeToggleProps, type ToggleVariant, buildConfig, cx, defaultColors, defaultTheme, flatten, getConfig, initConfig, kb, parseClass, parseClasses, resolve, styled, updateConfig, useBreakpoint, useColors, useGlobalDarkMode, useIsDark, useResolvedStyle, useResponsive, useStyles, useTheme, wrapColors };
304
+ export { type ColorScale, type ColorsAPI, FrameworkConfig, type InteractionState, InteractiveWrapper, type InteractiveWrapperProps, ParsedClass, ResolvedConfig, ResolvedStyle, StyleValue, type StyledProps, ThemeConfig, ThemeContext, type ThemeContextValue, ThemeMode, ThemeProvider, type ThemeProviderProps, ThemeToggle, type ThemeToggleProps, type ToggleVariant, buildConfig, cx, defaultColors, defaultTheme, flatten, getConfig, initConfig, kb, parseClass, parseClasses, resolve, styled, updateConfig, useBreakpoint, useColors, useGlobalDarkMode, useIsDark, useResolvedStyle, useResponsive, useStyles, useTheme, wrapColors };
package/dist/index.js CHANGED
@@ -3228,18 +3228,19 @@ function buildDivideDecls(styles) {
3228
3228
  if ("__divideStyle" in styles) parts.push(`border-style: ${String(styles.__divideStyle)}`);
3229
3229
  return parts.join("; ");
3230
3230
  }
3231
- function injectClassRule(cls, bucketKey, styles, darkMode, important = false) {
3231
+ function buildClassCSSRules(cls, bucketKey, styles, darkMode, important, screens) {
3232
+ const rules = [];
3232
3233
  if ("__keyframe" in styles && typeof styles.__keyframe === "string") {
3233
- injectRule(styles.__keyframe);
3234
+ rules.push(styles.__keyframe);
3234
3235
  }
3235
3236
  const isDivide = "__divideX" in styles || "__divideY" in styles || "__divideColor" in styles || "__divideStyle" in styles;
3236
3237
  const escaped = escapeCSSSelector(cls);
3237
3238
  const childSuffix = isDivide ? " > * + *" : "";
3238
3239
  if (bucketKey === "base") {
3239
3240
  const baseCssDecls = isDivide ? buildDivideDecls(styles) : styleValueToCSS(styles, important);
3240
- if (!baseCssDecls) return;
3241
- injectRule(`.${escaped}${childSuffix} { ${baseCssDecls} }`);
3242
- return;
3241
+ if (!baseCssDecls) return rules;
3242
+ rules.push(`.${escaped}${childSuffix} { ${baseCssDecls} }`);
3243
+ return rules;
3243
3244
  }
3244
3245
  const mods = bucketKey.split(":");
3245
3246
  const responsiveMods = mods.filter((m) => RESPONSIVE_MODS.has(m));
@@ -3269,7 +3270,7 @@ function injectClassRule(cls, bucketKey, styles, darkMode, important = false) {
3269
3270
  ]);
3270
3271
  const needsImportant = important || hasPrint || mediaMods.length > 0 || dirMods.length > 0 || ancestorMods.length > 0 || pseudoMods.some((m) => CSS_ONLY_PSEUDOS.has(m));
3271
3272
  const cssDecls = isDivide ? buildDivideDecls(styles) : styleValueToCSS(styles, needsImportant);
3272
- if (!cssDecls) return;
3273
+ if (!cssDecls) return rules;
3273
3274
  let rule;
3274
3275
  if (hasDark) {
3275
3276
  if (darkMode === "media") {
@@ -3290,20 +3291,18 @@ function injectClassRule(cls, bucketKey, styles, darkMode, important = false) {
3290
3291
  } else {
3291
3292
  rule = `${selector} { ${cssDecls} }`;
3292
3293
  }
3293
- if (hasPrint) {
3294
- rule = `@media print { ${rule} }`;
3295
- }
3296
- for (const m of mediaMods) {
3297
- rule = `@media ${MEDIA_MODS[m]} { ${rule} }`;
3298
- }
3294
+ if (hasPrint) rule = `@media print { ${rule} }`;
3295
+ for (const m of mediaMods) rule = `@media ${MEDIA_MODS[m]} { ${rule} }`;
3299
3296
  if (responsiveMods.length > 0) {
3300
- const screens = getGlobalScreens();
3301
3297
  const minWidth = Math.max(...responsiveMods.map((m) => screens[m] ?? 0));
3302
- if (minWidth > 0) {
3303
- rule = `@media (min-width: ${minWidth}px) { ${rule} }`;
3304
- }
3298
+ if (minWidth > 0) rule = `@media (min-width: ${minWidth}px) { ${rule} }`;
3305
3299
  }
3306
- injectRule(rule);
3300
+ rules.push(rule);
3301
+ return rules;
3302
+ }
3303
+ function injectClassRule(cls, bucketKey, styles, darkMode, important = false) {
3304
+ const cssRules = buildClassCSSRules(cls, bucketKey, styles, darkMode, important, getGlobalScreens());
3305
+ for (const r of cssRules) injectRule(r);
3307
3306
  }
3308
3307
  var RN_ONLY_PROPS = /* @__PURE__ */ new Set([
3309
3308
  "shadowColor",
package/dist/index.mjs CHANGED
@@ -1,6 +1,13 @@
1
1
  import {
2
2
  EMPTY_BREAKPOINTS,
3
3
  InteractiveWrapper,
4
+ setGlobalDarkMode,
5
+ syncGlobalDarkMode,
6
+ useConditionalWidth,
7
+ useGlobalDarkMode,
8
+ useGlobalWidth
9
+ } from "./chunk-RMZIFMWE.mjs";
10
+ import {
4
11
  __require,
5
12
  buildConfig,
6
13
  defaultColors,
@@ -14,16 +21,11 @@ import {
14
21
  parseClass,
15
22
  parseClasses,
16
23
  resolve,
17
- setGlobalDarkMode,
18
24
  setGlobalWidth,
19
- syncGlobalDarkMode,
20
25
  syncGlobalScreens,
21
26
  syncGlobalWidth,
22
- updateConfig,
23
- useConditionalWidth,
24
- useGlobalDarkMode,
25
- useGlobalWidth
26
- } from "./chunk-NBGURNUD.mjs";
27
+ updateConfig
28
+ } from "./chunk-SHQPNCQ7.mjs";
27
29
 
28
30
  // src/context.tsx
29
31
  import { createContext, useContext } from "react";
@@ -3120,18 +3120,19 @@ function buildDivideDecls(styles) {
3120
3120
  if ("__divideStyle" in styles) parts.push(`border-style: ${String(styles.__divideStyle)}`);
3121
3121
  return parts.join("; ");
3122
3122
  }
3123
- function injectClassRule(cls, bucketKey, styles, darkMode, important = false) {
3123
+ function buildClassCSSRules(cls, bucketKey, styles, darkMode, important, screens) {
3124
+ const rules = [];
3124
3125
  if ("__keyframe" in styles && typeof styles.__keyframe === "string") {
3125
- injectRule(styles.__keyframe);
3126
+ rules.push(styles.__keyframe);
3126
3127
  }
3127
3128
  const isDivide = "__divideX" in styles || "__divideY" in styles || "__divideColor" in styles || "__divideStyle" in styles;
3128
3129
  const escaped = escapeCSSSelector(cls);
3129
3130
  const childSuffix = isDivide ? " > * + *" : "";
3130
3131
  if (bucketKey === "base") {
3131
3132
  const baseCssDecls = isDivide ? buildDivideDecls(styles) : styleValueToCSS(styles, important);
3132
- if (!baseCssDecls) return;
3133
- injectRule(`.${escaped}${childSuffix} { ${baseCssDecls} }`);
3134
- return;
3133
+ if (!baseCssDecls) return rules;
3134
+ rules.push(`.${escaped}${childSuffix} { ${baseCssDecls} }`);
3135
+ return rules;
3135
3136
  }
3136
3137
  const mods = bucketKey.split(":");
3137
3138
  const responsiveMods = mods.filter((m) => RESPONSIVE_MODS.has(m));
@@ -3161,7 +3162,7 @@ function injectClassRule(cls, bucketKey, styles, darkMode, important = false) {
3161
3162
  ]);
3162
3163
  const needsImportant = important || hasPrint || mediaMods.length > 0 || dirMods.length > 0 || ancestorMods.length > 0 || pseudoMods.some((m) => CSS_ONLY_PSEUDOS.has(m));
3163
3164
  const cssDecls = isDivide ? buildDivideDecls(styles) : styleValueToCSS(styles, needsImportant);
3164
- if (!cssDecls) return;
3165
+ if (!cssDecls) return rules;
3165
3166
  let rule;
3166
3167
  if (hasDark) {
3167
3168
  if (darkMode === "media") {
@@ -3182,20 +3183,18 @@ function injectClassRule(cls, bucketKey, styles, darkMode, important = false) {
3182
3183
  } else {
3183
3184
  rule = `${selector} { ${cssDecls} }`;
3184
3185
  }
3185
- if (hasPrint) {
3186
- rule = `@media print { ${rule} }`;
3187
- }
3188
- for (const m of mediaMods) {
3189
- rule = `@media ${MEDIA_MODS[m]} { ${rule} }`;
3190
- }
3186
+ if (hasPrint) rule = `@media print { ${rule} }`;
3187
+ for (const m of mediaMods) rule = `@media ${MEDIA_MODS[m]} { ${rule} }`;
3191
3188
  if (responsiveMods.length > 0) {
3192
- const screens = getGlobalScreens();
3193
3189
  const minWidth = Math.max(...responsiveMods.map((m) => screens[m] ?? 0));
3194
- if (minWidth > 0) {
3195
- rule = `@media (min-width: ${minWidth}px) { ${rule} }`;
3196
- }
3190
+ if (minWidth > 0) rule = `@media (min-width: ${minWidth}px) { ${rule} }`;
3197
3191
  }
3198
- injectRule(rule);
3192
+ rules.push(rule);
3193
+ return rules;
3194
+ }
3195
+ function injectClassRule(cls, bucketKey, styles, darkMode, important = false) {
3196
+ const cssRules = buildClassCSSRules(cls, bucketKey, styles, darkMode, important, getGlobalScreens());
3197
+ for (const r of cssRules) injectRule(r);
3199
3198
  }
3200
3199
  var RN_ONLY_PROPS = /* @__PURE__ */ new Set([
3201
3200
  "shadowColor",
@@ -2,8 +2,9 @@ import {
2
2
  Fragment,
3
3
  jsx,
4
4
  jsxs
5
- } from "./chunk-JTAGJGBC.mjs";
6
- import "./chunk-NBGURNUD.mjs";
5
+ } from "./chunk-HTPCUYNH.mjs";
6
+ import "./chunk-RMZIFMWE.mjs";
7
+ import "./chunk-SHQPNCQ7.mjs";
7
8
 
8
9
  // src/jsx-dev-runtime.tsx
9
10
  function jsxDEV(type, props, key, isStaticChildren, _source, _self) {
@@ -3119,18 +3119,19 @@ function buildDivideDecls(styles) {
3119
3119
  if ("__divideStyle" in styles) parts.push(`border-style: ${String(styles.__divideStyle)}`);
3120
3120
  return parts.join("; ");
3121
3121
  }
3122
- function injectClassRule(cls, bucketKey, styles, darkMode, important = false) {
3122
+ function buildClassCSSRules(cls, bucketKey, styles, darkMode, important, screens) {
3123
+ const rules = [];
3123
3124
  if ("__keyframe" in styles && typeof styles.__keyframe === "string") {
3124
- injectRule(styles.__keyframe);
3125
+ rules.push(styles.__keyframe);
3125
3126
  }
3126
3127
  const isDivide = "__divideX" in styles || "__divideY" in styles || "__divideColor" in styles || "__divideStyle" in styles;
3127
3128
  const escaped = escapeCSSSelector(cls);
3128
3129
  const childSuffix = isDivide ? " > * + *" : "";
3129
3130
  if (bucketKey === "base") {
3130
3131
  const baseCssDecls = isDivide ? buildDivideDecls(styles) : styleValueToCSS(styles, important);
3131
- if (!baseCssDecls) return;
3132
- injectRule(`.${escaped}${childSuffix} { ${baseCssDecls} }`);
3133
- return;
3132
+ if (!baseCssDecls) return rules;
3133
+ rules.push(`.${escaped}${childSuffix} { ${baseCssDecls} }`);
3134
+ return rules;
3134
3135
  }
3135
3136
  const mods = bucketKey.split(":");
3136
3137
  const responsiveMods = mods.filter((m) => RESPONSIVE_MODS.has(m));
@@ -3160,7 +3161,7 @@ function injectClassRule(cls, bucketKey, styles, darkMode, important = false) {
3160
3161
  ]);
3161
3162
  const needsImportant = important || hasPrint || mediaMods.length > 0 || dirMods.length > 0 || ancestorMods.length > 0 || pseudoMods.some((m) => CSS_ONLY_PSEUDOS.has(m));
3162
3163
  const cssDecls = isDivide ? buildDivideDecls(styles) : styleValueToCSS(styles, needsImportant);
3163
- if (!cssDecls) return;
3164
+ if (!cssDecls) return rules;
3164
3165
  let rule;
3165
3166
  if (hasDark) {
3166
3167
  if (darkMode === "media") {
@@ -3181,20 +3182,18 @@ function injectClassRule(cls, bucketKey, styles, darkMode, important = false) {
3181
3182
  } else {
3182
3183
  rule = `${selector} { ${cssDecls} }`;
3183
3184
  }
3184
- if (hasPrint) {
3185
- rule = `@media print { ${rule} }`;
3186
- }
3187
- for (const m of mediaMods) {
3188
- rule = `@media ${MEDIA_MODS[m]} { ${rule} }`;
3189
- }
3185
+ if (hasPrint) rule = `@media print { ${rule} }`;
3186
+ for (const m of mediaMods) rule = `@media ${MEDIA_MODS[m]} { ${rule} }`;
3190
3187
  if (responsiveMods.length > 0) {
3191
- const screens = getGlobalScreens();
3192
3188
  const minWidth = Math.max(...responsiveMods.map((m) => screens[m] ?? 0));
3193
- if (minWidth > 0) {
3194
- rule = `@media (min-width: ${minWidth}px) { ${rule} }`;
3195
- }
3189
+ if (minWidth > 0) rule = `@media (min-width: ${minWidth}px) { ${rule} }`;
3196
3190
  }
3197
- injectRule(rule);
3191
+ rules.push(rule);
3192
+ return rules;
3193
+ }
3194
+ function injectClassRule(cls, bucketKey, styles, darkMode, important = false) {
3195
+ const cssRules = buildClassCSSRules(cls, bucketKey, styles, darkMode, important, getGlobalScreens());
3196
+ for (const r of cssRules) injectRule(r);
3198
3197
  }
3199
3198
  var RN_ONLY_PROPS = /* @__PURE__ */ new Set([
3200
3199
  "shadowColor",
@@ -2,8 +2,9 @@ import {
2
2
  Fragment,
3
3
  jsx,
4
4
  jsxs
5
- } from "./chunk-JTAGJGBC.mjs";
6
- import "./chunk-NBGURNUD.mjs";
5
+ } from "./chunk-HTPCUYNH.mjs";
6
+ import "./chunk-RMZIFMWE.mjs";
7
+ import "./chunk-SHQPNCQ7.mjs";
7
8
  export {
8
9
  Fragment,
9
10
  jsx,
@@ -0,0 +1,70 @@
1
+ type ThemeMode = 'light' | 'dark' | 'system';
2
+ interface StyleValue {
3
+ [key: string]: string | number | undefined | null | StyleValue | unknown[];
4
+ }
5
+ interface ParsedClass {
6
+ /** The original class string, e.g. "dark:hover:bg-[#fff]" */
7
+ original: string;
8
+ /** Up to 3 modifier prefixes, e.g. ['dark', 'hover'] */
9
+ modifiers: string[];
10
+ /** Whether a leading `-` was present for negative values */
11
+ negative: boolean;
12
+ /** Whether a leading `!` was present — applies !important to all CSS declarations */
13
+ important: boolean;
14
+ /** The utility name, e.g. 'bg', 'p', 'text' */
15
+ utility: string;
16
+ /** The resolved value, e.g. 'white', '#fff', '4' */
17
+ value: string;
18
+ /** Whether the value was specified with bracket notation [value] */
19
+ isArbitrary: boolean;
20
+ }
21
+ interface ResolvedStyle {
22
+ /** Base styles applied unconditionally */
23
+ base?: StyleValue;
24
+ /** Styles keyed by modifier or modifier combo, e.g. 'dark', 'hover', 'dark:hover' */
25
+ [modifierKey: string]: StyleValue | undefined;
26
+ }
27
+ type ColorShades = Record<string, string>;
28
+ type ThemeColors = Record<string, string | ColorShades>;
29
+ type ThemeSpacing = Record<string, number | string>;
30
+ interface ThemeConfig {
31
+ colors: ThemeColors;
32
+ spacing: ThemeSpacing;
33
+ fontSize: Record<string, number | string>;
34
+ fontFamily: Record<string, string | string[]>;
35
+ fontWeight: Record<string, string | number>;
36
+ borderRadius: Record<string, number | string>;
37
+ borderWidth: Record<string, number>;
38
+ opacity: Record<string, number>;
39
+ lineHeight: Record<string, number | string>;
40
+ letterSpacing: Record<string, number | string>;
41
+ zIndex: Record<string, number | string>;
42
+ flex: Record<string, number>;
43
+ shadow: Record<string, StyleValue>;
44
+ screens: Record<string, string | number>;
45
+ [key: string]: unknown;
46
+ }
47
+ type DarkMode = 'attribute' | 'class' | 'media';
48
+ interface PluginAPI {
49
+ addUtility(name: string, styles: StyleValue): void;
50
+ addVariant(name: string, selector: string): void;
51
+ theme(path: string, defaultValue?: unknown): unknown;
52
+ e(className: string): string;
53
+ }
54
+ interface FrameworkConfig {
55
+ darkMode?: DarkMode;
56
+ theme?: Partial<ThemeConfig>;
57
+ /** Additive theme extension — accepts either `extend.theme.X` or `extend.X` directly. */
58
+ extend?: {
59
+ theme?: Partial<ThemeConfig>;
60
+ } & Partial<ThemeConfig>;
61
+ plugins?: Array<(api: PluginAPI) => void>;
62
+ content?: string[];
63
+ }
64
+ interface ResolvedConfig {
65
+ darkMode: DarkMode;
66
+ theme: ThemeConfig;
67
+ plugins: Array<(api: PluginAPI) => void>;
68
+ }
69
+
70
+ export type { FrameworkConfig as F, ParsedClass as P, ResolvedStyle as R, StyleValue as S, ThemeColors as T, ThemeConfig as a, ResolvedConfig as b, ThemeMode as c, PluginAPI as d };
@@ -0,0 +1,70 @@
1
+ type ThemeMode = 'light' | 'dark' | 'system';
2
+ interface StyleValue {
3
+ [key: string]: string | number | undefined | null | StyleValue | unknown[];
4
+ }
5
+ interface ParsedClass {
6
+ /** The original class string, e.g. "dark:hover:bg-[#fff]" */
7
+ original: string;
8
+ /** Up to 3 modifier prefixes, e.g. ['dark', 'hover'] */
9
+ modifiers: string[];
10
+ /** Whether a leading `-` was present for negative values */
11
+ negative: boolean;
12
+ /** Whether a leading `!` was present — applies !important to all CSS declarations */
13
+ important: boolean;
14
+ /** The utility name, e.g. 'bg', 'p', 'text' */
15
+ utility: string;
16
+ /** The resolved value, e.g. 'white', '#fff', '4' */
17
+ value: string;
18
+ /** Whether the value was specified with bracket notation [value] */
19
+ isArbitrary: boolean;
20
+ }
21
+ interface ResolvedStyle {
22
+ /** Base styles applied unconditionally */
23
+ base?: StyleValue;
24
+ /** Styles keyed by modifier or modifier combo, e.g. 'dark', 'hover', 'dark:hover' */
25
+ [modifierKey: string]: StyleValue | undefined;
26
+ }
27
+ type ColorShades = Record<string, string>;
28
+ type ThemeColors = Record<string, string | ColorShades>;
29
+ type ThemeSpacing = Record<string, number | string>;
30
+ interface ThemeConfig {
31
+ colors: ThemeColors;
32
+ spacing: ThemeSpacing;
33
+ fontSize: Record<string, number | string>;
34
+ fontFamily: Record<string, string | string[]>;
35
+ fontWeight: Record<string, string | number>;
36
+ borderRadius: Record<string, number | string>;
37
+ borderWidth: Record<string, number>;
38
+ opacity: Record<string, number>;
39
+ lineHeight: Record<string, number | string>;
40
+ letterSpacing: Record<string, number | string>;
41
+ zIndex: Record<string, number | string>;
42
+ flex: Record<string, number>;
43
+ shadow: Record<string, StyleValue>;
44
+ screens: Record<string, string | number>;
45
+ [key: string]: unknown;
46
+ }
47
+ type DarkMode = 'attribute' | 'class' | 'media';
48
+ interface PluginAPI {
49
+ addUtility(name: string, styles: StyleValue): void;
50
+ addVariant(name: string, selector: string): void;
51
+ theme(path: string, defaultValue?: unknown): unknown;
52
+ e(className: string): string;
53
+ }
54
+ interface FrameworkConfig {
55
+ darkMode?: DarkMode;
56
+ theme?: Partial<ThemeConfig>;
57
+ /** Additive theme extension — accepts either `extend.theme.X` or `extend.X` directly. */
58
+ extend?: {
59
+ theme?: Partial<ThemeConfig>;
60
+ } & Partial<ThemeConfig>;
61
+ plugins?: Array<(api: PluginAPI) => void>;
62
+ content?: string[];
63
+ }
64
+ interface ResolvedConfig {
65
+ darkMode: DarkMode;
66
+ theme: ThemeConfig;
67
+ plugins: Array<(api: PluginAPI) => void>;
68
+ }
69
+
70
+ export type { FrameworkConfig as F, ParsedClass as P, ResolvedStyle as R, StyleValue as S, ThemeColors as T, ThemeConfig as a, ResolvedConfig as b, ThemeMode as c, PluginAPI as d };
@@ -0,0 +1,8 @@
1
+ // TypeScript declarations for the Kbach Vite plugin virtual module.
2
+ // Add this to your tsconfig "types" array or via a triple-slash reference:
3
+ // /// <reference types="@kbach/react/vite/client" />
4
+
5
+ declare module 'virtual:kbach/styles.css' {
6
+ const css: string;
7
+ export default css;
8
+ }
@@ -0,0 +1,8 @@
1
+ // TypeScript declarations for the Kbach Vite plugin virtual module.
2
+ // Add this to your tsconfig "types" array or via a triple-slash reference:
3
+ // /// <reference types="@kbach/react/vite/client" />
4
+
5
+ declare module 'virtual:kbach/styles.css' {
6
+ const css: string;
7
+ export default css;
8
+ }
@@ -0,0 +1,21 @@
1
+ import { Plugin } from 'vite';
2
+ import { F as FrameworkConfig } from './types-CV5vXnSH.mjs';
3
+
4
+ /**
5
+ * @kbach/react/vite
6
+ *
7
+ * Vite plugin that scans source files for Kbach className/kb props and
8
+ * generates a static CSS stylesheet — no JSX runtime replacement needed.
9
+ *
10
+ * Usage in vite.config.ts:
11
+ * import { kbach } from '@kbach/react/vite';
12
+ * plugins: [kbach()]
13
+ *
14
+ * Import the generated stylesheet once in your app entry (e.g. app/root.tsx):
15
+ * import 'virtual:kbach/styles.css';
16
+ */
17
+
18
+ declare const VIRTUAL_ID = "virtual:kbach/styles.css";
19
+ declare function kbach(userConfig?: FrameworkConfig): Plugin;
20
+
21
+ export { VIRTUAL_ID, kbach };
@@ -0,0 +1,21 @@
1
+ import { Plugin } from 'vite';
2
+ import { F as FrameworkConfig } from './types-CV5vXnSH.js';
3
+
4
+ /**
5
+ * @kbach/react/vite
6
+ *
7
+ * Vite plugin that scans source files for Kbach className/kb props and
8
+ * generates a static CSS stylesheet — no JSX runtime replacement needed.
9
+ *
10
+ * Usage in vite.config.ts:
11
+ * import { kbach } from '@kbach/react/vite';
12
+ * plugins: [kbach()]
13
+ *
14
+ * Import the generated stylesheet once in your app entry (e.g. app/root.tsx):
15
+ * import 'virtual:kbach/styles.css';
16
+ */
17
+
18
+ declare const VIRTUAL_ID = "virtual:kbach/styles.css";
19
+ declare function kbach(userConfig?: FrameworkConfig): Plugin;
20
+
21
+ export { VIRTUAL_ID, kbach };