@konoma-development/react-components 0.2.0 → 0.2.2

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

@@ -1,4 +1,4 @@
 import { FormFieldProps } from './types.ts';
 export default function Checkbox<DataType>({ classesFilled, classesError, classesEmpty, labelClassesFilled, labelClassesError, labelClassesEmpty, iconClassesFilled, value, defaultValue, 
 /** UNUSED, only listed so that the typing for onInput does not clash with the onInput event of the input */
-onInput, onChange, label, indeterminate, disabled, className, name, error, ...props }: FormFieldProps<DataType>): import("react/jsx-runtime").JSX.Element;
+onInput, onChange, label, indeterminate, disabled, className, name, error, dataTestId, ...props }: FormFieldProps<DataType>): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/checkboxList.d.ts

@@ -1,2 +1,2 @@
 import { FormFieldProps } from './types.ts';
-export default function CheckboxList<DataType>({ labelClasses, wrapperClasses, classes, classesError, errorClasses, childClasses, label, error, name, options, required, labelPosition, values, onChange, }: FormFieldProps<DataType>): import("react/jsx-runtime").JSX.Element;
+export default function CheckboxList<DataType>({ labelClasses, wrapperClasses, classes, classesError, errorClasses, childClasses, label, error, name, options, required, labelPosition, values, dataTestId, onChange, }: FormFieldProps<DataType>): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/form.d.ts

@@ -3,11 +3,12 @@ export declare const ErrorContext: import('react').Context<{
     errors: Record<string, string[]>;
     setErrors: (errors: Record<string, string[]>) => void;
 }>;
