diff --git a/ivette/src/dome/src/misc/utils.ts b/ivette/src/dome/src/misc/utils.ts index b39a84b6d38a5f07d9015126c9f09b2dd759d29f..9dbd931ae2cc4673f797078f4654ca50d9ad2201 100644 --- a/ivette/src/dome/src/misc/utils.ts +++ b/ivette/src/dome/src/misc/utils.ts @@ -2,12 +2,41 @@ // --- Utilities // -------------------------------------------------------------------------- +/** + @packageDocumentation + @module dome/misc/utils + */ + import type { CSSProperties } from 'react'; -export type ClassSpec = - undefined | boolean | null | string | - { [cname: string]: boolean | null | undefined }; +type falsy = undefined | boolean | null | ''; + +export type ClassSpec = string | falsy | { [cname: string]: true | falsy }; + +/** + Utility function to merge various HTML class properties + into a `className` property. + Class specifications can be made of: + - a string, interpreted as a CSS class specification + - an object, with keys corresponding to CSS class associated + to true of falsy value. + - any falsy value, which is discarded + + Example of usage: + + * ```ts + * const className = classes( + * 'my-base-class', + * condition && 'my-class-when-condition', + * { + * 'my-class-1': cond-1, + * 'my-class-2': cond-2, + * 'my-class-3': cond-3, + * } + * ); + * ``` + */ export function classes( ...args: ClassSpec[] ): string { @@ -24,8 +53,25 @@ export function classes( return buffer.join(' '); } -export type StyleSpec = - undefined | boolean | null | CSSProperties; +export type StyleSpec = falsy | CSSProperties; + +/** + Utility function to merge various CSS style properties + into a single CSS style object. + + Each style specification can be made of a CSS object or (discarded) + falsy values. + Example of usage: + + * ```ts + * const sty = styles( + * { ... }, + * cond-1 && { ... }, + * cond-2 && { ... }, + * ); + * ``` + +*/ export function styles( ...args: StyleSpec[] diff --git a/ivette/tsconfig.json b/ivette/tsconfig.json index 662e4cd16a733b51a4544a219c7f8dd005d7b761..162769842922052a4f7c1483912ce02dd0afe03a 100644 --- a/ivette/tsconfig.json +++ b/ivette/tsconfig.json @@ -100,6 +100,7 @@ "doc/pages", "src/frama-c", "api", "src/dome/src/renderer", + "src/dome/src/misc", ] } }