@lumx/core 3.21.2-alpha.3 → 4.0.0

package/js/types/index.d.ts

@@ -6,7 +6,6 @@ export type { HasCloseMode } from './HasCloseMode';
 export type { HasTheme } from './HasTheme';
 export type { GenericProps } from './GenericProps';
 export type { HeadingElement } from './HeadingElement';
-export type { KebabCase } from './KebabCase';
 export type { Point } from './Point';
 export type { Predicate } from './Predicate';
 export type { RectSize } from './RectSize';

package/js/utils/_internal/className/getBasicClass.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Get the basic CSS class for the given type.
+ *
+ * @param  prefix The class name prefix for the generated CSS class.
+ * @param  type   The type of CSS class we want to generate (e.g.: 'color', 'variant', ...).
+ * @param  value  The value of the type of the CSS class (e.g.: 'primary', 'button', ...).
+ * @return The basic CSS class.
+ */
+export declare function getBasicClass({ prefix, type, value, }: {
+    prefix: string;
+    type: string;
+    value: string | number | boolean | undefined;
+}): string;

package/js/utils/_internal/className/handleBasicClasses.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Return all basic LumX CSS classes which are available for every components.
+ *
+ * @see {@link /src/components/index.d.ts} for the possible values of each parameter.
+ *
+ * @param  prefix The class name prefix for the generated CSS class.
+ * @param  props  All the other props you want to generate a class.
+ *                The rule of thumb: the key is the name of the prop in the class, the value a string that will
+ *                be used in the classname to represent the value of the given prop.
+ * @return All LumX basic CSS classes.
+ */
+export declare function handleBasicClasses({ prefix, ...props }: {
+    prefix: string;
+    [prop: string]: any;
+}): string;

package/js/utils/_internal/className/index.d.ts

@@ -0,0 +1,2 @@
+export { handleBasicClasses } from './handleBasicClasses';
+export { getBasicClass } from './getBasicClass';

package/js/utils/classNames/index.d.ts

@@ -3,4 +3,3 @@ export * from './color';
 export * from './typography';
 export * from './spacing';
 export * from './visually-hidden';
-export * as bem from './bem';

package/js/utils/classNames/index.js

@@ -3,5 +3,3 @@ export { background, color, font } from './color/index.js';
 export { typography } from './typography/index.js';
 export { margin, margins, padding, paddings, spacing, spacings } from './spacing/index.js';
 export { visuallyHidden } from './visually-hidden/index.js';
-import * as index from './bem/index.js';
-export { index as bem };

package/package.json

@@ -35,7 +35,7 @@
         "update-version-changelog": "yarn version-changelog ../../CHANGELOG.md"
     },
     "sideEffects": false,
