coles-solid-library 0.2.8 → 0.3.1

package/dist/components/Checkbox/checkbox.d.ts

@@ -0,0 +1,11 @@
+import { JSX } from "solid-js";
+interface CheckboxProps {
+    label?: string | JSX.Element;
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onChange?: (checked: boolean) => void;
+    disabled?: boolean;
+    ariaLabel?: string;
+}
+export declare function Checkbox(props: CheckboxProps): JSX.Element;
+export {};

package/dist/components/Form/formGroup.d.ts

@@ -1,4 +1,4 @@
-import { ErrorObject, FormGroupData } from "./formHelp/models";
+import { FormGroupData, ValidationDefault } from "./formHelp/models";
 export { FormArray } from "./formHelp/formArray";
 export { Validators } from "./formHelp/validators";
 /**
@@ -24,7 +24,15 @@ export declare class FormGroup<T extends object> {
      * @returns A cloned copy of the value for the specified control.
      */
     get(): T;
-    get(key: keyof T): T[keyof T];
+    get<K extends keyof T>(key: K): T[K];
+    /**
+     * Gets a specific item from a FormArray at the given index
+     *
+     * @param key - The key of the form control containing the FormArray
+     * @param index - The index to retrieve from the array
+     * @returns The item at the specified index, or undefined if not found
+     */
+    getArrayItem<K extends keyof T>(key: K, index: number): ElementType<T[K]> | undefined;
     /**
      * Checks whether a specific validator error exists for a given control.
      *
@@ -32,15 +40,28 @@ export declare class FormGroup<T extends object> {
      * @param errKey - The error key to check for.
      * @returns `true` if the error exists, otherwise `false`.
      */
-    hasValidator(key: keyof T, errKey: 'required' | 'minLength' | 'maxLength' | string): boolean;
-    getErrors(key: keyof T): ErrorObject<T>[keyof T];
+    hasValidator<K extends keyof T>(key: K, errKey: 'required' | 'minLength' | 'maxLength' | string): boolean;
+    /**
+     * Gets all errors for a specific control
+     *
+     * @param key - The key of the form control
+     * @returns An array of errors for the control
+     */
+    getErrors<K extends keyof T>(key: K): (typeof this.errors)[0] extends () => infer E ? (E extends Record<K, infer U> ? U : never) : never;
     /**
      * Determines if a specific control has any validation errors.
      *
      * @param key - The key of the form control.
      * @returns `true` if any error is present, otherwise `false`.
      */
-    hasError(key: keyof T): boolean;
+    hasError<K extends keyof T>(key: K): boolean;
+    /**
+     * Sets an error state for a validator on a specific control
+     *
+     * @param key - The key of the form control
+     * @param errKey - The error key to update
+     * @param hasError - Whether the error should be set or cleared
+     */
     setError(key: keyof T, errKey: string, hasError: boolean): void;
     /**
      * Sets a new value for a specified form control.
@@ -48,7 +69,22 @@ export declare class FormGroup<T extends object> {
      * @param key - The key of the form control to update.
      * @param value - The new value to assign to the control.
      */
-    set(key: keyof T, value: T[keyof T]): void;
+    set<K extends keyof T>(key: K, value: T[K]): void;
+    /**
+     * Adds an item to a FormArray control
+     *
+     * @param key - The key of the FormArray control
+     * @param controlValidation - The validation for the new item
+     * @param value - Optional initial value for the new item
+     */
+    addToArray<K extends keyof T>(key: K, controlValidation: ValidationDefault<ElementType<T[K]> & object, keyof ElementType<T[K]>>, value?: ElementType<T[K]> & object): void;
+    /**
+     * Removes an item from a FormArray control
+     *
+     * @param key - The key of the FormArray control
+     * @param index - The index of the item to remove
+     */
+    removeFromArray<K extends keyof T>(key: K, index: number): void;
     /**
      * Validates the form data.
      *
@@ -57,5 +93,9 @@ export declare class FormGroup<T extends object> {
      * @param key - (Optional) The key of the control to validate.
      * @returns `true` if the control(s) pass all validations; otherwise, `false`.
      */
-    validate(key?: keyof T): boolean;
+    validate<K extends keyof T>(key?: K): boolean;
 }
+/**
+ * Utility type to extract the element type from an array type
+ */
+type ElementType<T> = T extends (infer U)[] ? U : never;

