@ntix/components-scorad 1.0.5 → 2.0.1

package/dist/index.d.ts

@@ -1,20 +1,517 @@
-export * from './component';
-export * from './componentsScoradLogger';
-export * from './constants';
-export * from './extent';
-export * from './getScoradScore';
-export * from './HTMLScoradValueElement';
-export * from './intensity';
-export * from './label';
-export * from './options';
-export * from './ScoradData';
-export * from './ScoradExtentData';
-export * from './ScoradExtentWeights';
-export * from './ScoradIntensityData';
-export * from './ScoradResources';
-export * from './ScoradScore';
-export * from './ScoradSubjectiveData';
-export * from './selectScoradWeights';
-export * from './subjective';
-export * from './validateScoradData';
-export * from './weightings';
+import { EventEmitter } from '@ntix/components-core';
+import { Failure } from '@ntix/components-core';
+import { HTMLComponentElement } from '@ntix/components-core';
+import { HTMLLiteralResult } from '@ntix/components-renderer';
+import { ILogger } from '@ntix/components-core';
+import { LogLevel } from '@ntix/components-core';
+import { Result } from '@ntix/components-core';
+import { Success } from '@ntix/components-core';
+
+/**
+ Internal logger instance for @ntix/components-scorad.
+ */
+export declare const componentsScoradLogger: ILogger;
+
+export { Failure }
+
+/**
+ * Calculates the final composite SCORAD score (A/5 + 7B/2 + C) from the raw data.
+ * @param data - The complete ScoradData input object.
+ * @returns The final SCORAD score, rounded to two decimal places.
+ */
+export declare const getScoradScore: (data: ScoradData | null | undefined) => Result<ScoradScore>;
+
+/**
+ * Root component for calculating and displaying the total SCORAD (SCORing Atopic Dermatitis).
+ *
+ * This component aggregates data from Extent, Intensity, and Subjective sub-components
+ * to calculate the final clinical score.
+ */
+export declare class HTMLScoradElement extends HTMLComponentElement<HTMLScoradValueElement<ScoradData>> {
+    connectedCallback(): void;
+    /**
+     * Value is readonly
+     * @group Properties
+     */
+    readonly: boolean;
+    /**
+     * The current value of the component.
+     * @group Properties
+     */
+    value: ScoradData;
+    /**
+     * Show the errors from validation on the components
+     * @group Properties
+     * */
+    showErrors: boolean;
+    afterRender(): void;
+    render(): HTMLLiteralResult;
+    /**
+     * Fired immediately as the user interacts with the input (high frequency).
+     *
+     * @param detail - The current value during input.
+     * @group Events
+     */
+    readonly valueInput: EventEmitter<ScoradData>;
+    /**
+     * Fired when the value is finalized or "committed" by the user.
+     *
+     * @param detail - The final updated value.
+     * @group Events
+     */
+    readonly valueChange: EventEmitter<ScoradData>;
+}
+
+/**
+ * Interactive SVG component for calculating the 'Extent' (A) section of the SCORAD score.
+ *
+ * Users can interact with different body regions (head, trunk, limbs) via pointer gestures
+ * or keyboard input to define the percentage of affected surface area. The component
+ * supports different surface area weightings based on the `child` attribute.
+ */
+export declare class HTMLScoradExtentElement extends HTMLComponentElement<HTMLScoradValueElement<ScoradExtentData>> {
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private handleFocusIn;
+    private handleFocusOut;
+    /**
+     * Extent score is to be weighted as a child or adult
+     * @group Properties
+     */
+    child: boolean;
+    /**
+     * Value is readonly
+     * @group Properties
+     */
+    readonly: boolean;
+    private committedValue;
+    /**
+     * The current value of the component.
+     * @group Properties
+     */
+    value: ScoradExtentData;
+    /**
+     * Subjective SCORAD score (A)
+     * @group Properties
+     */
+    score?: number;
+    setValue: (value: ScoradExtentData) => void;
+    /**
+     * validation errors
+     * shows as has-errors attribute
+     * @group Properties
+     */
+    errors?: Record<string, string>;
+    afterRender(): void;
+    resizeCallback(): void;
+    render(): HTMLLiteralResult;
+    /**
+     * Fired immediately as the user interacts with the input (high frequency).
+     *
+     * @param detail - The current value during input.
+     * @group Events
+     */
+    readonly valueInput: EventEmitter<ScoradExtentData>;
+    /**
+     * Fired when the value is finalized or "committed" by the user.
+     *
+     * @param detail - The final updated value.
+     * @group Events
+     */
+    readonly valueChange: EventEmitter<ScoradExtentData>;
+}
+
+/**
+ * Component for assessing the 'Intensity' (B) criteria of the SCORAD score.
+ *
+ * It renders a list of clinical signs (e.g., Erythema, Edema, Oozing) and allows
+ * the user to grade each on a scale of 0 to 3 using integrated option pickers.
+ */
+export declare class HTMLScoradIntensityElement extends HTMLComponentElement<HTMLScoradValueElement<ScoradIntensityData>> {
+    connectedCallback(): void;
+    /**
+     * Value is readonly
+     * @group Properties
+     */
+    readonly: boolean;
+    /**
+     * The current value of the component.
+     * @group Properties
+     */
+    value: ScoradIntensityData;
+    /**
+     * Subjective SCORAD score (B)
+     * @group Properties
+     */
+    score?: number;
+    /**
+     * validation errors
+     * shows as has-errors attribute
+     * @group Properties
+     */
+    errors?: Record<string, string>;
+    afterRender(): void;
+    render(): HTMLLiteralResult;
+    renderLevel(name: keyof ScoradIntensityData): HTMLLiteralResult;
+    /**
+     * Fired immediately as the user interacts with the input (high frequency).
+     *
+     * @param detail - The current value during input.
+     * @group Events
+     */
+    readonly valueInput: EventEmitter<ScoradIntensityData>;
+    /**
+     * Fired when the value is finalized or "committed" by the user.
+     *
+     * @param detail - The final updated value.
+     * @group Events
+     */
+    readonly valueChange: EventEmitter<ScoradIntensityData>;
+}
+
+export declare class HTMLScoradLabelElement extends HTMLComponentElement<HTMLScoradLabelElementEventMap> {
+    connectedCallback(): void;
+    diconnectedCallback(): void;
+    private handleClick;
+    text: string;
+    description?: string;
+    render(): HTMLLiteralResult;
+}
+
+export declare interface HTMLScoradLabelElementEventMap extends HTMLElementEventMap {
+}
+
+export declare class HTMLScoradOptionsElement extends HTMLComponentElement<HTMLScoradValueElement<number>> {
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private handleFocusIn;
+    private handleFocusOut;
+    private handleClick;
+    private handleKeydown;
+    min: number;
+    max: number;
+    hideText: boolean;
+    showHue: boolean;
+    committedValue: number;
+    value: number;
+    setValue: (value: number) => void;
+    readonly: boolean;
+    text: readonly string[];
+    render(): HTMLLiteralResult;
+    afterRender(): void;
+    readonly valueInput: EventEmitter<number>;
+    readonly valueChange: EventEmitter<number>;
+}
+
+/**
+ * Component for assessing the 'Subjective' (C) criteria of the SCORAD score.
+ *
+ * It provides visual analog scales (VAS) for patients to self-report symptoms
+ * such as pruritus (itching) and insomnia (sleep loss) over the last 3 days.
+ */
+export declare class HTMLScoradSubjectiveElement extends HTMLComponentElement<HTMLScoradValueElement<ScoradSubjectiveData>> {
+    connectedCallback(): void;
+    /**
+     * Value is readonly
+     * @group Properties
+     */
+    readonly: boolean;
+    /**
+     * The current value of the component.
+     * @group Properties
+     */
+    value: ScoradSubjectiveData;
+    /**
+     * Subjective SCORAD score (C)
+     * @group Properties
+     */
+    score?: number;
+    /**
+     * validation errors
+     * shows as has-errors attribute
+     * @group Properties
+     */
+    errors?: Record<string, string>;
+    afterRender(): void;
+    render(): HTMLLiteralResult;
+    renderLevel(name: keyof ScoradSubjectiveData): HTMLLiteralResult;
+    /**
+     * Fired immediately as the user interacts with the input (high frequency).
+     *
+     * @param detail - The current value during input.
+     * @group Events
+     */
+    readonly valueInput: EventEmitter<ScoradSubjectiveData>;
+    /**
+     * Fired when the value is finalized or "committed" by the user.
+     *
+     * @param detail - The final updated value.
+     * @group Events
+     */
+    readonly valueChange: EventEmitter<ScoradSubjectiveData>;
+}
+
+/**
+ * @module
+ * @group Components
+ */
+/**
+ * Common interface for SCORAD input elements.
+ *
+ * This interface defines the standard reactive contract for components that manage a generic score value.
+ *
+ * @template T - The data type of the SCORAD value
+ */
+export declare interface HTMLScoradValueElement<T> extends HTMLElementEventMap {
+    /**
+     * Value is readonly
+     */
+    readonly: boolean;
+    /**
+     * The current value of the component.
+     *
+     * @group Properties
+     */
+    readonly value: T;
+    /**
+     * Fired immediately as the user interacts with the input (high frequency).
+     *
+     * @param detail - The current value of type {@link T} during input.
+     * @group Events
+     */
+    readonly 'value-input': CustomEvent<T>;
+    /**
+     * Fired when the value is finalized or "committed" by the user.
+     *
+     * @param detail - The final updated value of type {@link T}.
+     * @group Events
+     */
+    readonly 'value-change': CustomEvent<T>;
+}
+
+/**
+ * A toggle component to switch between 'Adult' and 'Child' SCORAD calculation weightings.
+ * This component maps a boolean state to specific clinical weighting logic,
+ * primarily influencing the surface area calculation in the Extent (Section A) component.
+ */
+export declare class HTMLScoradWeightingsElement extends HTMLComponentElement<HTMLScoradValueElement<boolean>> {
+    connectedCallback(): void;
+    /**
+     * Value is readonly
+     * @group Properties
+     */
+    readonly: boolean;
+    /**
+     * The current value of the component.
+     * @group Properties
+     */
+    value: boolean;
+    afterRender(): void;
+    render(): HTMLLiteralResult;
+    /**
+     * Fired immediately as the user interacts with the input (high frequency).
+     *
+     * @param detail - The current value during input.
+     * @group Events
+     */
+    readonly valueInput: EventEmitter<boolean>;
+    /**
+     * Fired when the value is finalized or "committed" by the user.
+     *
+     * @param detail - The final updated value.
+     * @group Events
+     */
+    readonly valueChange: EventEmitter<boolean>;
+}
+
+export { LogLevel }
+
+export { Result }
+
+/**
+ Configuration map for the Body Surface Area (BSA) weights for adult SCORAD Extent (A) calculation.
+ The values are decimals representing the percentage of total BSA.
+ */
+export declare const SCORAD_ADULT_WEIGHTS: ScoradExtentWeights;
+
+/**
+ Configuration map for the Body Surface Area (BSA) weights for child SCORAD Extent (A) calculation.
+ The head and neck area is proportionally larger than in adults.
+ */
+export declare const SCORAD_CHILD_WEIGHTS: ScoradExtentWeights;
+
+/** Global default state for a complete SCORAD assessment.
+ Uses adult weighting by default.
+ */
+export declare const SCORAD_DEFAULT: ScoradData;
+
+/** Initial state for SCORAD Extent data.
+ All regions are initialized as non-null to satisfy record constraints.
+ */
+export declare const SCORAD_EXTENT_DEFAULT: ScoradExtentData;
+
+/** Maximum percentage value allowed for any body region in the Extent (A) calculation. */
+export declare const SCORAD_EXTENT_MAX_VALUE: number;
+
+/** Initial state for SCORAD Intensity data.
+ Represents a baseline where no clinical signs have been graded.
+ */
+export declare const SCORAD_INTENSITY_DEFAULT: ScoradIntensityData;
+
+/** Maximum grade (0-3) allowed for clinical signs in the Intensity (B) calculation. */
+export declare const SCORAD_INTENSITY_MAX_VALUE: number;
+
+/** Initial state for SCORAD Subjective data.
+ Represents a baseline for pruritus and sleeplessness.
+ */
+export declare const SCORAD_SUBJECTIVE_DEFAULT: ScoradSubjectiveData;
+
+/** Maximum value (0-10) allowed for patient-reported symptoms in the Subjective (C) calculation. */
+export declare const SCORAD_SUBJECTIVE_MAX_VALUE: number;
+
+/**
+ * The complete data model for the SCORAD index, containing all three components (A, B, C).
+ */
+export declare type ScoradData = {
+    child: boolean;
+    extent: ScoradExtentData;
+    intensity: ScoradIntensityData;
+    subjective: ScoradSubjectiveData;
+};
+
+/**
+ * @module
+ * @group Data
+ */
+/**
+ * Represents the raw percentage affected (0-100) for each of the six SCORAD regions.
+ */
+export declare type ScoradExtentData = {
+    /** Percentage (0-100) of the Head and Neck region affected. */
+    headNeck: number;
+    /** Percentage (0-100) of the Anterior Trunk region affected. */
+    anteriorTrunk: number;
+    /** Percentage (0-100) of the Posterior Trunk region affected. */
+    posteriorTrunk: number;
+    /** Percentage (0-100) of the Genital region affected. */
+    genitals: number;
+    /** Percentage (0-100) of the Upper Limbs region affected. */
+    upperLimbs: number;
+    /** Percentage (0-100) of the Lower Limbs region affected. */
+    lowerLimbs: number;
+};
+
+/**
+ * Defines the type for the fixed BSA weights.
+ */
+export declare type ScoradExtentWeights = Readonly<ScoradExtentData>;
+
+/**
+ * @module
+ * @group Data
+ */
+/**
+ * Represents the single assessment of the six clinical signs from a representative lesion area.
+ * Used for calculating the Intensity Score (B).
+ */
+export declare type ScoradIntensityData = {
+    /** Erythema (Redness). */
+    erythema: number;
+    /** Oedema and Papulation (Swelling/Bumps). */
+    oedemaPapulation: number;
+    /** Oozing and Crusting. */
+    oozingCrusting: number;
+    /** Excoriations (Scratch marks). */
+    excoriations: number;
+    /** Lichenification (Skin thickening). */
+    lichenification: number;
+    /** Xerosis (Dryness). */
+    xerosis: number;
+};
+
+/**
+ A single resource item containing UI text strings.
+ */
+export declare type ScoradResource = {
+    text: string;
+    description: string;
+};
+
+/**
+ A recursive type that mirrors the structure of a SCORAD data record,
+ replacing leaf values with ScoradResource objects.
+ */
+export declare type ScoradResourceMap<T> = {
+    readonly [P in keyof T]: T[P] extends object ? (P extends "intensity" | "subjective" ? ScoradResourceMap<T[P]> & {
+        levels: readonly string[];
+    } : ScoradResourceMap<T[P]>) & {
+        text: string;
+    } : ScoradResource;
+};
+
+/**
+ Localization and UI resources for the SCORAD component.
+ Maps data keys to human-readable labels and descriptions for display in the UI.
+ */
+export declare const ScoradResources: ScoradResourceMap<ScoradData>;
+
+/**
+ * @module
+ * @group Data
+ */
+/** Computed SCORAD values representing the three clinical sections and the final sum.
+ */
+export declare type ScoradScore = {
+    /** Extent (Surface Area): The percentage of body surface area affected, weighted by age.
+     */
+    A: number;
+    /** Intensity: The sum of the six clinical sign grades (Erythema, Oedema, etc.).
+     */
+    B: number;
+    /** Subjective Symptoms: The sum of patient-reported pruritus and sleeplessness scores.
+     */
+    C: number;
+    /** The final calculated score using the standard formula: A/5 + 7B/2 + C.
+     */
+    total: number;
+};
+
+/**
+ * @module
+ * @group Data
+ */
+/**
+ * Represents the patient-reported scores for subjective symptoms (Itch/Sleeplessness).
+ * Used for calculating the Subjective Score (C).
+ */
+export declare type ScoradSubjectiveData = {
+    /** Visual Analog Scale (VAS) score (0-10) for Pruritus (Itch) over the last 3 days/nights. */
+    pruritus: number;
+    /** Visual Analog Scale (VAS) score (0-10) for Sleeplessness over the last 3 days/nights. */
+    sleeplessness: number;
+};
+
+/**
+ * Select the weights by the data passed
+ *
+ * @param data scorad data
+ * @returns weights to use
+ */
+export declare const selectScoradWeights: (data: ScoradData | null | undefined) => ScoradExtentWeights;
+
+export { Success }
+
+/**
+ * Validates all fields within the ScoradData object against their allowed clinical bounds.
+ * Returns an array of error messages.
+ *
+ * @param data - The complete ScoradData input object.
+ * @returns Result.
+ */
+export declare const validateScoradData: {
+    (data: ScoradData | null | undefined): Result<ScoradData>;
+    formatError(name: string, key: string, max: number, value: number): string;
+    isValid(n: number, max: number): boolean;
+};
+
+export { }