-    "version": "3.21.2-alpha.3",
+    "version": "4.0.0",
     "devDependencies": {
         "@rollup/plugin-typescript": "^12.3.0",
         "@types/react": "^17.0.2",

package/js/utils/classNames/bem/block.d.ts

@@ -1,18 +0,0 @@
-import type { ClassValue } from 'classnames/types';
-import { type Modifier } from './generateBEMClass';
-/**
- * Creates a BEM block class generator function for the given base class.
- * Returns a function that generates BEM class names with optional modifiers.
- *
- * @param baseClass - The base BEM block class name (e.g., 'button', 'card')
- * @returns A function that accepts:
- *   - modifier - Optional BEM modifier (string, object, or array)
- *   - additionalClasses - Optional additional classes to include
- *
- * @example
- * const button = block('my-button');
- * button(); // 'my-button'
- * button('primary'); // 'my-button my-button--primary'
- * button({ active: true }); // 'my-button my-button--active'
- */
-export declare const block: (baseClass: string) => (modifier?: Modifier, additionalClasses?: ClassValue | ClassValue[]) => string;

package/js/utils/classNames/bem/block.js

@@ -1,20 +0,0 @@
-import { generateBEMClass } from './generateBEMClass.js';
-
-/**
- * Creates a BEM block class generator function for the given base class.
- * Returns a function that generates BEM class names with optional modifiers.
- *
- * @param baseClass - The base BEM block class name (e.g., 'button', 'card')
- * @returns A function that accepts:
- *   - modifier - Optional BEM modifier (string, object, or array)
- *   - additionalClasses - Optional additional classes to include
- *
- * @example
- * const button = block('my-button');
- * button(); // 'my-button'
- * button('primary'); // 'my-button my-button--primary'
- * button({ active: true }); // 'my-button my-button--active'
- */
-const block = (baseClass) => (modifier, additionalClasses) => generateBEMClass(baseClass, modifier, additionalClasses);
-
-export { block };

package/js/utils/classNames/bem/element.d.ts

@@ -1,19 +0,0 @@
-import type { ClassValue } from 'classnames/types';
-import { type Modifier } from './generateBEMClass';
-/**
- * Creates a BEM element class generator function for the given base class.
- * Returns a function that generates BEM element class names with optional modifiers.
- *
- * @param baseClass - The base BEM block class name (e.g., 'button', 'card')
- * @returns A function that accepts:
- *   - elem - The BEM element name (e.g., 'icon', 'title')
- *   - modifier - Optional BEM modifier (string, object, or array)
- *   - additionalClasses - Optional additional classes to include
- *
- * @example
- * const button = element('my-button');
- * button('icon'); // 'my-button__icon'
- * button('icon', 'large'); // 'my-button__icon my-button__icon--large'
- * button('icon', { active: true }); // 'my-button__icon my-button__icon--active'
- */
-export declare const element: (baseClass: string) => (elem: string, modifier?: Modifier, additionalClasses?: ClassValue | ClassValue[]) => string;

package/js/utils/classNames/bem/element.js

@@ -1,21 +0,0 @@
-import { generateBEMClass } from './generateBEMClass.js';
-
-/**
- * Creates a BEM element class generator function for the given base class.
- * Returns a function that generates BEM element class names with optional modifiers.
- *
- * @param baseClass - The base BEM block class name (e.g., 'button', 'card')
- * @returns A function that accepts:
- *   - elem - The BEM element name (e.g., 'icon', 'title')
- *   - modifier - Optional BEM modifier (string, object, or array)
- *   - additionalClasses - Optional additional classes to include
- *
- * @example
- * const button = element('my-button');
- * button('icon'); // 'my-button__icon'
- * button('icon', 'large'); // 'my-button__icon my-button__icon--large'
- * button('icon', { active: true }); // 'my-button__icon my-button__icon--active'
- */
-const element = (baseClass) => (elem, modifier, additionalClasses) => generateBEMClass(`${baseClass}__${elem}`, modifier, additionalClasses);
-
-export { element };

package/js/utils/classNames/bem/generateBEMClass.d.ts

@@ -1,27 +0,0 @@
-import type { ClassValue } from 'classnames/types';
-/**
- * Modifier
- * @example 'is-disabled'
- * @example { 'is-disabled': true, 'is-selected': false }
- * @example ['another-class'] // => Added as-is, not as a BEM modifier suffix
- */
-export type Modifier = string | Record<string, boolean | undefined | null> | ClassValue[];
-/**
- * Generates a BEM (Block Element Modifier) class name string.
- * Combines a base class with optional modifiers and additional classes.
- *
- * @param baseClass - The base BEM class (block or element)
- * @param modifier - Optional modifier as:
- *   - string: creates `baseClass--modifier`
- *   - object: creates `baseClass--key` for each truthy value
- *   - array: passes through as additional classes
- * @param additionalClasses - Optional additional classes to include
- * @returns Combined class name string
- *
- * @example
- * generateBEMClass('button'); // 'button'
- * generateBEMClass('button', 'primary'); // 'button button--primary'
- * generateBEMClass('button', { active: true, disabled: false }); // 'button button--active'
- * generateBEMClass('button', 'primary', 'my-class'); // 'button button--primary my-class'
- */
-export declare function generateBEMClass(baseClass: string, modifier?: Modifier, additionalClasses?: ClassValue | ClassValue[]): string;

package/js/utils/classNames/bem/generateBEMClass.js

@@ -1,48 +0,0 @@
-import classnames from 'classnames';
-
-function generateModifierClasses(baseClass, modifier) {
-    if (!modifier) {
-        return undefined;
-    }
-    if (Array.isArray(modifier)) {
-        return modifier;
-    }
-    if (typeof modifier === 'string') {
-        return `${baseClass}--${modifier}`;
-    }
-    const classes = [];
-    for (const [key, value] of Object.entries(modifier)) {
-        if (value)
-            classes.push(`${baseClass}--${key}`);
-    }
-    return classes;
-}
-/**
- * Generates a BEM (Block Element Modifier) class name string.
- * Combines a base class with optional modifiers and additional classes.
- *
- * @param baseClass - The base BEM class (block or element)
- * @param modifier - Optional modifier as:
- *   - string: creates `baseClass--modifier`
- *   - object: creates `baseClass--key` for each truthy value
- *   - array: passes through as additional classes
- * @param additionalClasses - Optional additional classes to include
- * @returns Combined class name string
- *
- * @example
- * generateBEMClass('button'); // 'button'
- * generateBEMClass('button', 'primary'); // 'button button--primary'
- * generateBEMClass('button', { active: true, disabled: false }); // 'button button--active'
- * generateBEMClass('button', 'primary', 'my-class'); // 'button button--primary my-class'
- */
-function generateBEMClass(baseClass, modifier, additionalClasses) {
-    return classnames(
-    // Base class
-    baseClass, 
-    // Modifier(s)
-    generateModifierClasses(baseClass, modifier), 
-    // Additional classes
-    additionalClasses);
-}
-
-export { generateBEMClass };

package/js/utils/classNames/bem/index.d.ts

@@ -1,2 +0,0 @@
-export { block } from './block';
-export { element } from './element';

package/js/utils/classNames/bem/index.js

@@ -1,2 +0,0 @@
-export { block } from './block.js';
-export { element } from './element.js';