package/dist/components/Form/formHelp/formArray.d.ts

@@ -1,4 +1,4 @@
-import { ValidationDefault, ArrayValidation } from "./models";
+import { ValidationDefault, ArrayValidation, Error } from "./models";
 /**
  * A class that encapsulates an array of form controls along with their validation logic.
  *
@@ -31,32 +31,89 @@ export declare class FormArray<T extends object> {
      * @private
      */
     private errors;
+    /**
+     * The current values of the form controls in the array.
+     *
+     * @private
+     */
+    private internalValues;
+    /**
+     * A function to update the current values of the form controls.
+     *
+     * @private
+     */
+    private setValues;
     /**
      * Creates an instance of FormArray.
      *
      * @param arrayValidation - A tuple where the first element is an initial array of control-level validation definitions
      * and the second element is an array of array-level validators.
+     * @param initialValues - Optional initial values for the form controls.
+     */
+    constructor(arrayValidation: ArrayValidation<T>, initialValues?: T | T[]);
+    /**
+     * Gets the current values of the form controls in the array.
+     *
+     * @returns A cloned copy of the values array.
+     */
+    get(): T[];
+    /**
+     * Gets the value of a specific control in the array.
+     *
+     * @param index - The index of the control.
+     * @returns A cloned copy of the control value.
      */
-    constructor(arrayValidation: ArrayValidation<T>);
+    getAt(index: number): T | undefined;
     /**
-     * Removes a control's validation at the specified index.
+     * Gets a property value from an object at the specified index.
+     *
+     * @param index - The index of the control.
+     * @param key - The property key to retrieve.
+     * @returns The property value, or undefined if not found.
+     */
+    getProperty<K extends keyof T>(index: number, key: K): T[K] | undefined;
+    /**
+     * Sets the values of all controls in the array.
+     *
+     * @param values - The new values for the controls.
+     */
+    set(values: T[]): void;
+    /**
+     * Sets the value of a control at the specified index.
+     *
+     * @param index - The index of the control to update.
+     * @param value - The new value for the control.
+     */
+    setAt(index: number, value: T): void;
+    /**
+     * Sets a property value on an object at the specified index.
+     *
+     * @param index - The index of the control.
+     * @param key - The property key to set.
+     * @param value - The new value for the property.
+     */
+    setProperty<K extends keyof T>(index: number, key: K, value: T[K]): void;
+    /**
+     * Removes a control at the specified index.
      *
      * @param index - The index of the control to remove.
      */
     remove(index: number): void;
     /**
-     * Replaces a control's validation at the specified index with a new validation.
+     * Replaces a control at the specified index with new validation and value.
      *
      * @param index - The index of the control to replace.
      * @param controlValidation - The new validation to apply for the control.
+     * @param value - The new value for the control.
      */
-    replace(index: number, controlValidation: ValidationDefault<T, keyof T>): void;
+    replace(index: number, controlValidation: ValidationDefault<T, keyof T>, value?: T): void;
     /**
-     * Adds a new control validation to the array.
+     * Adds a new control to the array with validation and optional value.
      *
      * @param controlValidation - The validation definition to add.
+     * @param value - Optional value for the new control.
      */
-    add(controlValidation: ValidationDefault<T, keyof T>): void;
+    add(controlValidation: ValidationDefault<T, keyof T>, value?: T): void;
     /**
      * Checks if any validation errors exist.
      *
@@ -73,6 +130,26 @@ export declare class FormArray<T extends object> {
      * @returns `true` if the specific error is present, otherwise `false`.
      */
     hasValidator(index: number, errKey: string): boolean;
+    /**
+     * Gets all errors for the form array.
+     *
+     * @returns An array of error arrays for each control.
+     */
+    getErrors(): Error[][];
+    /**
+     * Gets errors for a specific control in the array.
+     *
+     * @param index - The index of the control.
+     * @returns An array of errors for the control, or an empty array if not found.
+     */
+    getErrorsAt(index: number): Error[];
+    /**
+     * Validates the form array using current values.
+     *
+     * @param index - Optional index to validate just one control.
+     * @returns True if validation passes, false otherwise.
+     */
+    validateCurrent(index?: number): boolean;
     /**
      * Validates the provided form control values.
      *

package/dist/components/Form/formHelp/models.d.ts

@@ -27,5 +27,5 @@ export type ValidatorObject<T> = {
     [P in keyof T]?: ValidatorResult<T[P]>[];
 };
 export type FormGroupData<T extends object> = {
-    [P in keyof T]: [T[P], ValidatorResult<T[P]>[]] | FormArray<T>;
+    [P in keyof T]: [T[P], ValidatorResult<T[P]>[]] | (T[P] extends object ? FormArray<T[P]> : any);
 };

package/dist/components/Icon/icon.d.ts

@@ -1,39 +1,12 @@
 import { Component } from "solid-js";
 export interface IconProps {
-    /** Name of the icon (must match a valid Material Symbol identifier) */
     name: string;
