clava 0.0.2 → 0.1.1

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # clava
 
+## 0.1.1
+
+### Patch Changes
+
+- c06f0ec: Fixed `context.setDefaultVariants()` not overriding `defaultVariants`.
+
+## 0.1.0
+
+### Minor Changes
+
+- 2c1acd9: Removed `splitProps` property. It's now a separate exported function.
+
 ## 0.0.2
 
 ### Patch Changes

package/dist/index.d.ts

@@ -38,34 +38,28 @@ type SourceDefaults<S> = S extends {
   getVariants: () => infer Defaults;
 } ? Defaults : {};
 type SourceResult<T, S> = Pick<T, Extract<keyof T, SourceKeys<S>>> & Omit<SourceDefaults<S>, keyof T>;
-type SelfResult<T, Keys, Defaults> = Pick<T, Extract<keyof T, Keys>> & Omit<Defaults, keyof T>;
-type ComponentResultKeys = keyof JSXProps | keyof HTMLProps | keyof HTMLObjProps;
-type SplitPropsResult<T, V$1, D, Sources extends readonly KeySource[]> = Sources extends readonly [] ? [SelfResult<T, keyof V$1 | ComponentResultKeys, D>, Omit<T, keyof V$1 | ComponentResultKeys>] : Sources extends readonly [infer S1 extends KeySource] ? [SelfResult<T, keyof V$1 | ComponentResultKeys, D>, SourceResult<T, S1>, Omit<T, keyof V$1 | ComponentResultKeys | SourceKeys<S1>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource] ? [SelfResult<T, keyof V$1 | ComponentResultKeys, D>, SourceResult<T, S1>, SourceResult<T, S2>, Omit<T, keyof V$1 | ComponentResultKeys | SourceKeys<S1> | SourceKeys<S2>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource, infer S3 extends KeySource] ? [SelfResult<T, keyof V$1 | ComponentResultKeys, D>, SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, Omit<T, keyof V$1 | ComponentResultKeys | SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource] ? [SelfResult<T, keyof V$1 | ComponentResultKeys, D>, SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, Omit<T, keyof V$1 | ComponentResultKeys | SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource, infer S5 extends KeySource] ? [SelfResult<T, keyof V$1 | ComponentResultKeys, D>, SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, SourceResult<T, S5>, Omit<T, keyof V$1 | ComponentResultKeys | SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4> | SourceKeys<S5>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource, infer S5 extends KeySource, infer S6 extends KeySource] ? [SelfResult<T, keyof V$1 | ComponentResultKeys, D>, SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, SourceResult<T, S5>, SourceResult<T, S6>, Omit<T, keyof V$1 | ComponentResultKeys | SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4> | SourceKeys<S5> | SourceKeys<S6>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource, infer S5 extends KeySource, infer S6 extends KeySource, infer S7 extends KeySource] ? [SelfResult<T, keyof V$1 | ComponentResultKeys, D>, SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, SourceResult<T, S5>, SourceResult<T, S6>, SourceResult<T, S7>, Omit<T, keyof V$1 | ComponentResultKeys | SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4> | SourceKeys<S5> | SourceKeys<S6> | SourceKeys<S7>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource, infer S5 extends KeySource, infer S6 extends KeySource, infer S7 extends KeySource, infer S8 extends KeySource] ? [SelfResult<T, keyof V$1 | ComponentResultKeys, D>, SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, SourceResult<T, S5>, SourceResult<T, S6>, SourceResult<T, S7>, SourceResult<T, S8>, Omit<T, keyof V$1 | ComponentResultKeys | SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4> | SourceKeys<S5> | SourceKeys<S6> | SourceKeys<S7> | SourceKeys<S8>>] : unknown[];
-type SplitProps<V$1, D, _R extends ComponentResult> = <const T extends Record<string, unknown>, const Sources extends readonly KeySource[]>(props: T, ...sources: Sources) => SplitPropsResult<T, V$1, D, Sources>;
-type OnlyVariantsSplitPropsResult<T, V$1, D, Sources extends readonly KeySource[]> = Sources extends readonly [] ? [SelfResult<T, keyof V$1, D>, Omit<T, keyof V$1>] : Sources extends readonly [infer S1 extends KeySource] ? [SelfResult<T, keyof V$1, D>, SourceResult<T, S1>, Omit<T, keyof V$1 | SourceKeys<S1>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource] ? [SelfResult<T, keyof V$1, D>, SourceResult<T, S1>, SourceResult<T, S2>, Omit<T, keyof V$1 | SourceKeys<S1> | SourceKeys<S2>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource, infer S3 extends KeySource] ? [SelfResult<T, keyof V$1, D>, SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, Omit<T, keyof V$1 | SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource] ? [SelfResult<T, keyof V$1, D>, SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, Omit<T, keyof V$1 | SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource, infer S5 extends KeySource] ? [SelfResult<T, keyof V$1, D>, SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, SourceResult<T, S5>, Omit<T, keyof V$1 | SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4> | SourceKeys<S5>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource, infer S5 extends KeySource, infer S6 extends KeySource] ? [SelfResult<T, keyof V$1, D>, SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, SourceResult<T, S5>, SourceResult<T, S6>, Omit<T, keyof V$1 | SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4> | SourceKeys<S5> | SourceKeys<S6>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource, infer S5 extends KeySource, infer S6 extends KeySource, infer S7 extends KeySource] ? [SelfResult<T, keyof V$1, D>, SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, SourceResult<T, S5>, SourceResult<T, S6>, SourceResult<T, S7>, Omit<T, keyof V$1 | SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4> | SourceKeys<S5> | SourceKeys<S6> | SourceKeys<S7>>] : Sources extends readonly [infer S1 extends KeySource, infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource, infer S5 extends KeySource, infer S6 extends KeySource, infer S7 extends KeySource, infer S8 extends KeySource] ? [SelfResult<T, keyof V$1, D>, SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, SourceResult<T, S5>, SourceResult<T, S6>, SourceResult<T, S7>, SourceResult<T, S8>, Omit<T, keyof V$1 | SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4> | SourceKeys<S5> | SourceKeys<S6> | SourceKeys<S7> | SourceKeys<S8>>] : unknown[];
-type OnlyVariantsSplitProps<V$1, D> = <const T extends Record<string, unknown>, const Sources extends readonly KeySource[]>(props: T, ...sources: Sources) => OnlyVariantsSplitPropsResult<T, V$1, D, Sources>;
-interface OnlyVariantsComponent<V$1, D> {
-  splitProps: OnlyVariantsSplitProps<V$1, D>;
+type SplitPropsFunction = <T, const S1 extends KeySource, const Sources extends readonly KeySource[]>(props: T, source1: S1, ...sources: Sources) => SplitPropsFunctionResult<T, S1, Sources>;
+type SplitPropsFunctionResult<T, S1 extends KeySource, Sources extends readonly KeySource[]> = Sources extends readonly [] ? [SourceResult<T, S1>, Omit<T, SourceKeys<S1>>] : Sources extends readonly [infer S2 extends KeySource] ? [SourceResult<T, S1>, SourceResult<T, S2>, Omit<T, SourceKeys<S1> | SourceKeys<S2>>] : Sources extends readonly [infer S2 extends KeySource, infer S3 extends KeySource] ? [SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, Omit<T, SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3>>] : Sources extends readonly [infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource] ? [SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, Omit<T, SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4>>] : Sources extends readonly [infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource, infer S5 extends KeySource] ? [SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, SourceResult<T, S5>, Omit<T, SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4> | SourceKeys<S5>>] : Sources extends readonly [infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource, infer S5 extends KeySource, infer S6 extends KeySource] ? [SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, SourceResult<T, S5>, SourceResult<T, S6>, Omit<T, SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4> | SourceKeys<S5> | SourceKeys<S6>>] : Sources extends readonly [infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource, infer S5 extends KeySource, infer S6 extends KeySource, infer S7 extends KeySource] ? [SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, SourceResult<T, S5>, SourceResult<T, S6>, SourceResult<T, S7>, Omit<T, SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4> | SourceKeys<S5> | SourceKeys<S6> | SourceKeys<S7>>] : Sources extends readonly [infer S2 extends KeySource, infer S3 extends KeySource, infer S4 extends KeySource, infer S5 extends KeySource, infer S6 extends KeySource, infer S7 extends KeySource, infer S8 extends KeySource] ? [SourceResult<T, S1>, SourceResult<T, S2>, SourceResult<T, S3>, SourceResult<T, S4>, SourceResult<T, S5>, SourceResult<T, S6>, SourceResult<T, S7>, SourceResult<T, S8>, Omit<T, SourceKeys<S1> | SourceKeys<S2> | SourceKeys<S3> | SourceKeys<S4> | SourceKeys<S5> | SourceKeys<S6> | SourceKeys<S7> | SourceKeys<S8>>] : unknown[];
+interface OnlyVariantsComponent<V$1> {
   getVariants: GetVariants<V$1>;
   keys: (keyof V$1)[];
 }
-interface ModalComponent<V$1, D, R extends ComponentResult> {
+interface ModalComponent<V$1, R extends ComponentResult> {
   (props?: ComponentProps<V$1>): R;
   class: (props?: ComponentProps<V$1>) => string;
   style: (props?: ComponentProps<V$1>) => R["style"];
-  splitProps: SplitProps<V$1, D, R>;
   getVariants: GetVariants<V$1>;
   keys: (keyof V$1 | keyof R)[];
-  onlyVariants: OnlyVariantsComponent<V$1, D>;
+  onlyVariants: OnlyVariantsComponent<V$1>;
   /** @internal Base class without variants */
   _baseClass: string;
 }
-interface Component<V$1 extends Variants = {}, CV$1 extends ComputedVariants = {}, E$1 extends AnyComponent[] = [], R extends ComponentResult = ComponentResult, D = VariantValues<MergeVariants<V$1, CV$1, E$1>>> extends ModalComponent<MergeVariants<V$1, CV$1, E$1>, D, R> {
-  jsx: ModalComponent<MergeVariants<V$1, CV$1, E$1>, D, JSXProps>;
-  html: ModalComponent<MergeVariants<V$1, CV$1, E$1>, D, HTMLProps>;
-  htmlObj: ModalComponent<MergeVariants<V$1, CV$1, E$1>, D, HTMLObjProps>;
+interface Component<V$1 extends Variants = {}, CV$1 extends ComputedVariants = {}, E$1 extends AnyComponent[] = [], R extends ComponentResult = ComponentResult> extends ModalComponent<MergeVariants<V$1, CV$1, E$1>, R> {
+  jsx: ModalComponent<MergeVariants<V$1, CV$1, E$1>, JSXProps>;
+  html: ModalComponent<MergeVariants<V$1, CV$1, E$1>, HTMLProps>;
+  htmlObj: ModalComponent<MergeVariants<V$1, CV$1, E$1>, HTMLObjProps>;
 }
-type AnyComponent = Component<any, any, any, any, any> | ModalComponent<any, any, any>;
+type AnyComponent = Component<any, any, any, any> | ModalComponent<any, any>;
 type MergeExtendedVariants<T> = T extends readonly [infer First, ...infer Rest] ? ExtractVariants<First> & MergeExtendedVariants<Rest> : {};
 type MergeExtendedComputedVariants<T> = T extends readonly [infer First, ...infer Rest] ? ExtractComputedVariants<First> & MergeExtendedComputedVariants<Rest> : {};
 type ExtractVariants<T> = T extends Component<infer V, any, infer E, any> ? V & MergeExtendedVariants<E> : {};
@@ -111,14 +105,29 @@ interface CreateParams<M extends Mode> {
   defaultMode?: M;
   transformClass?: (className: string) => string;
 }
-declare function create<M extends Mode>({
+/**
+ * Splits props into multiple groups based on key sources.
+ * Each source gets its own result object containing all its matching keys.
+ * The last element is always the "rest" containing keys not claimed by any source.
+ *
+ * @example
+ * ```ts
+ * const [buttonProps, inputProps, rest] = splitProps(
+ *   props,
+ *   buttonComponent,
+ *   inputComponent.onlyVariants,
+ * );
+ * ```
+ */
+declare const splitProps: SplitPropsFunction;
+declare function create<M extends Mode = "jsx">({
   defaultMode,
   transformClass
 }?: CreateParams<M>): {
   cv: <V$1 extends Variants = {}, CV$1 extends ComputedVariants = {}, const E$1 extends AnyComponent[] = []>(config?: CVConfig<V$1, CV$1, E$1>) => Component<V$1, CV$1, E$1, StyleProps[M]>;
   cx: (...classes: ClassValue$1[]) => string;
 };
-declare const cv: <V$1 extends Variants = {}, CV$1 extends ComputedVariants = {}, const E$1 extends AnyComponent[] = []>(config?: CVConfig<V$1, CV$1, E$1>) => Component<V$1, CV$1, E$1, JSXProps | HTMLProps | HTMLObjProps, VariantValues<MergeVariants<V$1, CV$1, E$1>>>, cx: (...classes: ClassValue$1[]) => string;
+declare const cv: <V$1 extends Variants = {}, CV$1 extends ComputedVariants = {}, const E$1 extends AnyComponent[] = []>(config?: CVConfig<V$1, CV$1, E$1>) => Component<V$1, CV$1, E$1, JSXProps>, cx: (...classes: ClassValue$1[]) => string;
 //#endregion
-export { CVConfig, type ClassValue, type StyleClassValue, type StyleValue, VariantProps, create, cv, cx };
+export { CVConfig, type ClassValue, type StyleClassValue, type StyleValue, VariantProps, create, cv, cx, splitProps };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.js

@@ -325,7 +325,7 @@ function processVariants(config, resolvedVariants) {
 /**
 * Processes the computed function if present.
 */
-function processComputed(config, resolvedVariants) {
+function processComputed(config, resolvedVariants, propsVariants) {
 	const classes = [];
 	let style = {};
 	let updatedVariants = { ...resolvedVariants };
@@ -339,7 +339,7 @@ function processComputed(config, resolvedVariants) {
 				};
 			},
 			setDefaultVariants: (newDefaults) => {
-				for (const [key, value] of Object.entries(newDefaults)) if (resolvedVariants[key] === void 0) updatedVariants[key] = value;
+				for (const [key, value] of Object.entries(newDefaults)) if (propsVariants[key] === void 0) updatedVariants[key] = value;
 			}
 		};
 		const computedResult = config.computed(context);
@@ -399,6 +399,25 @@ function splitPropsImpl(selfKeys, selfDefaults, props, sources) {
 	results.push(rest);
 	return results;
 }
+/**
+* Splits props into multiple groups based on key sources.
+* Each source gets its own result object containing all its matching keys.
+* The last element is always the "rest" containing keys not claimed by any source.
+*
+* @example
+* ```ts
+* const [buttonProps, inputProps, rest] = splitProps(
+*   props,
+*   buttonComponent,
+*   inputComponent.onlyVariants,
+* );
+* ```
+*/
+const splitProps = ((props, source1, ...sources) => {
+	const normalizedSource1 = normalizeKeySource(source1);
+	const normalizedSources = sources.map(normalizeKeySource);
+	return splitPropsImpl(normalizedSource1.keys, normalizedSource1.defaults, props, normalizedSources);
+});
 function create({ defaultMode = "jsx", transformClass = (className) => className } = {}) {
 	const cx$1 = (...classes) => transformClass(clsx_default(...classes));
 	const cv$1 = (config = {}) => {
@@ -415,7 +434,7 @@ function create({ defaultMode = "jsx", transformClass = (className) => className
 			const variantProps = {};
 			for (const key of variantKeys) if (key in props) variantProps[key] = props[key];
 			let resolvedVariants = resolveVariants(config, variantProps);
-			const computedResult = processComputed(config, resolvedVariants);
+			const computedResult = processComputed(config, resolvedVariants, variantProps);
 			resolvedVariants = computedResult.updatedVariants;
 			const computedVariantKeys = new Set(config.computedVariants ? Object.keys(config.computedVariants) : []);
 			const extendedResult = processExtended(config, resolvedVariants, computedVariantKeys);
@@ -482,18 +501,11 @@ function create({ defaultMode = "jsx", transformClass = (className) => className
 				return resolveVariants(config, variants);
 			};
 			component$1.keys = propsKeys;
-			const selfDefaults = collectDefaultVariants(config);
-			component$1.splitProps = ((props, ...sources) => {
-				return splitPropsImpl(propsKeys, selfDefaults, props, sources.map(normalizeKeySource));
-			});
 			component$1.onlyVariants = {
 				getVariants: (variants) => {
 					return resolveVariants(config, variants);
 				},
-				keys: variantKeys,
-				splitProps: ((props, ...sources) => {
-					return splitPropsImpl(variantKeys, selfDefaults, props, sources.map(normalizeKeySource));
-				})
+				keys: variantKeys
 			};
 			const extendedBaseClasses = [];
 			if (config.extend) for (const ext of config.extend) extendedBaseClasses.push(ext._baseClass);
@@ -518,5 +530,5 @@ function create({ defaultMode = "jsx", transformClass = (className) => className
 const { cv, cx } = create();
 
 //#endregion
-export { create, cv, cx };
+export { create, cv, cx, splitProps };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["cx","clsx","cv","component"],"sources":["../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","../src/utils.ts","../src/index.ts"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","import type * as CSS from \"csstype\";\n\nimport type {\n  StyleValue,\n  JSXCSSProperties,\n  HTMLCSSProperties,\n} from \"./types.ts\";\n\n/**\n * Converts a hyphenated CSS property name to camelCase.\n * @example\n * hyphenToCamel(\"background-color\") // \"backgroundColor\"\n * hyphenToCamel(\"--custom-var\") // \"--custom-var\" (CSS variables are preserved)\n */\nexport function hyphenToCamel(str: string) {\n  // CSS custom properties (variables) should not be converted\n  if (str.startsWith(\"--\")) {\n    return str;\n  }\n  return str.replace(/-([a-z])/gi, (_, letter) => letter.toUpperCase());\n}\n\n/**\n * Converts a camelCase CSS property name to hyphenated form.\n * @example\n * camelToHyphen(\"backgroundColor\") // \"background-color\"\n * camelToHyphen(\"--customVar\") // \"--customVar\" (CSS variables are preserved)\n */\nexport function camelToHyphen(str: string) {\n  // CSS custom properties (variables) should not be converted\n  if (str.startsWith(\"--\")) {\n    return str;\n  }\n  return str.replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`);\n}\n\n/**\n * Parses a length value, adding \"px\" if it's a number.\n * @example\n * parseLengthValue(16); // \"16px\"\n * parseLengthValue(\"2em\"); // \"2em\"\n */\nexport function parseLengthValue(value: string | number) {\n  if (typeof value === \"string\") return value;\n  return `${value}px`;\n}\n\n/**\n * Parses a CSS style string into a StyleValue object.\n * @example\n * htmlStyleToStyleValue(\"background-color: red; font-size: 16px;\");\n * // { backgroundColor: \"red\", fontSize: \"16px\" }\n */\nexport function htmlStyleToStyleValue(styleString: string) {\n  if (!styleString) return {};\n\n  const result: StyleValue = {};\n  const declarations = styleString.split(\";\");\n\n  for (const declaration of declarations) {\n    const trimmed = declaration.trim();\n    if (!trimmed) continue;\n\n    const colonIndex = trimmed.indexOf(\":\");\n    if (colonIndex === -1) continue;\n\n    const property = trimmed.slice(0, colonIndex).trim();\n    const value = trimmed.slice(colonIndex + 1).trim();\n    if (!property) continue;\n    if (!value) continue;\n\n    const camelProperty = hyphenToCamel(property) as any;\n    result[camelProperty] = value;\n  }\n\n  return result;\n}\n\n/**\n * Converts a hyphenated style object to a camelCase StyleValue object.\n * @example\n * htmlObjStyleToStyleValue({ \"background-color\": \"red\", \"font-size\": \"16px\" });\n * // { backgroundColor: \"red\", fontSize: \"16px\" }\n */\nexport function htmlObjStyleToStyleValue(style: HTMLCSSProperties) {\n  const result: StyleValue = {};\n  for (const [key, value] of Object.entries(style)) {\n    if (value == null) continue;\n    const property = hyphenToCamel(key) as any;\n    result[property] = parseLengthValue(value);\n  }\n  return result;\n}\n\n/**\n * Converts a camelCase style object to a StyleValue object.\n * @example\n * jsxStyleToStyleValue({ backgroundColor: \"red\", fontSize: 16 });\n * // { backgroundColor: \"red\", fontSize: \"16px\" }\n */\nexport function jsxStyleToStyleValue(style: JSXCSSProperties) {\n  const result: StyleValue = {};\n  for (const [key, value] of Object.entries(style)) {\n    if (value == null) continue;\n    result[key as any] = parseLengthValue(value);\n  }\n  return result;\n}\n\n/**\n * Converts a StyleValue object to a CSS style string.\n * @example\n * styleValueToHTMLStyle({ backgroundColor: \"red\", fontSize: \"16px\" });\n * // \"background-color: red; font-size: 16px;\"\n */\nexport function styleValueToHTMLStyle(style: StyleValue): string {\n  const parts: string[] = [];\n  for (const [key, value] of Object.entries(style)) {\n    if (value == null) continue;\n    parts.push(`${camelToHyphen(key)}: ${value}`);\n  }\n  if (!parts.length) return \"\";\n  return `${parts.join(\"; \")};`;\n}\n\n/**\n * Converts a StyleValue object to a hyphenated style object.\n * @example\n * styleValueToHTMLObjStyle({ backgroundColor: \"red\", fontSize: \"16px\" });\n * // { \"background-color\": \"red\", \"font-size\": \"16px\" }\n */\nexport function styleValueToHTMLObjStyle(style: StyleValue) {\n  const result: CSS.PropertiesHyphen = {};\n  for (const [key, value] of Object.entries(style)) {\n    if (value == null) continue;\n    const property = camelToHyphen(key) as keyof HTMLCSSProperties;\n    result[property] = value;\n  }\n  return result;\n}\n\n/**\n * Converts a StyleValue object to a camelCase style object.\n * @example\n * styleValueToJSXStyle({ backgroundColor: \"red\", fontSize: \"16px\" });\n * // { backgroundColor: \"red\", fontSize: \"16px\" }\n */\nexport function styleValueToJSXStyle(style: StyleValue) {\n  return style as JSXCSSProperties;\n}\n\n/**\n * Type guard to check if a style object has hyphenated keys.\n * @example\n * isHTMLObjStyle({ \"background-color\": \"red\" }); // true\n * isHTMLObjStyle({ backgroundColor: \"red\" }); // false\n */\nexport function isHTMLObjStyle(\n  style: CSS.Properties<any> | CSS.PropertiesHyphen<any>,\n): style is CSS.PropertiesHyphen {\n  return Object.keys(style).some(\n    (key) => key.includes(\"-\") && !key.startsWith(\"--\"),\n  );\n}\n","import clsx, { type ClassValue as ClsxClassValue } from \"clsx\";\n\nimport type {\n  Variants,\n  ComputedVariants,\n  AnyComponent,\n  Component,\n  StyleProps,\n  ClassValue,\n  StyleValue,\n  StyleClassValue,\n  VariantValues,\n  Computed,\n  ExtendableVariants,\n  MergeVariants,\n  ModalComponent,\n  ComponentResult,\n  JSXProps,\n  HTMLProps,\n  HTMLObjProps,\n  OnlyVariantsComponent,\n  ComponentProps,\n  SplitProps,\n  OnlyVariantsSplitProps,\n} from \"./types.ts\";\n\nimport {\n  htmlObjStyleToStyleValue,\n  htmlStyleToStyleValue,\n  isHTMLObjStyle,\n  jsxStyleToStyleValue,\n  styleValueToHTMLObjStyle,\n  styleValueToHTMLStyle,\n  styleValueToJSXStyle,\n} from \"./utils.ts\";\n\nconst MODES = [\"jsx\", \"html\", \"htmlObj\"] as const;\ntype Mode = (typeof MODES)[number];\n\nexport type { ClassValue, StyleValue, StyleClassValue };\n\nexport type VariantProps<T extends Pick<AnyComponent, \"getVariants\">> =\n  ReturnType<T[\"getVariants\"]>;\n\nexport interface CVConfig<\n  V extends Variants = {},\n  CV extends ComputedVariants = {},\n  E extends AnyComponent[] = [],\n> {\n  extend?: E;\n  class?: ClassValue;\n  style?: StyleValue;\n  variants?: ExtendableVariants<V, E>;\n  computedVariants?: CV;\n  defaultVariants?: VariantValues<MergeVariants<V, CV, E>>;\n  computed?: Computed<MergeVariants<V, CV, E>>;\n}\n\ninterface CreateParams<M extends Mode> {\n  defaultMode?: M;\n  transformClass?: (className: string) => string;\n}\n\n/**\n * Checks if a value is a style-class object (has style properties, not just a\n * class value).\n */\nfunction isStyleClassValue(value: unknown): value is StyleClassValue {\n  if (typeof value !== \"object\") return false;\n  if (value == null) return false;\n  if (Array.isArray(value)) return false;\n  return true;\n}\n\n/**\n * Converts any style input (string, JSX object, or HTML object) to a\n * normalized StyleValue.\n */\nfunction normalizeStyle(style: unknown): StyleValue {\n  if (typeof style === \"string\") {\n    return htmlStyleToStyleValue(style);\n  }\n  if (typeof style === \"object\" && style != null) {\n    if (isHTMLObjStyle(style as Record<string, unknown>)) {\n      return htmlObjStyleToStyleValue(style as Record<string, string | number>);\n    }\n    return jsxStyleToStyleValue(style as Record<string, string | number>);\n  }\n  return {};\n}\n\n/**\n * Extracts class and style from a style-class value object.\n */\nfunction extractStyleClass(value: StyleClassValue): {\n  class: ClassValue;\n  style: StyleValue;\n} {\n  const { class: cls, ...style } = value;\n  return { class: cls, style };\n}\n\n/**\n * Processes a variant value to extract class and style.\n */\nfunction processVariantValue(value: unknown): {\n  class: ClassValue;\n  style: StyleValue;\n} {\n  if (isStyleClassValue(value)) {\n    return extractStyleClass(value);\n  }\n  return { class: value as ClassValue, style: {} };\n}\n\n/**\n * Gets all variant keys from a component's config, including extended\n * components.\n */\nfunction collectVariantKeys(\n  config: CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n): string[] {\n  const keys = new Set<string>();\n\n  // Collect from extended components\n  if (config.extend) {\n    for (const ext of config.extend) {\n      for (const key of ext.onlyVariants.keys) {\n        keys.add(key as string);\n      }\n    }\n  }\n\n  // Collect from variants\n  if (config.variants) {\n    for (const key of Object.keys(config.variants)) {\n      keys.add(key);\n    }\n  }\n\n  // Collect from computedVariants\n  if (config.computedVariants) {\n    for (const key of Object.keys(config.computedVariants)) {\n      keys.add(key);\n    }\n  }\n\n  return Array.from(keys);\n}\n\n/**\n * Collects default variants from extended components and the current config.\n * Also handles implicit boolean defaults (when only `false` key exists).\n */\nfunction collectDefaultVariants(\n  config: CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n): Record<string, unknown> {\n  let defaults: Record<string, unknown> = {};\n\n  // Collect from extended components\n  if (config.extend) {\n    for (const ext of config.extend) {\n      const extDefaults = ext.getVariants();\n      defaults = { ...defaults, ...extDefaults };\n    }\n  }\n\n  // Handle implicit boolean defaults from variants\n  // If a variant only has a `false` key and no `true` key, default to false\n  if (config.variants) {\n    for (const [variantName, variantDef] of Object.entries(config.variants)) {\n      if (isStyleClassValue(variantDef)) {\n        const keys = Object.keys(variantDef);\n        const hasFalseOnly = keys.includes(\"false\") && !keys.includes(\"true\");\n        if (hasFalseOnly && defaults[variantName] === undefined) {\n          defaults[variantName] = false;\n        }\n      }\n    }\n  }\n\n  // Override with current config's defaults\n  if (config.defaultVariants) {\n    defaults = { ...defaults, ...config.defaultVariants };\n  }\n\n  return defaults;\n}\n\n/**\n * Resolves variant values by merging defaults with provided props.\n */\nfunction resolveVariants(\n  config: CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n  props: Record<string, unknown> = {},\n): Record<string, unknown> {\n  const defaults = collectDefaultVariants(config);\n  return { ...defaults, ...props };\n}\n\n/**\n * Gets the value for a single variant based on the variant definition and the\n * selected value.\n */\nfunction getVariantResult(\n  variantDef: unknown,\n  selectedValue: unknown,\n): { class: ClassValue; style: StyleValue } {\n  // Shorthand variant: `disabled: \"disabled-class\"` means { true: \"...\" }\n  if (!isStyleClassValue(variantDef)) {\n    if (selectedValue === true) {\n      return processVariantValue(variantDef);\n    }\n    return { class: null, style: {} };\n  }\n\n  // Object variant: { sm: \"...\", lg: \"...\" }\n  const key = String(selectedValue);\n  const value = (variantDef as Record<string, unknown>)[key];\n  if (value === undefined) return { class: null, style: {} };\n\n  return processVariantValue(value);\n}\n\n/**\n * Processes extended components and returns base classes and variant classes separately.\n * Base classes should come before current component's base, variant classes come after.\n * When overrideVariantKeys is provided, those variant keys are excluded from the extended\n * component's result (used when current component's computedVariants overrides them).\n */\nfunction processExtended(\n  config: CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n  resolvedVariants: Record<string, unknown>,\n  overrideVariantKeys: Set<string> = new Set(),\n): {\n  baseClasses: ClassValue[];\n  variantClasses: ClassValue[];\n  style: StyleValue;\n} {\n  const baseClasses: ClassValue[] = [];\n  const variantClasses: ClassValue[] = [];\n  let style: StyleValue = {};\n\n  if (config.extend) {\n    for (const ext of config.extend) {\n      // Filter out variant keys that are being overridden by current component's computedVariants\n      const filteredVariants = { ...resolvedVariants };\n      for (const key of overrideVariantKeys) {\n        delete filteredVariants[key];\n      }\n\n      // Get the result with filtered variants (excluding overridden keys)\n      const extResult = ext({ ...filteredVariants });\n\n      // Only merge style for non-overridden keys\n      const extStyle = normalizeStyle(extResult.style);\n      style = { ...style, ...extStyle };\n\n      // Get base class from internal property (no variants)\n      const baseClass = ext._baseClass;\n      baseClasses.push(baseClass);\n\n      // Get full class with variants\n      const fullClass =\n        \"className\" in extResult ? extResult.className : extResult.class;\n\n      // Extract variant portion (full class minus base class)\n      if (fullClass && baseClass) {\n        const baseClassSet = new Set(baseClass.split(\" \").filter(Boolean));\n        const variantPortion = fullClass\n          .split(\" \")\n          .filter((c: string) => c && !baseClassSet.has(c))\n          .join(\" \");\n        if (variantPortion) {\n          variantClasses.push(variantPortion);\n        }\n      } else if (fullClass && !baseClass) {\n        variantClasses.push(fullClass);\n      }\n    }\n  }\n\n  return { baseClasses, variantClasses, style };\n}\n\n/**\n * Processes all variants (not extended) and returns accumulated class and\n * style.\n */\nfunction processVariants(\n  config: CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n  resolvedVariants: Record<string, unknown>,\n): { classes: ClassValue[]; style: StyleValue } {\n  const classes: ClassValue[] = [];\n  let style: StyleValue = {};\n\n  // Process current component's variants\n  if (config.variants) {\n    for (const [variantName, variantDef] of Object.entries(config.variants)) {\n      const selectedValue = resolvedVariants[variantName];\n      if (selectedValue === undefined) continue;\n\n      const result = getVariantResult(variantDef, selectedValue);\n      classes.push(result.class);\n      style = { ...style, ...result.style };\n    }\n  }\n\n  // Process computedVariants\n  if (config.computedVariants) {\n    for (const [variantName, computeFn] of Object.entries(\n      config.computedVariants,\n    )) {\n      const selectedValue = resolvedVariants[variantName];\n      if (selectedValue === undefined) continue;\n\n      const computedResult = computeFn(selectedValue);\n      const result = processVariantValue(computedResult);\n      classes.push(result.class);\n      style = { ...style, ...result.style };\n    }\n  }\n\n  return { classes, style };\n}\n\n/**\n * Processes the computed function if present.\n */\nfunction processComputed(\n  config: CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n  resolvedVariants: Record<string, unknown>,\n): {\n  classes: ClassValue[];\n  style: StyleValue;\n  updatedVariants: Record<string, unknown>;\n} {\n  const classes: ClassValue[] = [];\n  let style: StyleValue = {};\n  let updatedVariants = { ...resolvedVariants };\n\n  if (config.computed) {\n    const context = {\n      variants: resolvedVariants,\n      setVariants: (newVariants: VariantValues<Record<string, unknown>>) => {\n        updatedVariants = { ...updatedVariants, ...newVariants };\n      },\n      setDefaultVariants: (\n        newDefaults: VariantValues<Record<string, unknown>>,\n      ) => {\n        // Only apply defaults for variants not already set\n        for (const [key, value] of Object.entries(newDefaults)) {\n          if (resolvedVariants[key] === undefined) {\n            updatedVariants[key] = value;\n          }\n        }\n      },\n    };\n\n    const computedResult = config.computed(context);\n    if (computedResult != null) {\n      const result = processVariantValue(computedResult);\n      classes.push(result.class);\n      style = { ...style, ...result.style };\n    }\n  }\n\n  return { classes, style, updatedVariants };\n}\n\n/**\n * Normalizes a key source (array or component) to an object with keys and defaults.\n */\nfunction normalizeKeySource(source: unknown): {\n  keys: string[];\n  defaults: Record<string, unknown>;\n} {\n  if (Array.isArray(source)) {\n    return { keys: source as string[], defaults: {} };\n  }\n  // Components are functions with keys property, onlyVariants are objects with keys\n  if (\n    source &&\n    (typeof source === \"object\" || typeof source === \"function\") &&\n    \"keys\" in source\n  ) {\n    const keys = [...(source as { keys: string[] }).keys] as string[];\n    const defaults =\n      \"getVariants\" in source\n        ? (\n            source as { getVariants: () => Record<string, unknown> }\n          ).getVariants()\n        : {};\n    return { keys, defaults };\n  }\n  return { keys: [], defaults: {} };\n}\n\n/**\n * Splits props into multiple groups based on key sources.\n */\nfunction splitPropsImpl(\n  selfKeys: string[],\n  selfDefaults: Record<string, unknown>,\n  props: Record<string, unknown>,\n  sources: Array<{ keys: string[]; defaults: Record<string, unknown> }>,\n): Record<string, unknown>[] {\n  const allUsedKeys = new Set<string>(selfKeys);\n  const results: Record<string, unknown>[] = [];\n\n  // Self result with defaults\n  const selfResult: Record<string, unknown> = {};\n  // First apply defaults\n  for (const [key, value] of Object.entries(selfDefaults)) {\n    if (selfKeys.includes(key)) {\n      selfResult[key] = value;\n    }\n  }\n  // Then override with props\n  for (const key of selfKeys) {\n    if (key in props) {\n      selfResult[key] = props[key];\n    }\n  }\n  results.push(selfResult);\n\n  // Process each source\n  for (const source of sources) {\n    const sourceResult: Record<string, unknown> = {};\n    // First apply defaults\n    for (const [key, value] of Object.entries(source.defaults)) {\n      if (source.keys.includes(key)) {\n        sourceResult[key] = value;\n      }\n    }\n    // Then override with props\n    for (const key of source.keys) {\n      allUsedKeys.add(key);\n      if (key in props) {\n        sourceResult[key] = props[key];\n      }\n    }\n    results.push(sourceResult);\n  }\n\n  // Rest - keys not used by anyone\n  const rest: Record<string, unknown> = {};\n  for (const [key, value] of Object.entries(props)) {\n    if (!allUsedKeys.has(key)) {\n      rest[key] = value;\n    }\n  }\n  results.push(rest);\n\n  return results;\n}\n\nexport function create<M extends Mode>({\n  defaultMode = \"jsx\" as M,\n  transformClass = (className) => className,\n}: CreateParams<M> = {}) {\n  const cx = (...classes: ClsxClassValue[]) => transformClass(clsx(...classes));\n\n  const cv = <\n    V extends Variants = {},\n    CV extends ComputedVariants = {},\n    const E extends AnyComponent[] = [],\n  >(\n    config: CVConfig<V, CV, E> = {},\n  ): Component<V, CV, E, StyleProps[M]> => {\n    type MergedVariants = MergeVariants<V, CV, E>;\n\n    const variantKeys = collectVariantKeys(\n      config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n    );\n\n    const getClassPropertyName = (mode: Mode) =>\n      mode === \"jsx\" ? \"className\" : \"class\";\n\n    const getPropsKeys = (mode: Mode) => [\n      getClassPropertyName(mode),\n      \"style\",\n      ...variantKeys,\n    ];\n\n    const computeResult = (\n      props: ComponentProps<MergedVariants> = {},\n    ): { className: string; style: StyleValue } => {\n      const allClasses: ClassValue[] = [];\n      let allStyle: StyleValue = {};\n\n      // Extract variant props from input\n      const variantProps: Record<string, unknown> = {};\n      for (const key of variantKeys) {\n        if (key in props) {\n          variantProps[key] = (props as Record<string, unknown>)[key];\n        }\n      }\n\n      // Resolve variants with defaults\n      let resolvedVariants = resolveVariants(\n        config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n        variantProps,\n      );\n\n      // Process computed first to potentially update variants\n      const computedResult = processComputed(\n        config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n        resolvedVariants,\n      );\n      resolvedVariants = computedResult.updatedVariants;\n\n      // Collect computedVariants keys that will override extended variants\n      const computedVariantKeys = new Set<string>(\n        config.computedVariants ? Object.keys(config.computedVariants) : [],\n      );\n\n      // Process extended components (separates base and variant classes)\n      const extendedResult = processExtended(\n        config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n        resolvedVariants,\n        computedVariantKeys,\n      );\n\n      // 1. Extended base classes first\n      allClasses.push(...extendedResult.baseClasses);\n      allStyle = { ...allStyle, ...extendedResult.style };\n\n      // 2. Current component's base class\n      allClasses.push(config.class);\n\n      // 3. Add base style\n      if (config.style) {\n        allStyle = { ...allStyle, ...config.style };\n      }\n\n      // 4. Extended variant classes\n      allClasses.push(...extendedResult.variantClasses);\n\n      // 5. Current component's variants\n      const variantsResult = processVariants(\n        config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n        resolvedVariants,\n      );\n      allClasses.push(...variantsResult.classes);\n      allStyle = { ...allStyle, ...variantsResult.style };\n\n      // Add computed results\n      allClasses.push(...computedResult.classes);\n      allStyle = { ...allStyle, ...computedResult.style };\n\n      // Merge class from props\n      if (\"class\" in props) {\n        allClasses.push(props.class);\n      }\n      if (\"className\" in props) {\n        allClasses.push(props.className);\n      }\n\n      // Merge style from props\n      if (props.style != null) {\n        allStyle = { ...allStyle, ...normalizeStyle(props.style) };\n      }\n\n      return {\n        className: cx(...(allClasses as ClsxClassValue[])),\n        style: allStyle,\n      };\n    };\n\n    type Defaults = VariantValues<MergedVariants>;\n\n    const createModalComponent = <R extends ComponentResult>(\n      mode: Mode,\n    ): ModalComponent<MergedVariants, Defaults, R> => {\n      const propsKeys = getPropsKeys(mode);\n\n      const component = ((props: ComponentProps<MergedVariants> = {}) => {\n        const { className, style } = computeResult(props);\n\n        if (mode === \"jsx\") {\n          return { className, style: styleValueToJSXStyle(style) } as R;\n        }\n        if (mode === \"html\") {\n          return {\n            class: className,\n            style: styleValueToHTMLStyle(style),\n          } as R;\n        }\n        // htmlObj\n        return {\n          class: className,\n          style: styleValueToHTMLObjStyle(style),\n        } as R;\n      }) as ModalComponent<MergedVariants, Defaults, R>;\n\n      component.class = (props: ComponentProps<MergedVariants> = {}) => {\n        return computeResult(props).className;\n      };\n\n      component.style = ((props: ComponentProps<MergedVariants> = {}) => {\n        const { style } = computeResult(props);\n        if (mode === \"jsx\") return styleValueToJSXStyle(style);\n        if (mode === \"html\") return styleValueToHTMLStyle(style);\n        return styleValueToHTMLObjStyle(style);\n      }) as ModalComponent<MergedVariants, Defaults, R>[\"style\"];\n\n      component.getVariants = (\n        variants?: VariantValues<MergedVariants>,\n      ): VariantValues<MergedVariants> => {\n        return resolveVariants(\n          config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n          variants as VariantValues<Record<string, unknown>>,\n        ) as VariantValues<MergedVariants>;\n      };\n\n      component.keys = propsKeys as (keyof MergedVariants | keyof R)[];\n\n      const selfDefaults = collectDefaultVariants(\n        config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n      );\n\n      component.splitProps = ((\n        props: Record<string, unknown>,\n        ...sources: unknown[]\n      ) => {\n        const normalizedSources = sources.map(normalizeKeySource);\n        return splitPropsImpl(\n          propsKeys,\n          selfDefaults,\n          props,\n          normalizedSources,\n        );\n      }) as SplitProps<MergedVariants, VariantValues<MergedVariants>, R>;\n\n      component.onlyVariants = {\n        getVariants: (\n          variants?: VariantValues<MergedVariants>,\n        ): VariantValues<MergedVariants> => {\n          return resolveVariants(\n            config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n            variants as VariantValues<Record<string, unknown>>,\n          ) as VariantValues<MergedVariants>;\n        },\n        keys: variantKeys as (keyof MergedVariants)[],\n        splitProps: ((\n          props: Record<string, unknown>,\n          ...sources: unknown[]\n        ) => {\n          const normalizedSources = sources.map(normalizeKeySource);\n          return splitPropsImpl(\n            variantKeys,\n            selfDefaults,\n            props,\n            normalizedSources,\n          );\n        }) as OnlyVariantsSplitProps<\n          MergedVariants,\n          VariantValues<MergedVariants>\n        >,\n      } as OnlyVariantsComponent<MergedVariants, VariantValues<MergedVariants>>;\n\n      // Compute base class (without variants) - includes extended base classes\n      const extendedBaseClasses: ClassValue[] = [];\n      if (config.extend) {\n        for (const ext of config.extend) {\n          extendedBaseClasses.push(ext._baseClass);\n        }\n      }\n      component._baseClass = cx(\n        ...(extendedBaseClasses as ClsxClassValue[]),\n        config.class as ClsxClassValue,\n      );\n\n      return component;\n    };\n\n    // Create the default modal component\n    const defaultComponent = createModalComponent<StyleProps[M]>(defaultMode);\n\n    // Create all modal variants\n    const jsxComponent = createModalComponent<JSXProps>(\"jsx\");\n    const htmlComponent = createModalComponent<HTMLProps>(\"html\");\n    const htmlObjComponent = createModalComponent<HTMLObjProps>(\"htmlObj\");\n\n    // Build the final component\n    const component = defaultComponent as Component<V, CV, E, StyleProps[M]>;\n    component.jsx = jsxComponent;\n    component.html = htmlComponent;\n    component.htmlObj = htmlObjComponent;\n\n    return component;\n  };\n\n  return { cv, cx };\n}\n\nexport const { cv, cx } = create();\n"],"x_google_ignoreList":[0],"mappings":"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"}
+{"version":3,"file":"index.js","names":["cx","clsx","cv","component"],"sources":["../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","../src/utils.ts","../src/index.ts"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","import type * as CSS from \"csstype\";\nimport type {\n  StyleValue,\n  JSXCSSProperties,\n  HTMLCSSProperties,\n} from \"./types.ts\";\n\n/**\n * Converts a hyphenated CSS property name to camelCase.\n * @example\n * hyphenToCamel(\"background-color\") // \"backgroundColor\"\n * hyphenToCamel(\"--custom-var\") // \"--custom-var\" (CSS variables are preserved)\n */\nexport function hyphenToCamel(str: string) {\n  // CSS custom properties (variables) should not be converted\n  if (str.startsWith(\"--\")) {\n    return str;\n  }\n  return str.replace(/-([a-z])/gi, (_, letter) => letter.toUpperCase());\n}\n\n/**\n * Converts a camelCase CSS property name to hyphenated form.\n * @example\n * camelToHyphen(\"backgroundColor\") // \"background-color\"\n * camelToHyphen(\"--customVar\") // \"--customVar\" (CSS variables are preserved)\n */\nexport function camelToHyphen(str: string) {\n  // CSS custom properties (variables) should not be converted\n  if (str.startsWith(\"--\")) {\n    return str;\n  }\n  return str.replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`);\n}\n\n/**\n * Parses a length value, adding \"px\" if it's a number.\n * @example\n * parseLengthValue(16); // \"16px\"\n * parseLengthValue(\"2em\"); // \"2em\"\n */\nexport function parseLengthValue(value: string | number) {\n  if (typeof value === \"string\") return value;\n  return `${value}px`;\n}\n\n/**\n * Parses a CSS style string into a StyleValue object.\n * @example\n * htmlStyleToStyleValue(\"background-color: red; font-size: 16px;\");\n * // { backgroundColor: \"red\", fontSize: \"16px\" }\n */\nexport function htmlStyleToStyleValue(styleString: string) {\n  if (!styleString) return {};\n\n  const result: StyleValue = {};\n  const declarations = styleString.split(\";\");\n\n  for (const declaration of declarations) {\n    const trimmed = declaration.trim();\n    if (!trimmed) continue;\n\n    const colonIndex = trimmed.indexOf(\":\");\n    if (colonIndex === -1) continue;\n\n    const property = trimmed.slice(0, colonIndex).trim();\n    const value = trimmed.slice(colonIndex + 1).trim();\n    if (!property) continue;\n    if (!value) continue;\n\n    const camelProperty = hyphenToCamel(property) as any;\n    result[camelProperty] = value;\n  }\n\n  return result;\n}\n\n/**\n * Converts a hyphenated style object to a camelCase StyleValue object.\n * @example\n * htmlObjStyleToStyleValue({ \"background-color\": \"red\", \"font-size\": \"16px\" });\n * // { backgroundColor: \"red\", fontSize: \"16px\" }\n */\nexport function htmlObjStyleToStyleValue(style: HTMLCSSProperties) {\n  const result: StyleValue = {};\n  for (const [key, value] of Object.entries(style)) {\n    if (value == null) continue;\n    const property = hyphenToCamel(key) as any;\n    result[property] = parseLengthValue(value);\n  }\n  return result;\n}\n\n/**\n * Converts a camelCase style object to a StyleValue object.\n * @example\n * jsxStyleToStyleValue({ backgroundColor: \"red\", fontSize: 16 });\n * // { backgroundColor: \"red\", fontSize: \"16px\" }\n */\nexport function jsxStyleToStyleValue(style: JSXCSSProperties) {\n  const result: StyleValue = {};\n  for (const [key, value] of Object.entries(style)) {\n    if (value == null) continue;\n    result[key as any] = parseLengthValue(value);\n  }\n  return result;\n}\n\n/**\n * Converts a StyleValue object to a CSS style string.\n * @example\n * styleValueToHTMLStyle({ backgroundColor: \"red\", fontSize: \"16px\" });\n * // \"background-color: red; font-size: 16px;\"\n */\nexport function styleValueToHTMLStyle(style: StyleValue): string {\n  const parts: string[] = [];\n  for (const [key, value] of Object.entries(style)) {\n    if (value == null) continue;\n    parts.push(`${camelToHyphen(key)}: ${value}`);\n  }\n  if (!parts.length) return \"\";\n  return `${parts.join(\"; \")};`;\n}\n\n/**\n * Converts a StyleValue object to a hyphenated style object.\n * @example\n * styleValueToHTMLObjStyle({ backgroundColor: \"red\", fontSize: \"16px\" });\n * // { \"background-color\": \"red\", \"font-size\": \"16px\" }\n */\nexport function styleValueToHTMLObjStyle(style: StyleValue) {\n  const result: CSS.PropertiesHyphen = {};\n  for (const [key, value] of Object.entries(style)) {\n    if (value == null) continue;\n    const property = camelToHyphen(key) as keyof HTMLCSSProperties;\n    result[property] = value;\n  }\n  return result;\n}\n\n/**\n * Converts a StyleValue object to a camelCase style object.\n * @example\n * styleValueToJSXStyle({ backgroundColor: \"red\", fontSize: \"16px\" });\n * // { backgroundColor: \"red\", fontSize: \"16px\" }\n */\nexport function styleValueToJSXStyle(style: StyleValue) {\n  return style as JSXCSSProperties;\n}\n\n/**\n * Type guard to check if a style object has hyphenated keys.\n * @example\n * isHTMLObjStyle({ \"background-color\": \"red\" }); // true\n * isHTMLObjStyle({ backgroundColor: \"red\" }); // false\n */\nexport function isHTMLObjStyle(\n  style: CSS.Properties<any> | CSS.PropertiesHyphen<any>,\n): style is CSS.PropertiesHyphen {\n  return Object.keys(style).some(\n    (key) => key.includes(\"-\") && !key.startsWith(\"--\"),\n  );\n}\n","import clsx, { type ClassValue as ClsxClassValue } from \"clsx\";\nimport type {\n  Variants,\n  ComputedVariants,\n  AnyComponent,\n  Component,\n  StyleProps,\n  ClassValue,\n  StyleValue,\n  StyleClassValue,\n  VariantValues,\n  Computed,\n  ExtendableVariants,\n  MergeVariants,\n  ModalComponent,\n  ComponentResult,\n  JSXProps,\n  HTMLProps,\n  HTMLObjProps,\n  OnlyVariantsComponent,\n  ComponentProps,\n  SplitPropsFunction,\n} from \"./types.ts\";\nimport {\n  htmlObjStyleToStyleValue,\n  htmlStyleToStyleValue,\n  isHTMLObjStyle,\n  jsxStyleToStyleValue,\n  styleValueToHTMLObjStyle,\n  styleValueToHTMLStyle,\n  styleValueToJSXStyle,\n} from \"./utils.ts\";\n\nconst MODES = [\"jsx\", \"html\", \"htmlObj\"] as const;\ntype Mode = (typeof MODES)[number];\n\nexport type { ClassValue, StyleValue, StyleClassValue };\n\nexport type VariantProps<T extends Pick<AnyComponent, \"getVariants\">> =\n  ReturnType<T[\"getVariants\"]>;\n\nexport interface CVConfig<\n  V extends Variants = {},\n  CV extends ComputedVariants = {},\n  E extends AnyComponent[] = [],\n> {\n  extend?: E;\n  class?: ClassValue;\n  style?: StyleValue;\n  variants?: ExtendableVariants<V, E>;\n  computedVariants?: CV;\n  defaultVariants?: VariantValues<MergeVariants<V, CV, E>>;\n  computed?: Computed<MergeVariants<V, CV, E>>;\n}\n\ninterface CreateParams<M extends Mode> {\n  defaultMode?: M;\n  transformClass?: (className: string) => string;\n}\n\n/**\n * Checks if a value is a style-class object (has style properties, not just a\n * class value).\n */\nfunction isStyleClassValue(value: unknown): value is StyleClassValue {\n  if (typeof value !== \"object\") return false;\n  if (value == null) return false;\n  if (Array.isArray(value)) return false;\n  return true;\n}\n\n/**\n * Converts any style input (string, JSX object, or HTML object) to a\n * normalized StyleValue.\n */\nfunction normalizeStyle(style: unknown): StyleValue {\n  if (typeof style === \"string\") {\n    return htmlStyleToStyleValue(style);\n  }\n  if (typeof style === \"object\" && style != null) {\n    if (isHTMLObjStyle(style as Record<string, unknown>)) {\n      return htmlObjStyleToStyleValue(style as Record<string, string | number>);\n    }\n    return jsxStyleToStyleValue(style as Record<string, string | number>);\n  }\n  return {};\n}\n\n/**\n * Extracts class and style from a style-class value object.\n */\nfunction extractStyleClass(value: StyleClassValue): {\n  class: ClassValue;\n  style: StyleValue;\n} {\n  const { class: cls, ...style } = value;\n  return { class: cls, style };\n}\n\n/**\n * Processes a variant value to extract class and style.\n */\nfunction processVariantValue(value: unknown): {\n  class: ClassValue;\n  style: StyleValue;\n} {\n  if (isStyleClassValue(value)) {\n    return extractStyleClass(value);\n  }\n  return { class: value as ClassValue, style: {} };\n}\n\n/**\n * Gets all variant keys from a component's config, including extended\n * components.\n */\nfunction collectVariantKeys(\n  config: CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n): string[] {\n  const keys = new Set<string>();\n\n  // Collect from extended components\n  if (config.extend) {\n    for (const ext of config.extend) {\n      for (const key of ext.onlyVariants.keys) {\n        keys.add(key as string);\n      }\n    }\n  }\n\n  // Collect from variants\n  if (config.variants) {\n    for (const key of Object.keys(config.variants)) {\n      keys.add(key);\n    }\n  }\n\n  // Collect from computedVariants\n  if (config.computedVariants) {\n    for (const key of Object.keys(config.computedVariants)) {\n      keys.add(key);\n    }\n  }\n\n  return Array.from(keys);\n}\n\n/**\n * Collects default variants from extended components and the current config.\n * Also handles implicit boolean defaults (when only `false` key exists).\n */\nfunction collectDefaultVariants(\n  config: CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n): Record<string, unknown> {\n  let defaults: Record<string, unknown> = {};\n\n  // Collect from extended components\n  if (config.extend) {\n    for (const ext of config.extend) {\n      const extDefaults = ext.getVariants();\n      defaults = { ...defaults, ...extDefaults };\n    }\n  }\n\n  // Handle implicit boolean defaults from variants\n  // If a variant only has a `false` key and no `true` key, default to false\n  if (config.variants) {\n    for (const [variantName, variantDef] of Object.entries(config.variants)) {\n      if (isStyleClassValue(variantDef)) {\n        const keys = Object.keys(variantDef);\n        const hasFalseOnly = keys.includes(\"false\") && !keys.includes(\"true\");\n        if (hasFalseOnly && defaults[variantName] === undefined) {\n          defaults[variantName] = false;\n        }\n      }\n    }\n  }\n\n  // Override with current config's defaults\n  if (config.defaultVariants) {\n    defaults = { ...defaults, ...config.defaultVariants };\n  }\n\n  return defaults;\n}\n\n/**\n * Resolves variant values by merging defaults with provided props.\n */\nfunction resolveVariants(\n  config: CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n  props: Record<string, unknown> = {},\n): Record<string, unknown> {\n  const defaults = collectDefaultVariants(config);\n  return { ...defaults, ...props };\n}\n\n/**\n * Gets the value for a single variant based on the variant definition and the\n * selected value.\n */\nfunction getVariantResult(\n  variantDef: unknown,\n  selectedValue: unknown,\n): { class: ClassValue; style: StyleValue } {\n  // Shorthand variant: `disabled: \"disabled-class\"` means { true: \"...\" }\n  if (!isStyleClassValue(variantDef)) {\n    if (selectedValue === true) {\n      return processVariantValue(variantDef);\n    }\n    return { class: null, style: {} };\n  }\n\n  // Object variant: { sm: \"...\", lg: \"...\" }\n  const key = String(selectedValue);\n  const value = (variantDef as Record<string, unknown>)[key];\n  if (value === undefined) return { class: null, style: {} };\n\n  return processVariantValue(value);\n}\n\n/**\n * Processes extended components and returns base classes and variant classes separately.\n * Base classes should come before current component's base, variant classes come after.\n * When overrideVariantKeys is provided, those variant keys are excluded from the extended\n * component's result (used when current component's computedVariants overrides them).\n */\nfunction processExtended(\n  config: CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n  resolvedVariants: Record<string, unknown>,\n  overrideVariantKeys: Set<string> = new Set(),\n): {\n  baseClasses: ClassValue[];\n  variantClasses: ClassValue[];\n  style: StyleValue;\n} {\n  const baseClasses: ClassValue[] = [];\n  const variantClasses: ClassValue[] = [];\n  let style: StyleValue = {};\n\n  if (config.extend) {\n    for (const ext of config.extend) {\n      // Filter out variant keys that are being overridden by current component's computedVariants\n      const filteredVariants = { ...resolvedVariants };\n      for (const key of overrideVariantKeys) {\n        delete filteredVariants[key];\n      }\n\n      // Get the result with filtered variants (excluding overridden keys)\n      const extResult = ext({ ...filteredVariants });\n\n      // Only merge style for non-overridden keys\n      const extStyle = normalizeStyle(extResult.style);\n      style = { ...style, ...extStyle };\n\n      // Get base class from internal property (no variants)\n      const baseClass = ext._baseClass;\n      baseClasses.push(baseClass);\n\n      // Get full class with variants\n      const fullClass =\n        \"className\" in extResult ? extResult.className : extResult.class;\n\n      // Extract variant portion (full class minus base class)\n      if (fullClass && baseClass) {\n        const baseClassSet = new Set(baseClass.split(\" \").filter(Boolean));\n        const variantPortion = fullClass\n          .split(\" \")\n          .filter((c: string) => c && !baseClassSet.has(c))\n          .join(\" \");\n        if (variantPortion) {\n          variantClasses.push(variantPortion);\n        }\n      } else if (fullClass && !baseClass) {\n        variantClasses.push(fullClass);\n      }\n    }\n  }\n\n  return { baseClasses, variantClasses, style };\n}\n\n/**\n * Processes all variants (not extended) and returns accumulated class and\n * style.\n */\nfunction processVariants(\n  config: CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n  resolvedVariants: Record<string, unknown>,\n): { classes: ClassValue[]; style: StyleValue } {\n  const classes: ClassValue[] = [];\n  let style: StyleValue = {};\n\n  // Process current component's variants\n  if (config.variants) {\n    for (const [variantName, variantDef] of Object.entries(config.variants)) {\n      const selectedValue = resolvedVariants[variantName];\n      if (selectedValue === undefined) continue;\n\n      const result = getVariantResult(variantDef, selectedValue);\n      classes.push(result.class);\n      style = { ...style, ...result.style };\n    }\n  }\n\n  // Process computedVariants\n  if (config.computedVariants) {\n    for (const [variantName, computeFn] of Object.entries(\n      config.computedVariants,\n    )) {\n      const selectedValue = resolvedVariants[variantName];\n      if (selectedValue === undefined) continue;\n\n      const computedResult = computeFn(selectedValue);\n      const result = processVariantValue(computedResult);\n      classes.push(result.class);\n      style = { ...style, ...result.style };\n    }\n  }\n\n  return { classes, style };\n}\n\n/**\n * Processes the computed function if present.\n */\nfunction processComputed(\n  config: CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n  resolvedVariants: Record<string, unknown>,\n  propsVariants: Record<string, unknown>,\n): {\n  classes: ClassValue[];\n  style: StyleValue;\n  updatedVariants: Record<string, unknown>;\n} {\n  const classes: ClassValue[] = [];\n  let style: StyleValue = {};\n  let updatedVariants = { ...resolvedVariants };\n\n  if (config.computed) {\n    const context = {\n      variants: resolvedVariants,\n      setVariants: (newVariants: VariantValues<Record<string, unknown>>) => {\n        updatedVariants = { ...updatedVariants, ...newVariants };\n      },\n      setDefaultVariants: (\n        newDefaults: VariantValues<Record<string, unknown>>,\n      ) => {\n        // Only apply defaults for variants not explicitly set in props\n        for (const [key, value] of Object.entries(newDefaults)) {\n          if (propsVariants[key] === undefined) {\n            updatedVariants[key] = value;\n          }\n        }\n      },\n    };\n\n    const computedResult = config.computed(context);\n    if (computedResult != null) {\n      const result = processVariantValue(computedResult);\n      classes.push(result.class);\n      style = { ...style, ...result.style };\n    }\n  }\n\n  return { classes, style, updatedVariants };\n}\n\n/**\n * Normalizes a key source (array or component) to an object with keys and defaults.\n */\nfunction normalizeKeySource(source: unknown): {\n  keys: string[];\n  defaults: Record<string, unknown>;\n} {\n  if (Array.isArray(source)) {\n    return { keys: source as string[], defaults: {} };\n  }\n  // Components are functions with keys property, onlyVariants are objects with keys\n  if (\n    source &&\n    (typeof source === \"object\" || typeof source === \"function\") &&\n    \"keys\" in source\n  ) {\n    const keys = [...(source as { keys: string[] }).keys] as string[];\n    const defaults =\n      \"getVariants\" in source\n        ? (\n            source as { getVariants: () => Record<string, unknown> }\n          ).getVariants()\n        : {};\n    return { keys, defaults };\n  }\n  return { keys: [], defaults: {} };\n}\n\n/**\n * Splits props into multiple groups based on key sources.\n */\nfunction splitPropsImpl(\n  selfKeys: string[],\n  selfDefaults: Record<string, unknown>,\n  props: Record<string, unknown>,\n  sources: Array<{ keys: string[]; defaults: Record<string, unknown> }>,\n): Record<string, unknown>[] {\n  const allUsedKeys = new Set<string>(selfKeys);\n  const results: Record<string, unknown>[] = [];\n\n  // Self result with defaults\n  const selfResult: Record<string, unknown> = {};\n  // First apply defaults\n  for (const [key, value] of Object.entries(selfDefaults)) {\n    if (selfKeys.includes(key)) {\n      selfResult[key] = value;\n    }\n  }\n  // Then override with props\n  for (const key of selfKeys) {\n    if (key in props) {\n      selfResult[key] = props[key];\n    }\n  }\n  results.push(selfResult);\n\n  // Process each source\n  for (const source of sources) {\n    const sourceResult: Record<string, unknown> = {};\n    // First apply defaults\n    for (const [key, value] of Object.entries(source.defaults)) {\n      if (source.keys.includes(key)) {\n        sourceResult[key] = value;\n      }\n    }\n    // Then override with props\n    for (const key of source.keys) {\n      allUsedKeys.add(key);\n      if (key in props) {\n        sourceResult[key] = props[key];\n      }\n    }\n    results.push(sourceResult);\n  }\n\n  // Rest - keys not used by anyone\n  const rest: Record<string, unknown> = {};\n  for (const [key, value] of Object.entries(props)) {\n    if (!allUsedKeys.has(key)) {\n      rest[key] = value;\n    }\n  }\n  results.push(rest);\n\n  return results;\n}\n\n/**\n * Splits props into multiple groups based on key sources.\n * Each source gets its own result object containing all its matching keys.\n * The last element is always the \"rest\" containing keys not claimed by any source.\n *\n * @example\n * ```ts\n * const [buttonProps, inputProps, rest] = splitProps(\n *   props,\n *   buttonComponent,\n *   inputComponent.onlyVariants,\n * );\n * ```\n */\nexport const splitProps: SplitPropsFunction = ((\n  props: Record<string, unknown>,\n  source1: unknown,\n  ...sources: unknown[]\n) => {\n  const normalizedSource1 = normalizeKeySource(source1);\n  const normalizedSources = sources.map(normalizeKeySource);\n  return splitPropsImpl(\n    normalizedSource1.keys,\n    normalizedSource1.defaults,\n    props,\n    normalizedSources,\n  );\n}) as SplitPropsFunction;\n\nexport function create<M extends Mode = \"jsx\">({\n  defaultMode = \"jsx\" as M,\n  transformClass = (className) => className,\n}: CreateParams<M> = {}) {\n  const cx = (...classes: ClsxClassValue[]) => transformClass(clsx(...classes));\n\n  const cv = <\n    V extends Variants = {},\n    CV extends ComputedVariants = {},\n    const E extends AnyComponent[] = [],\n  >(\n    config: CVConfig<V, CV, E> = {},\n  ): Component<V, CV, E, StyleProps[M]> => {\n    type MergedVariants = MergeVariants<V, CV, E>;\n\n    const variantKeys = collectVariantKeys(\n      config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n    );\n\n    const getClassPropertyName = (mode: Mode) =>\n      mode === \"jsx\" ? \"className\" : \"class\";\n\n    const getPropsKeys = (mode: Mode) => [\n      getClassPropertyName(mode),\n      \"style\",\n      ...variantKeys,\n    ];\n\n    const computeResult = (\n      props: ComponentProps<MergedVariants> = {},\n    ): { className: string; style: StyleValue } => {\n      const allClasses: ClassValue[] = [];\n      let allStyle: StyleValue = {};\n\n      // Extract variant props from input\n      const variantProps: Record<string, unknown> = {};\n      for (const key of variantKeys) {\n        if (key in props) {\n          variantProps[key] = (props as Record<string, unknown>)[key];\n        }\n      }\n\n      // Resolve variants with defaults\n      let resolvedVariants = resolveVariants(\n        config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n        variantProps,\n      );\n\n      // Process computed first to potentially update variants\n      const computedResult = processComputed(\n        config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n        resolvedVariants,\n        variantProps,\n      );\n      resolvedVariants = computedResult.updatedVariants;\n\n      // Collect computedVariants keys that will override extended variants\n      const computedVariantKeys = new Set<string>(\n        config.computedVariants ? Object.keys(config.computedVariants) : [],\n      );\n\n      // Process extended components (separates base and variant classes)\n      const extendedResult = processExtended(\n        config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n        resolvedVariants,\n        computedVariantKeys,\n      );\n\n      // 1. Extended base classes first\n      allClasses.push(...extendedResult.baseClasses);\n      allStyle = { ...allStyle, ...extendedResult.style };\n\n      // 2. Current component's base class\n      allClasses.push(config.class);\n\n      // 3. Add base style\n      if (config.style) {\n        allStyle = { ...allStyle, ...config.style };\n      }\n\n      // 4. Extended variant classes\n      allClasses.push(...extendedResult.variantClasses);\n\n      // 5. Current component's variants\n      const variantsResult = processVariants(\n        config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n        resolvedVariants,\n      );\n      allClasses.push(...variantsResult.classes);\n      allStyle = { ...allStyle, ...variantsResult.style };\n\n      // Add computed results\n      allClasses.push(...computedResult.classes);\n      allStyle = { ...allStyle, ...computedResult.style };\n\n      // Merge class from props\n      if (\"class\" in props) {\n        allClasses.push(props.class);\n      }\n      if (\"className\" in props) {\n        allClasses.push(props.className);\n      }\n\n      // Merge style from props\n      if (props.style != null) {\n        allStyle = { ...allStyle, ...normalizeStyle(props.style) };\n      }\n\n      return {\n        className: cx(...(allClasses as ClsxClassValue[])),\n        style: allStyle,\n      };\n    };\n\n    const createModalComponent = <R extends ComponentResult>(\n      mode: Mode,\n    ): ModalComponent<MergedVariants, R> => {\n      const propsKeys = getPropsKeys(mode);\n\n      const component = ((props: ComponentProps<MergedVariants> = {}) => {\n        const { className, style } = computeResult(props);\n\n        if (mode === \"jsx\") {\n          return { className, style: styleValueToJSXStyle(style) } as R;\n        }\n        if (mode === \"html\") {\n          return {\n            class: className,\n            style: styleValueToHTMLStyle(style),\n          } as R;\n        }\n        // htmlObj\n        return {\n          class: className,\n          style: styleValueToHTMLObjStyle(style),\n        } as R;\n      }) as ModalComponent<MergedVariants, R>;\n\n      component.class = (props: ComponentProps<MergedVariants> = {}) => {\n        return computeResult(props).className;\n      };\n\n      component.style = ((props: ComponentProps<MergedVariants> = {}) => {\n        const { style } = computeResult(props);\n        if (mode === \"jsx\") return styleValueToJSXStyle(style);\n        if (mode === \"html\") return styleValueToHTMLStyle(style);\n        return styleValueToHTMLObjStyle(style);\n      }) as ModalComponent<MergedVariants, R>[\"style\"];\n\n      component.getVariants = (\n        variants?: VariantValues<MergedVariants>,\n      ): VariantValues<MergedVariants> => {\n        return resolveVariants(\n          config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n          variants as VariantValues<Record<string, unknown>>,\n        ) as VariantValues<MergedVariants>;\n      };\n\n      component.keys = propsKeys as (keyof MergedVariants | keyof R)[];\n\n      component.onlyVariants = {\n        getVariants: (\n          variants?: VariantValues<MergedVariants>,\n        ): VariantValues<MergedVariants> => {\n          return resolveVariants(\n            config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,\n            variants as VariantValues<Record<string, unknown>>,\n          ) as VariantValues<MergedVariants>;\n        },\n        keys: variantKeys as (keyof MergedVariants)[],\n      } as OnlyVariantsComponent<MergedVariants>;\n\n      // Compute base class (without variants) - includes extended base classes\n      const extendedBaseClasses: ClassValue[] = [];\n      if (config.extend) {\n        for (const ext of config.extend) {\n          extendedBaseClasses.push(ext._baseClass);\n        }\n      }\n      component._baseClass = cx(\n        ...(extendedBaseClasses as ClsxClassValue[]),\n        config.class as ClsxClassValue,\n      );\n\n      return component;\n    };\n\n    // Create the default modal component\n    const defaultComponent = createModalComponent<StyleProps[M]>(defaultMode);\n\n    // Create all modal variants\n    const jsxComponent = createModalComponent<JSXProps>(\"jsx\");\n    const htmlComponent = createModalComponent<HTMLProps>(\"html\");\n    const htmlObjComponent = createModalComponent<HTMLObjProps>(\"htmlObj\");\n\n    // Build the final component\n    const component = defaultComponent as Component<V, CV, E, StyleProps[M]>;\n    component.jsx = jsxComponent;\n    component.html = htmlComponent;\n    component.htmlObj = htmlObjComponent;\n\n    return component;\n  };\n\n  return { cv, cx };\n}\n\nexport const { cv, cx } = create();\n"],"x_google_ignoreList":[0],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clava",
-  "version": "0.0.2",
+  "version": "0.1.1",
   "description": "Clava library",
   "keywords": [
     "class variance",

package/src/index.ts

@@ -1,5 +1,4 @@
 import clsx, { type ClassValue as ClsxClassValue } from "clsx";
-
 import type {
   Variants,
   ComputedVariants,
@@ -20,10 +19,8 @@ import type {
   HTMLObjProps,
   OnlyVariantsComponent,
   ComponentProps,
-  SplitProps,
-  OnlyVariantsSplitProps,
+  SplitPropsFunction,
 } from "./types.ts";
-
 import {
   htmlObjStyleToStyleValue,
   htmlStyleToStyleValue,
@@ -330,6 +327,7 @@ function processVariants(
 function processComputed(
   config: CVConfig<Variants, ComputedVariants, AnyComponent[]>,
   resolvedVariants: Record<string, unknown>,
+  propsVariants: Record<string, unknown>,
 ): {
   classes: ClassValue[];
   style: StyleValue;
@@ -348,9 +346,9 @@ function processComputed(
       setDefaultVariants: (
         newDefaults: VariantValues<Record<string, unknown>>,
       ) => {
-        // Only apply defaults for variants not already set
+        // Only apply defaults for variants not explicitly set in props
         for (const [key, value] of Object.entries(newDefaults)) {
-          if (resolvedVariants[key] === undefined) {
+          if (propsVariants[key] === undefined) {
             updatedVariants[key] = value;
           }
         }
@@ -455,7 +453,36 @@ function splitPropsImpl(
   return results;
 }
 
-export function create<M extends Mode>({
+/**
+ * Splits props into multiple groups based on key sources.
+ * Each source gets its own result object containing all its matching keys.
+ * The last element is always the "rest" containing keys not claimed by any source.
+ *
+ * @example
+ * ```ts
+ * const [buttonProps, inputProps, rest] = splitProps(
+ *   props,
+ *   buttonComponent,
+ *   inputComponent.onlyVariants,
+ * );
+ * ```
+ */
+export const splitProps: SplitPropsFunction = ((
+  props: Record<string, unknown>,
+  source1: unknown,
+  ...sources: unknown[]
+) => {
+  const normalizedSource1 = normalizeKeySource(source1);
+  const normalizedSources = sources.map(normalizeKeySource);
+  return splitPropsImpl(
+    normalizedSource1.keys,
+    normalizedSource1.defaults,
+    props,
+    normalizedSources,
+  );
+}) as SplitPropsFunction;
+
+export function create<M extends Mode = "jsx">({
   defaultMode = "jsx" as M,
   transformClass = (className) => className,
 }: CreateParams<M> = {}) {
@@ -507,6 +534,7 @@ export function create<M extends Mode>({
       const computedResult = processComputed(
         config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,
         resolvedVariants,
+        variantProps,
       );
       resolvedVariants = computedResult.updatedVariants;
 
@@ -568,11 +596,9 @@ export function create<M extends Mode>({
       };
     };
 
-    type Defaults = VariantValues<MergedVariants>;
-
     const createModalComponent = <R extends ComponentResult>(
       mode: Mode,
-    ): ModalComponent<MergedVariants, Defaults, R> => {
+    ): ModalComponent<MergedVariants, R> => {
       const propsKeys = getPropsKeys(mode);
 
       const component = ((props: ComponentProps<MergedVariants> = {}) => {
@@ -592,7 +618,7 @@ export function create<M extends Mode>({
           class: className,
           style: styleValueToHTMLObjStyle(style),
         } as R;
-      }) as ModalComponent<MergedVariants, Defaults, R>;
+      }) as ModalComponent<MergedVariants, R>;
 
       component.class = (props: ComponentProps<MergedVariants> = {}) => {
         return computeResult(props).className;
@@ -603,7 +629,7 @@ export function create<M extends Mode>({
         if (mode === "jsx") return styleValueToJSXStyle(style);
         if (mode === "html") return styleValueToHTMLStyle(style);
         return styleValueToHTMLObjStyle(style);
-      }) as ModalComponent<MergedVariants, Defaults, R>["style"];
+      }) as ModalComponent<MergedVariants, R>["style"];
 
       component.getVariants = (
         variants?: VariantValues<MergedVariants>,
@@ -616,23 +642,6 @@ export function create<M extends Mode>({
 
       component.keys = propsKeys as (keyof MergedVariants | keyof R)[];
 
-      const selfDefaults = collectDefaultVariants(
-        config as CVConfig<Variants, ComputedVariants, AnyComponent[]>,
-      );
-
-      component.splitProps = ((
-        props: Record<string, unknown>,
-        ...sources: unknown[]
-      ) => {
-        const normalizedSources = sources.map(normalizeKeySource);
-        return splitPropsImpl(
-          propsKeys,
-          selfDefaults,
-          props,
-          normalizedSources,
-        );
-      }) as SplitProps<MergedVariants, VariantValues<MergedVariants>, R>;
-
       component.onlyVariants = {
         getVariants: (
           variants?: VariantValues<MergedVariants>,
@@ -643,22 +652,7 @@ export function create<M extends Mode>({
           ) as VariantValues<MergedVariants>;
         },
         keys: variantKeys as (keyof MergedVariants)[],
-        splitProps: ((
-          props: Record<string, unknown>,
-          ...sources: unknown[]
-        ) => {
-          const normalizedSources = sources.map(normalizeKeySource);
-          return splitPropsImpl(
-            variantKeys,
-            selfDefaults,
-            props,
-            normalizedSources,
-          );
-        }) as OnlyVariantsSplitProps<
-          MergedVariants,
-          VariantValues<MergedVariants>
-        >,
-      } as OnlyVariantsComponent<MergedVariants, VariantValues<MergedVariants>>;
+      } as OnlyVariantsComponent<MergedVariants>;
 
       // Compute base class (without variants) - includes extended base classes
       const extendedBaseClasses: ClassValue[] = [];

package/src/test-react.ts

@@ -0,0 +1,40 @@
+import type { ComponentProps, CSSProperties } from "react";
+import { expect, expectTypeOf, test } from "vitest";
+import { cv, splitProps, type VariantProps } from "./index.ts";
+import { JSXProps } from "./types.ts";
+
+test("splitProps", () => {
+  const component = cv({ variants: { size: { sm: "sm", md: "md" } } });
+
+  interface Props
+    extends ComponentProps<"div">, VariantProps<typeof component> {}
+  const props: Props = { className: "custom", size: "md", id: "my-div" };
+
+  const [variantProps, rest] = splitProps(props, component);
+  expectTypeOf(variantProps.style).toEqualTypeOf<CSSProperties | undefined>();
+  expectTypeOf(variantProps.className).toEqualTypeOf<string | undefined>();
+  expect(variantProps.className).toBe("custom");
+  expect(variantProps).toEqual({ size: "md", className: "custom" });
+  expect(
+    // @ts-expect-error rest props should not have className
+    rest.className,
+  ).toBeUndefined();
+  expect(
+    // @ts-expect-error rest props should not have style
+    rest.style,
+  ).toBeUndefined();
+  expect(rest).toEqual({ id: "my-div" });
+});
+
+test("component props", () => {
+  const component = cv({
+    style: { fontSize: "16px" },
+    variants: { size: { sm: "sm", md: "md" } },
+  });
+  const props = component({ size: "sm", className: "custom" });
+  expectTypeOf(props).toEqualTypeOf<JSXProps>();
+  expect(props).toEqual({
+    className: "sm custom",
+    style: { fontSize: "16px" },
+  });
+});

package/src/test-solid.ts

@@ -0,0 +1,36 @@
+import type { ComponentProps, JSX } from "solid-js";
+import { expect, expectTypeOf, test } from "vitest";
+import { create, splitProps, type VariantProps } from "./index.ts";
+import { type HTMLObjProps } from "./types.ts";
+
+const { cv } = create({ defaultMode: "htmlObj" });
+
+test("splitProps", () => {
+  const component = cv({ variants: { size: { sm: "sm", md: "md" } } });
+
+  interface Props
+    extends ComponentProps<"div">, VariantProps<typeof component> {}
+  const props: Props = { class: "custom", size: "md", id: "my-div" };
+
+  const [variantProps, rest] = splitProps(props, component);
+  expectTypeOf(variantProps.style).toEqualTypeOf<
+    string | JSX.CSSProperties | undefined
+  >();
+  expectTypeOf(variantProps.class).toEqualTypeOf<string | undefined>();
+  expect(variantProps.class).toBe("custom");
+  expect(variantProps).toEqual({ size: "md", class: "custom" });
+  expect(rest).toEqual({ id: "my-div" });
+});
+
+test("component props", () => {
+  const component = cv({
+    style: { fontSize: "16px" },
+    variants: { size: { sm: "sm", md: "md" } },
+  });
+  const props = component({ size: "sm", className: "custom" });
+  expectTypeOf(props).toEqualTypeOf<HTMLObjProps>();
+  expect(props).toEqual({
+    class: "sm custom",
+    style: { "font-size": "16px" },
+  });
+});