-export default function Form<DataType>({ children, className, validators, data, formRef, onValidation, onSubmit, }: {
+export default function Form<DataType>({ children, className, validators, data, formRef, dataTestId, onValidation, onSubmit, }: {
     formRef?: Ref<HTMLFormElement>;
     children: ReactNode;
     className?: string;
     data: DataType;
+    dataTestId?: string;
     validators: Record<keyof DataType, ((value: string | number | boolean | null) => string)[]>;
     onValidation?: (errors: Record<keyof DataType, string[]>) => void;
     onSubmit: () => Promise<void>;

package/dist/components/form/input.d.ts

@@ -1,2 +1,2 @@
 import { FormFieldProps } from './types.ts';
-export default function Input<DataType>({ classes, wrapperClasses, labelClasses, iconLeftClasses, iconRightClasses, errorClasses, classesError, classesNeutral, additionalClassesIconLeft, additionalClassesIconRight, wrapperRightClasses, label, iconLeftPath, iconLeftName, iconRightPath, iconRightName, textRight, centered, error, step, required, name, value, mask, defaultValue, placeholder, className, onIconRightClick, onIconLeftClick, onChange, onClick, onKeyDown, onBlur, ...props }: FormFieldProps<DataType>): import("react/jsx-runtime").JSX.Element;
+export default function Input<DataType>({ controlClasses, wrapperClasses, labelClasses, iconLeftClasses, iconRightClasses, errorClasses, classesError, classesNeutral, classes, additionalClassesIconLeft, additionalClassesIconRight, wrapperRightClasses, label, iconLeftPath, iconLeftName, iconRightPath, iconRightName, textRight, centered, error, step, required, name, value, mask, defaultValue, placeholder, className, dataTestId, onIconRightClick, onIconLeftClick, onChange, onClick, onKeyDown, onBlur, ...props }: FormFieldProps<DataType>): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/phoneInput.d.ts

@@ -1,2 +1,2 @@
 import { FormFieldProps } from './types.ts';
-export default function PhoneInput<DataType>({ classes, wrapperClasses, labelClasses, wrapperLeftClasses, errorClasses, classesError, classesNeutral, label, centered, error, required, name, value, defaultValue, className, onChange, onClick, onKeyDown, onBlur, ...props }: FormFieldProps<DataType>): import("react/jsx-runtime").JSX.Element;
+export default function PhoneInput<DataType>({ classes, wrapperClasses, labelClasses, wrapperLeftClasses, errorClasses, classesError, classesNeutral, label, centered, error, required, name, value, defaultValue, dataTestId, className, onChange, onClick, onKeyDown, onBlur, ...props }: FormFieldProps<DataType>): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/radiobuttonGroup.d.ts

@@ -1,4 +1,4 @@
 import { FormFieldProps, Option } from './types.ts';
-export default function RadioButtonGroup<DataType>({ classes, controlClasses, optionClasses, labelClasses, classesFilled, classesEmpty, wrapperClasses, labelWrapperClasses, errorClasses, options, error, required, value, label, name, arrangement, onChange, }: FormFieldProps<DataType> & {
+export default function RadioButtonGroup<DataType>({ classes, controlClasses, optionClasses, labelClasses, classesFilled, classesEmpty, wrapperClasses, labelWrapperClasses, errorClasses, options, error, required, value, label, name, dataTestId, arrangement, onChange, }: FormFieldProps<DataType> & {
     options: Option[];
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/select.d.ts

@@ -1,2 +1,2 @@
 import { FormFieldProps } from './types.ts';
-export default function Select<DataType>({ classes, errorClasses, labelClasses, labelWrapperClasses, classesNeutral, classesError, focusClasses, controlClasses, optionClasses, optionSelectedClasses, optionFocusedClasses, valueClasses, placeholderClasses, wrapperClasses, indicatorClasses, valueContainerClasses, options, placeholder, className, required, error, defaultValue, menuPlacement, searchable, label, name, isClearable, disabled, noValue, allowCustomValues, customValueLabel, menuPortalTarget, isMulti, onInput, onKeyDown, onChange, ...props }: FormFieldProps<DataType>): import("react/jsx-runtime").JSX.Element;
+export default function Select<DataType>({ classes, errorClasses, labelClasses, labelWrapperClasses, classesNeutral, classesError, focusClasses, controlClasses, optionClasses, optionSelectedClasses, optionFocusedClasses, valueClasses, placeholderClasses, wrapperClasses, indicatorClasses, valueContainerClasses, options, placeholder, className, required, error, defaultValue, menuPlacement, searchable, label, name, isClearable, disabled, noValue, allowCustomValues, customValueLabel, menuPortalTarget, isMulti, dataTestId, onInput, onKeyDown, onChange, ...props }: FormFieldProps<DataType>): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/tagList.d.ts

@@ -1,2 +1,2 @@
 import { FormFieldProps } from './types.ts';
-export default function TagList<DataType>({ classes, wrapperClasses, labelClasses, errorClasses, classesError, classesNeutral, label, error, required, values, addTagTitle, onChange, className, }: FormFieldProps<DataType>): import("react/jsx-runtime").JSX.Element;
+export default function TagList<DataType>({ classes, wrapperClasses, labelClasses, errorClasses, classesError, classesNeutral, label, error, required, values, dataTestId, addTagTitle, onChange, className, }: FormFieldProps<DataType>): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/textarea.d.ts

@@ -1,4 +1,4 @@
 import { FormFieldProps } from './types.ts';
-export default function Textarea<DataType>({ classes, classesNeutral, classesError, errorClasses, labelClasses, hintClasses, wrapperClasses, resizeClasses, resizeIconClasses, controlClasses, labelWrapperClasses, classesDisabled, resizeIconPath, resizeIconName, label, error, required, initialHeight, maxLength, replacements, name, value, disabled, defaultValue, maxLengthLabel, 
+export default function Textarea<DataType>({ classes, classesNeutral, classesError, errorClasses, labelClasses, hintClasses, wrapperClasses, resizeClasses, resizeIconClasses, controlClasses, labelWrapperClasses, classesDisabled, resizeIconPath, resizeIconName, label, error, required, initialHeight, maxLength, replacements, name, value, disabled, defaultValue, dataTestId, maxLengthLabel, 
 /** UNUSED, only listed so that the typing for onInput does not clash with the onInput event of the textarea */
 onInput, onChange, ...props }: FormFieldProps<DataType>): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/types.d.ts

@@ -1,4 +1,4 @@
-import { ChangeEvent, HTMLInputTypeAttribute, MouseEvent, ReactNode } from 'react';
+import { ChangeEvent, HTMLAttributes, HTMLInputTypeAttribute, MouseEvent, ReactNode } from 'react';
 type LabelPosition = 'top' | 'bottom' | 'left' | 'right';
 export type FormValue = string | number | boolean | Option;
 export interface Option {
@@ -67,8 +67,12 @@ export interface Classes {
     valueContainerClasses?: string;
 }
 export interface FormFieldProps<DataType> extends Classes {
+    dataTestId?: string;
     allowCustomValues?: boolean;
     customValueLabel?: string;
+    autoComplete?: string;
+    id?: string;
+    inputMode?: HTMLAttributes<HTMLElement>['inputMode'];
     arrangement?: 'horizontal' | 'vertical';
     centered?: boolean;
     autoFocus?: boolean;

package/dist/components/form/validators.d.ts

@@ -1,2 +1,2 @@
-export declare function required(message: string): (value: string | number | boolean | null) => string;
-export declare function email(message: string): (value: string | number | boolean | null) => string;
+export declare function required(message: string): (value: string | number | boolean | null | Record<string, string | number | boolean | null>) => string;
+export declare function email(message: string): (value: string | number | boolean | null | Record<string, string | number | boolean | null>) => string;

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

@@ -6,7 +6,7 @@ export interface PaginationClasses {
     resultsTextClasses: string;
     controlClasses: string;
 }
-export default function Pagination({ wrapperClasses, resultsClasses, resultsTextClasses, activeIconClasses, inactiveIconClasses, controlClasses, xToY, currentPage, currentStart, currentEnd, currentTotal, totalPages, showButtons, onFirstPage, onPreviousPage, onNextPage, onLastPage, toPage, }: {
+export default function Pagination({ wrapperClasses, resultsClasses, resultsTextClasses, activeIconClasses, inactiveIconClasses, controlClasses, xToY, currentPage, totalPages, showButtons, dataTestId, onFirstPage, onPreviousPage, onNextPage, onLastPage, toPage, }: {
     currentLoaded: number;
     currentStart: number;
     currentEnd: number;
@@ -21,6 +21,7 @@ export default function Pagination({ wrapperClasses, resultsClasses, resultsText
     controlClasses?: string;
     xToY: string;
     showButtons: boolean;
+    dataTestId?: string;
     onFirstPage?: () => void;
     onPreviousPage?: () => void;
     onNextPage?: () => void;

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

@@ -18,7 +18,7 @@ export interface TableColumn<DataType> {
 export default function Table<DataType extends {
     dragRef?: React.RefObject<HTMLDivElement>;
     index?: number;
-}>({ noDataClasses, wrapperClasses, tableClasses, rowClasses, rowLeftWrapperClasses, rowCenterWrapperClasses, rowRightWrapperClasses, headerClasses, paginationClasses, filterComponents, columnsCenter, columnsRight, columnsLeft, cellRenderer, filters, data, pagination, totalRows, totalPagesProp, currentPage, noEntryLabel, allowReorder, showFilters, pagesize, xToY, isInfinite, onDragRow, onDropRow, onRowClick, onRowDoubleClick, onScroll, onUpdateFilters, onSort, onFirstPage, onPreviousPage, onNextPage, onLastPage, toPage, }: {
+}>({ noDataClasses, wrapperClasses, tableClasses, rowClasses, rowLeftWrapperClasses, rowCenterWrapperClasses, rowRightWrapperClasses, headerClasses, paginationClasses, filterComponents, columnsCenter, columnsRight, columnsLeft, cellRenderer, filters, data, pagination, totalRows, totalPagesProp, currentPage, noEntryLabel, allowReorder, showFilters, pagesize, xToY, isInfinite, name, onDragRow, onDropRow, onRowClick, onRowDoubleClick, onScroll, onUpdateFilters, onSort, onFirstPage, onPreviousPage, onNextPage, onLastPage, toPage, }: {
     wrapperClasses?: string;
     tableClasses?: string;
     rowClasses?: string;
@@ -55,6 +55,7 @@ export default function Table<DataType extends {
     xToY?: string;
     isInfinite?: boolean;
     pagesize?: number;
+    name?: string;
     onDragRow?: (dragIndex: number, hoverIndex: number) => void;
     onDropRow?: (dragIndex: number, hoverIndex: number) => void;
     onScroll?: (event: React.UIEvent<HTMLDivElement>) => void;

package/dist/components/ui/button.d.ts

@@ -1,5 +1,5 @@
 import { MouseEvent } from 'react';
-export default function Button({ className, classesBase, classesPrimary, classesSecondary, classesActiveSecondary, classesError, classesAlert, loadingClassesBase, loadingClassesPrimary, loadingClassesSecondary, loadingClassesActiveSecondary, loadingClassesError, loadingClassesAlert, iconLeftClasses, iconRightClasses, type, variant, label, loading, disabled, iconLeftPath, iconLeftName, iconRightPath, iconRightName, onClick, }: {
+export default function Button({ className, classesBase, classesPrimary, classesSecondary, classesActiveSecondary, classesError, classesAlert, loadingClassesBase, loadingClassesPrimary, loadingClassesSecondary, loadingClassesActiveSecondary, loadingClassesError, loadingClassesAlert, iconLeftClasses, iconRightClasses, type, variant, label, loading, disabled, iconLeftPath, iconLeftName, iconRightPath, iconRightName, name, dataTestId, onClick, }: {
     classesBase?: string;
     classesPrimary?: string;
     classesSecondary?: string;
@@ -24,5 +24,7 @@ export default function Button({ className, classesBase, classesPrimary, classes
     iconLeftName?: string;
     iconRightPath?: string;
     iconRightName?: string;
+    name?: string;
+    dataTestId?: string;
     onClick?: (e: MouseEvent) => Promise<void> | void;
 }): import("react/jsx-runtime").JSX.Element;

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

@@ -1,5 +1,6 @@
 import { HTMLProps, SVGProps } from 'react';
-export default function Icon({ path, name, ...props }: (HTMLProps<HTMLElement> | SVGProps<SVGSVGElement>) & {
+export default function Icon({ path, name, dataTestId, ...props }: (HTMLProps<HTMLElement> | SVGProps<SVGSVGElement>) & {
     name?: string;
     path?: string;
+    dataTestId?: string;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/modal.d.ts

@@ -1,5 +1,5 @@
 import { default as Button } from './button.tsx';
-export default function Modal({ backdropClasses, contentClasses, headerWrapperClasses, footerWrapperClasses, footerLeftClasses, footerRightClasses, titleClasses, closeWrapperClasses, iconClasses, children, headerContent, footerContent, title, footerActions, hasCloseIcon, onClose, }: {
+export default function Modal({ backdropClasses, contentClasses, headerWrapperClasses, footerWrapperClasses, footerLeftClasses, footerRightClasses, titleClasses, closeWrapperClasses, iconClasses, children, headerContent, footerContent, title, dataTestId, footerActions, hasCloseIcon, onClose, }: {
     backdropClasses?: string;
     contentClasses?: string;
     headerWrapperClasses?: string;
@@ -12,6 +12,7 @@ export default function Modal({ backdropClasses, contentClasses, headerWrapperCl
     children: React.ReactNode;
     headerContent?: React.ReactNode;
     footerContent?: React.ReactNode;
+    dataTestId?: string;
     title?: string;
     footerActions?: (React.ComponentProps<typeof Button> & {
         position: 'left' | 'right';

package/dist/components/ui/tabs.d.ts

@@ -3,7 +3,7 @@ interface Tab<DataType> {
     label: string;
     count: number;
 }
-export default function Tabs<DataType>({ wrapperClasses, tabActiveClasses, tabInactiveClasses, countActiveClasses, countInactiveClasses, tabBaseClasses, countBaseClasses, activeMarkerClass, showCounts, tabs, active, onClick, }: {
+export default function Tabs<DataType>({ wrapperClasses, tabActiveClasses, tabInactiveClasses, countActiveClasses, countInactiveClasses, tabBaseClasses, countBaseClasses, activeMarkerClass, showCounts, tabs, active, dataTestId, onClick, }: {
     wrapperClasses?: string;
     tabActiveClasses?: string;
     tabInactiveClasses?: string;
@@ -15,6 +15,7 @@ export default function Tabs<DataType>({ wrapperClasses, tabActiveClasses, tabIn
     showCounts?: boolean;
     tabs: Tab<DataType>[];
     active: DataType;
+    dataTestId?: string;
     onClick: (tab: DataType) => void;
 }): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/ui/tag.d.ts

@@ -1,4 +1,4 @@
-export default function Tag({ wrapperClasses, titleClasses, iconLeftClasses, iconRightClasses, iconLeftPath, iconLeftName, iconRightPath, iconRightName, title, onClick, onClickIconLeft, onClickIconRight, }: {
+export default function Tag({ wrapperClasses, titleClasses, iconLeftClasses, iconRightClasses, iconLeftPath, iconLeftName, iconRightPath, iconRightName, dataTestId, title, onClick, onClickIconLeft, onClickIconRight, }: {
     wrapperClasses?: string;
     titleClasses?: string;
     iconLeftClasses?: string;
@@ -8,6 +8,7 @@ export default function Tag({ wrapperClasses, titleClasses, iconLeftClasses, ico
     iconRightPath?: string;
     iconRightName?: string;
     title: string;
+    dataTestId?: string;
     onClick?: () => void;
     onClickIconLeft?: () => void;
     onClickIconRight?: () => void;