-    /**
-     * Icon size: can be "small", "medium", "large" or a custom number (in pixels)
-     * - small: 16px, medium: 24px (default), large: 32px
-     */
-    size?: "small" | "medium" | "large" | number;
-    /** Icon color; default is 'currentColor' */
+    size?: number | "small" | "medium" | "large";
     color?: string;
-    /**
-     * Icon weight:
-     * - "thin" maps to weight 300,
-     * - "regular" (or "bold") maps to weight 400.
-     */
-    weight?: "thin" | "regular" | "bold";
-    /**
-     * Icon variant determines the base style.
-     * Supported values: "outlined" | "rounded" | "sharp".
-     * Defaults to "outlined".
-     */
     variant?: "outlined" | "rounded" | "sharp";
-    /**
-     * When true, load the filled version of the icon.
-     * This toggles the file name to include a `-fill` suffix.
-     */
-    filled?: boolean;
-    /**
-     * Accessibility label for the icon.
-     * If not provided, the icon will be hidden from screen readers.
-     */
-    ariaLabel?: string;
     onClick?: (e: MouseEvent) => void;
     onPointerDown?: (e: PointerEvent) => void;
 }
 declare const Icon: Component<IconProps>;
-export { Icon };
 export default Icon;
+export { Icon };

package/dist/components/Input/inputV2.d.ts

@@ -0,0 +1,12 @@
+import { Component, JSX } from "solid-js";
+interface InputProps extends JSX.InputHTMLAttributes<HTMLInputElement> {
+    tooltip?: string;
+    transparent?: boolean;
+    onChange?: (e: Event & {
+        currentTarget: HTMLInputElement;
+        target: HTMLInputElement;
+    }) => void;
+}
+declare const Input: Component<InputProps>;
+export { Input };
+export default Input;

package/dist/components/Menu/menu.d.ts

@@ -4,6 +4,8 @@ interface MenuProps extends JSX.HTMLAttributes<HTMLDivElement> {
     children: JSX.Element;
     position?: 'left' | 'center' | 'right';
     show: [Accessor<boolean>, Setter<boolean>];
+    areaExclusionRefs?: Accessor<HTMLElement | undefined>[];
+    submenu?: boolean;
 }
 export declare const Menu: Component<MenuProps>;
 export {};

package/dist/components/Menu/menuContext.d.ts

@@ -0,0 +1,14 @@
+import { JSX } from "solid-js";
+interface MenuContext {
+    registerWithParent: (child: HTMLElement | undefined) => void;
+    unregisterWithParent: (child: HTMLElement | undefined) => void;
+}
+declare const MenuContext: import("solid-js").Context<MenuContext | undefined>;
+export declare const useMenuContext: () => MenuContext | undefined;
+interface MenuProviderProps {
+    registerWithParent: (child: HTMLElement | undefined) => void;
+    unregisterWithParent: (child: HTMLElement | undefined) => void;
+    children: JSX.Element;
+}
+export declare const MenuProvider: (props: MenuProviderProps) => JSX.Element;
+export {};

package/dist/components/Menu/menuDropdown.d.ts

@@ -1,7 +1,7 @@
 import { Component, JSX } from "solid-js";
 interface MenuItemProps extends JSX.HTMLAttributes<HTMLLIElement> {
     children: JSX.Element;
-    header?: JSX.Element;
+    header?: () => JSX.Element;
 }
 export declare const MenuDropdown: Component<MenuItemProps>;
 export {};

package/dist/components/Radio/radio.d.ts