package/docs/HTMLScoradValueElement.md

@@ -24,12 +24,12 @@ This interface defines the standard reactive contract for components that manage
 
 | Event | Modifier | Type | Description |
 | ------ | ------ | ------ | ------ |
-| <a id="value-change"></a> `value-change` | `readonly` | `CustomEvent`\<`T`\> | Fired when the value is finalized or "committed" by the user. **Param** The final updated value of type [T](#t). |
-| <a id="value-input"></a> `value-input` | `readonly` | `CustomEvent`\<`T`\> | Fired immediately as the user interacts with the input (high frequency). **Param** The current value of type [T](#t) during input. |
+| <a id="property-value-change"></a> `value-change` | `readonly` | `CustomEvent`\<`T`\> | Fired when the value is finalized or "committed" by the user. **Param** The final updated value of type [T](#t). |
+| <a id="property-value-input"></a> `value-input` | `readonly` | `CustomEvent`\<`T`\> | Fired immediately as the user interacts with the input (high frequency). **Param** The current value of type [T](#t) during input. |
 
 #### Properties
 
 | Property | Modifier | Type | Description |
 | ------ | ------ | ------ | ------ |
-| <a id="readonly"></a> `readonly` | `public` | `boolean` | Value is readonly |
-| <a id="value"></a> `value` | `readonly` | `T` | The current value of the component. |
+| <a id="property-readonly"></a> `readonly` | `public` | `boolean` | Value is readonly |
+| <a id="property-value"></a> `value` | `readonly` | `T` | The current value of the component. |

package/docs/ScoradResources.md

@@ -17,7 +17,7 @@ A single resource item containing UI text strings.
 ### ScoradResourceMap
 
 ```ts
-type ScoradResourceMap<T> = { [P in keyof T]: T[P] extends object ? ScoradResourceMap<T[P]> : ScoradResource };
+type ScoradResourceMap<T> = { readonly [P in keyof T]: T[P] extends object ? (P extends "intensity" | "subjective" ? ScoradResourceMap<T[P]> & { levels: readonly string[] } : ScoradResourceMap<T[P]>) & { text: string } : ScoradResource };
 ```
 
 A recursive type that mirrors the structure of a SCORAD data record,

package/docs/componentsScoradLogger.md

@@ -10,5 +10,4 @@
 const componentsScoradLogger: ILogger;
 ```
 
-Internal logger instance for @ntix/components-scorad.
-Configured with a dedicated namespace and the resolved logLevel.
+Internal logger instance for @ntix/components-scorad.