@@ -0,0 +1,13 @@
+import { JSX } from "solid-js";
+interface RadioProps {
+    value: string | number;
+    label?: string | JSX.Element;
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onChange?: (value: string | number) => void;
+    disabled?: boolean;
+    name?: string;
+    ariaLabel?: string;
+}
+export declare function Radio(props: RadioProps): JSX.Element;
+export {};

package/dist/components/Radio/radioGroup.d.ts

@@ -0,0 +1,23 @@
+import { JSX } from "solid-js";
+interface RadioGroupProps {
+    name?: string;
+    label?: string;
+    ariaLabel?: string;
+    value?: string | number;
+    defaultValue?: string | number;
+    onChange?: (value: string | number) => void;
+    disabled?: boolean;
+    children: JSX.Element | JSX.Element[];
+}
+export interface RadioGroupContextType {
+    name: string;
+    selectedValue: () => string | number | undefined;
+    setSelectedValue: (val: string | number) => void;
+    register: (el: HTMLInputElement) => void;
+    unregister: (el: HTMLInputElement) => void;
+    handleKeyDown: (e: KeyboardEvent) => void;
+    disabled: boolean;
+}
+export declare const RadioGroupContext: import("solid-js").Context<RadioGroupContextType | undefined>;
+export declare function RadioGroup(props: RadioGroupProps): JSX.Element;
+export {};

package/dist/components/Select/select.component.d.ts

@@ -1,13 +1,4 @@
 import { JSX } from "solid-js";
-interface SelectContextValue<T> {
-    isSelected: (val: T) => boolean;
-    selectValue: (val: T) => void;
-    registerOption?: (val: T, label: JSX.Element) => void;
-    unregisterOption?: (val: T) => void;
-    selectRef?: (val: HTMLDivElement | undefined) => HTMLDivElement | undefined;
-    selectStyle?: () => string;
-}
-export declare const SelectContext: import("solid-js").Context<SelectContextValue<any> | undefined>;
 interface SelectProps<T = string, K = boolean> {
     multiple?: K;
     value?: T;
@@ -15,6 +6,7 @@ interface SelectProps<T = string, K = boolean> {
     id?: string;
     defaultValue?: T;
     onChange?: (value: T) => void;
+    onSelect?: (value: T) => void;
     placeholder?: string;
     tooltip?: string;
     renderValue?: (selected: T) => JSX.Element;

package/dist/components/Select/selectContext.d.ts

@@ -0,0 +1,14 @@
+import { JSX } from "solid-js";
+export interface SelectContextValue<T> {
+    isSelected: (val: T) => boolean;
+    selectValue: (val: T) => void;
+    registerOption?: (val: T, label: JSX.Element) => void;
+    unregisterOption?: (val: T) => void;
+    selectRef?: (val: HTMLDivElement | undefined) => HTMLDivElement | undefined;
+    selectStyle?: () => string;
+}
+export declare const useSelectContext: () => SelectContextValue<any>;
+export declare const SelectContextProvider: (props: {
+    value: SelectContextValue<any>;
+    children: JSX.Element;
+}) => JSX.Element;

package/dist/components/TableV2/droprow.d.ts

@@ -3,6 +3,7 @@ interface DropRowProps<T> extends Omit<JSX.HTMLAttributes<HTMLTableRowElement>,
     children: (item: T, index: number) => JSX.Element;
     isOpen?: boolean;
     rowNumber?: number;
+    isDropHeader?: boolean;
 }
 export declare const DropRowBody: Component<DropRowProps<any>>;
 export {};

package/dist/components/TableV2/formArrayTable.d.ts

@@ -0,0 +1,18 @@
+import { JSX } from "solid-js";
+interface FormArrayTableProps<T = any> {
+    children: JSX.Element;
+    formArrayPath: string;
+    columns: string[];
+    initialData?: T[];
+    style?: JSX.CSSProperties | string;
+    id?: string;
+    class?: string;
+    otherStyles?: {
+        thead?: any;
+        tbody?: any;
+        tfoot?: any;
+        colGroup?: any;
+    };
+}
+export declare const FormArrayTable: <T extends object>(props: FormArrayTableProps<T>) => JSX.Element;
+export {};

package/dist/components/TableV2/table.d.ts

@@ -5,7 +5,6 @@ interface TableProps<T = any> {
     data: Accessor<T[]>;
     setData?: Setter<T[]>;
     columns: string[];
-    formName?: string;
     style?: JSX.CSSProperties | string;
     id?: string;
     class?: string;

package/dist/components/TableV2/tableProvider.d.ts

@@ -1,4 +1,4 @@
-import { JSX } from "solid-js";
+import { Accessor, JSX } from "solid-js";
 export interface StyleContainer<T> {
     class?: string;
     style?: JSX.CSSProperties | string;
@@ -52,13 +52,17 @@ export interface ColumnStyle {
 export interface ColumnGroupStyle {
     [colName: string]: StyleContainer<JSX.ColgroupHTMLAttributes<HTMLTableColElement>>;
 }
-export interface TableContext<T> {
+export interface TableContext<T = any> {
+    refresh: Accessor<boolean>;
     getDataSource: () => T[];
     setDataSource: (data: T[]) => any;
     addHeaderCell: (name: string, index: number, header: JSX.Element) => void;
     addRowCell: (index: number, name: string, cell: (item: T, index: number) => JSX.Element, isDropDown?: boolean) => void;
+    removeRowCell?: (index: number, name: string) => void;
     addFooterCell: (index: number, name: string, cell: JSX.Element) => void;
+    removeFooterCell?: (index: number, name: string) => void;
     addColumnStyle: (name: string, style: StyleContainer<JSX.ColHTMLAttributes<HTMLTableColElement>>) => void;
+    removeColumnStyle?: (name: string) => void;
     addHeaderStyle: (name: string, index: number, style: StyleContainer<JSX.ThHTMLAttributes<HTMLTableCellElement>>) => void;
     addCellStyle: (rowIndex: number, colName: string, style: StyleContainer<JSX.TdHTMLAttributes<HTMLTableCellElement>>) => void;
     addFootCellStyle: (rowIndex: number, colName: string, style: StyleContainer<JSX.TdHTMLAttributes<HTMLTableCellElement>>) => void;

package/dist/components/modal/popup.component.d.ts

@@ -0,0 +1,24 @@
+import { Accessor, Component, JSX, Setter } from "solid-js";
+type Props = {
+    title: string;
+    show: [Accessor<boolean>, Setter<boolean>];
+    children?: JSX.Element;
+    width?: string;
+    height?: string;
+    translate?: {
+        x?: string;
+        y?: string;
+    };
+    styleType?: "primary" | "accent" | "tertiary";
+    onClick?: (e: MouseEvent) => void;
+    ref?: JSX.HTMLAttributes<HTMLDivElement>["ref"];
+};
+export declare const Modal: Component<Props>;
+declare module "solid-js" {
+    namespace JSX {
+        interface Directives {
+            clickOutside: () => void;
+        }
+    }
+}
+export {};

package/dist/components/popup/popup.component.d.ts

@@ -10,7 +10,8 @@ type Props = {
         y?: string;
     };
     styleType?: "primary" | "accent" | "tertiary";
-    ref?: Accessor<HTMLDivElement | undefined>;
+    onClick?: (e: MouseEvent) => void;
+    ref?: JSX.HTMLAttributes<HTMLDivElement>["ref"];
 };
 export declare const Modal: Component<Props>;
 declare module "solid-js" {

package/dist/index.d.ts

@@ -4,18 +4,22 @@ export * from './components/Carosel/Slide';
 export * from './components/Chip/Chip';
 export * from './components/Chipbar/chipbar';
 export * from './components/ComponentBody/body.component';
-export * from './components/Input/Input';
+export * from './components/Input/inputV2';
+export * from './components/Checkbox/checkbox';
 export * from './components/Select/select.component';
 export * from './components/Select/option.component';
-export * from './components/Snackbar/snackbar';
-export * from './components/popup/popup.component';
 export * from './components/TextArea/TextArea';
+export * from './components/modal/popup.component';
 export * from './components/expansion/expansion';
-export * from './components/Icon/icon';
+export * from './components/Snackbar/snackbar';
 export * from './components/Container/container';
+export * from './components/Icon/icon';
 export * from './components/Menu/menu';
 export * from './components/Menu/menuitem';
 export * from './components/Menu/menuDropdown';
+export * from './components/Radio/radioGroup';
+export * from './components/Radio/radio';
+export { FormArray } from './components/Form/formHelp/formArray';
 export { Form } from './components/Form/form';
 export { FormField } from './components/FormField/formField';
 export { FormGroup, Validators } from './components/Form/formGroup';