chop-logic-components 1.1.2 → 1.1.4

package/dist/{types → models}/chop-logic-theme.d.ts

@@ -1,3 +1,5 @@
+import { ChopLogicThemeMode } from '../enums';
+
 export interface ChopLogicTheme {
     fontColorBase: string;
     fontColorLight: string;
@@ -26,3 +28,9 @@ export interface ChopLogicTheme {
     zIndexPopup: string;
     zIndexModal: string;
 }
+export interface ChopLogicThemeContextProps {
+    mode: ChopLogicThemeMode;
+    setMode?: (mode: ChopLogicThemeMode) => void;
+    customTheme?: Partial<ChopLogicTheme>;
+    setCustomTheme?: (customTheme: ChopLogicTheme) => void;
+}

package/dist/models/common.d.ts

@@ -0,0 +1,30 @@
+import { CSSProperties } from 'react';
+
+export interface ChopLogicComponentProps {
+    id?: string;
+    className?: string;
+    style?: CSSProperties;
+    tabIndex?: number;
+    title?: string;
+}
+export interface ChopLogicInputProps extends ChopLogicComponentProps {
+    label: string;
+    name: string;
+    disabled?: boolean;
+    required?: boolean;
+}
+export type ChopLogicSelectValue = {
+    id: string;
+    label: string;
+} & {
+    [key in string]: unknown;
+};
+export type ChopLogicMultiSelectValue = ChopLogicSelectValue & {
+    selected: boolean;
+};
+export type ChopLogicNumericInputValidator = (input?: number) => boolean;
+export type ChopLogicTextInputValidator = (input: string) => boolean;
+export type ChopLogicRegExpWithFlags = {
+    regexp: string;
+    flags?: string;
+};

package/dist/models/components/alert.d.ts

@@ -0,0 +1,10 @@
+import { ChopLogicAlertMode, ChopLogicIconName } from '../../enums';
+import { ChopLogicComponentProps } from '../common.ts';
+
+export interface ChopLogicAlertProps extends ChopLogicComponentProps {
+    isOpened: boolean;
+    onClose: () => void;
+    message: string;
+    mode?: ChopLogicAlertMode;
+    icon?: ChopLogicIconName;
+}

package/dist/{types → models}/components/button.d.ts

@@ -1,8 +1,8 @@
 import { FocusEventHandler, MouseEventHandler } from 'react';
 import { ChopLogicButtonView, ChopLogicIconName } from '../../enums';
-import { CommonInputProps } from './_common';
+import { ChopLogicInputProps } from '../common.ts';
 
-export type ChopLogicButtonProps = Partial<CommonInputProps> & {
+export interface ChopLogicButtonProps extends Partial<ChopLogicInputProps> {
     onClick?: MouseEventHandler<HTMLButtonElement>;
     onFocus?: FocusEventHandler<HTMLButtonElement>;
     onBlur?: FocusEventHandler<HTMLButtonElement>;
@@ -12,4 +12,4 @@ export type ChopLogicButtonProps = Partial<CommonInputProps> & {
     extended?: boolean;
     type?: 'button' | 'reset' | 'submit';
     tooltip?: string;
-};
+}

package/dist/{types → models}/components/checkbox.d.ts

@@ -1,9 +1,9 @@
 import { ChangeEventHandler } from 'react';
-import { CommonInputProps } from './_common';
+import { ChopLogicInputProps } from '../common.ts';
 
-export type ChopLogicCheckboxProps = CommonInputProps & {
+export interface ChopLogicCheckboxProps extends ChopLogicInputProps {
     noLabel?: boolean;
     iconPosition?: 'left' | 'right';
     onChange?: ChangeEventHandler<HTMLInputElement>;
     defaultChecked?: boolean;
-};
+}

package/dist/models/components/dialog.d.ts

@@ -0,0 +1,8 @@
+import { PropsWithChildren } from 'react';
+import { ChopLogicComponentProps } from '../common.ts';
+
+export interface ChopLogicDialogProps extends ChopLogicComponentProps, PropsWithChildren {
+    isOpened: boolean;
+    onClose: () => void;
+    title: string;
+}

package/dist/{types → models}/components/form.d.ts

@@ -1,25 +1,25 @@
 import { FormEventHandler, PropsWithChildren } from 'react';
-import { CommonComponentProps } from './_common.ts';
+import { ChopLogicComponentProps } from '../common.ts';
 
 export type ChopLogicFormData = {
     [key: string]: unknown;
 };
 export type ChopLogicFormValidationState = [string, boolean][];
-export type ChopLogicFormInputParams = {
+export interface ChopLogicFormInputParams {
     name: string;
     value: unknown;
     valid?: boolean;
-};
-export type ChopLogicFormContextProps = {
+}
+export interface ChopLogicFormContextProps {
     onChangeFormInput?: (params: ChopLogicFormInputParams) => void;
     initialValues?: ChopLogicFormData;
     resetSignal?: number;
-};
-export type ChopLogicFormProps = PropsWithChildren & CommonComponentProps & {
+}
+export interface ChopLogicFormProps extends PropsWithChildren, ChopLogicComponentProps {
     columns?: number;
     initialValues?: ChopLogicFormData;
     hasReset?: boolean;
     onClickSubmit?: (data: ChopLogicFormData) => void;
     onReset?: FormEventHandler<HTMLFormElement>;
     onSubmit?: FormEventHandler<HTMLFormElement>;
-};
+}

package/dist/{types → models}/components/grid.d.ts

@@ -1,14 +1,14 @@
 import { ReactElement } from 'react';
-import { CommonComponentProps } from './_common';
+import { ChopLogicComponentProps } from '../common.ts';
 
-export type ChopLogicGridProps = CommonComponentProps & {
+export interface ChopLogicGridProps extends ChopLogicComponentProps {
     columns: ChopLogicGridColumn[];
     data: ChopLogicGridItem[];
     caption?: string;
     selectable?: boolean;
     renderDataItem?: RenderDataItemCallback;
     onSelect?: (ids: string[]) => void;
-};
+}
 export type ChopLogicGridColumn = {
     field: string;
     title?: string;

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

@@ -0,0 +1,6 @@
+import { ChopLogicIconName } from '../../enums';
+import { ChopLogicComponentProps } from '../common.ts';
+
+export interface ChopLogicIconProps extends ChopLogicComponentProps {
+    name?: ChopLogicIconName;
+}

package/dist/models/components/multi-select.d.ts

@@ -0,0 +1,8 @@
+import { ChopLogicInputProps, ChopLogicSelectValue } from '../common.ts';
+
+export interface ChopLogicMultiSelectProps extends ChopLogicInputProps {
+    options: ChopLogicSelectValue[];
+    onChange?: (values?: ChopLogicSelectValue[]) => void;
+    defaultValue?: string | number | readonly string[];
+    placeholder?: string;
+}

package/dist/{types → models}/components/numeric.d.ts

@@ -1,10 +1,9 @@
 import { ChangeEventHandler, FocusEventHandler } from 'react';
-import { CommonInputProps } from './_common';
+import { ChopLogicInputProps, ChopLogicNumericInputValidator } from '../common.ts';
 
-export type NumericValidationFunction = (input?: number) => boolean;
-export type ChopLogicNumericInputProps = CommonInputProps & {
+export interface ChopLogicNumericInputProps extends ChopLogicInputProps {
     errorMessage?: string;
-    validator?: NumericValidationFunction;
+    validator?: ChopLogicNumericInputValidator;
     hasSpinButtons?: boolean;
     min?: number;
     max?: number;
@@ -15,4 +14,4 @@ export type ChopLogicNumericInputProps = CommonInputProps & {
     onChange?: ChangeEventHandler<HTMLInputElement>;
     onBlur?: FocusEventHandler<HTMLInputElement>;
     onFocus?: FocusEventHandler<HTMLInputElement>;
-};
+}

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

@@ -0,0 +1,8 @@
+import { ChopLogicInputProps, ChopLogicSelectValue } from '../common.ts';
+
+export interface ChopLogicSelectProps extends ChopLogicInputProps {
+    options: ChopLogicSelectValue[];
+    onChange?: (value?: ChopLogicSelectValue) => void;
+    placeholder?: string;
+    defaultValue?: string | number | readonly string[];
+}

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

@@ -0,0 +1,15 @@
+import { ReactElement } from 'react';
+import { ChopLogicTabsMode } from '../../enums';
+import { ChopLogicComponentProps } from '../common.ts';
+
+export interface ChopLogicTabsProps extends ChopLogicComponentProps {
+    tabs: ChopLogicTabItem[];
+    defaultTabId?: string;
+    mode?: ChopLogicTabsMode;
+}
+export interface ChopLogicTabItem {
+    content: ReactElement;
+    title: string;
+    id: string;
+    disabled?: boolean;
+}

package/dist/{types → models}/components/text.d.ts

@@ -1,17 +1,12 @@
 import { ChangeEventHandler, FocusEventHandler, HTMLInputAutoCompleteAttribute } from 'react';
-import { CommonInputProps } from './_common';
+import { ChopLogicInputProps, ChopLogicRegExpWithFlags, ChopLogicTextInputValidator } from '../common.ts';
 
-export type RegExpWithFlags = {
-    regexp: string;
-    flags?: string;
-};
-export type TextValidationFunction = (input: string) => boolean;
-export type ChopLogicTextInputProps = CommonInputProps & {
+export interface ChopLogicTextInputProps extends ChopLogicInputProps {
     errorMessage?: string;
     clearable?: boolean;
     readOnly?: boolean;
     type?: 'text' | 'email' | 'password';
-    validator?: RegExpWithFlags | TextValidationFunction;
+    validator?: ChopLogicRegExpWithFlags | ChopLogicTextInputValidator;
     maxLength?: number;
     placeholder?: string;
     defaultValue?: string;
@@ -20,4 +15,4 @@ export type ChopLogicTextInputProps = CommonInputProps & {
     onChange?: ChangeEventHandler<HTMLInputElement>;
     onBlur?: FocusEventHandler<HTMLInputElement>;
     onFocus?: FocusEventHandler<HTMLInputElement>;
-};
+}

package/dist/models/components/tooltip.d.ts

@@ -0,0 +1,9 @@
+import { PropsWithChildren, ReactElement } from 'react';
+import { ChopLogicTooltipContainer } from '../../enums';
+import { ChopLogicComponentProps } from '../common.ts';
+
+export interface ChopLogicTooltipProps extends PropsWithChildren, ChopLogicComponentProps {
+    tooltipContent: string | ReactElement;
+    containerTag?: ChopLogicTooltipContainer;
+    visibleOn?: 'hover' | 'click' | 'focus' | 'contextmenu';
+}

package/dist/models/index.d.ts

@@ -0,0 +1,15 @@
+export type { ChopLogicTheme, ChopLogicThemeContextProps } from './chop-logic-theme.ts';
+export type { ChopLogicComponentProps, ChopLogicInputProps, ChopLogicMultiSelectValue, ChopLogicNumericInputValidator, ChopLogicRegExpWithFlags, ChopLogicSelectValue, ChopLogicTextInputValidator, } from './common.ts';
+export type { ChopLogicAlertProps } from './components/alert.ts';
+export type { ChopLogicButtonProps } from './components/button.ts';
+export type { ChopLogicCheckboxProps } from './components/checkbox.ts';
+export type { ChopLogicDialogProps } from './components/dialog.ts';
+export type { ChopLogicFormContextProps, ChopLogicFormData, ChopLogicFormInputParams, ChopLogicFormProps, ChopLogicFormValidationState, } from './components/form.ts';
+export type { ChopLogicGridColumn, ChopLogicGridItem, ChopLogicGridProps, RenderDataItemCallback } from './components/grid.ts';
+export type { ChopLogicIconProps } from './components/icon.ts';
+export type { ChopLogicMultiSelectProps } from './components/multi-select.ts';
+export type { ChopLogicNumericInputProps } from './components/numeric.ts';
+export type { ChopLogicSelectProps } from './components/select.ts';
+export type { ChopLogicTabItem, ChopLogicTabsProps } from './components/tabs.ts';
+export type { ChopLogicTextInputProps } from './components/text.ts';
+export type { ChopLogicTooltipProps } from './components/tooltip.ts';

package/dist/utils/get-chop-logic-theme.d.ts

@@ -1,3 +1,3 @@
-import { ChopLogicTheme } from '../types';
+import { ChopLogicTheme } from '../models';
 
 export declare function getChopLogicTheme(mode?: 'dark' | 'light', customTheme?: Partial<ChopLogicTheme>): ChopLogicTheme;

package/dist/utils/handle-dropdown-list-key-press.d.ts

@@ -1,8 +1,8 @@
 import { KeyboardEvent } from 'react';
-import { SelectValue } from '../types';
+import { ChopLogicSelectValue } from '../models';
 
 export declare function handleDropdownListKeyPress({ e, options, onClose, }: {
     e: KeyboardEvent<HTMLUListElement>;
-    options: SelectValue[];
+    options: ChopLogicSelectValue[];
     onClose: () => void;
 }): void;

package/package.json

@@ -4,7 +4,7 @@
     "type": "git",
     "url": "git+https://github.com/SavouryGin/chop-logic-components.git"
   },
-  "version": "1.1.2",
+  "version": "1.1.4",
   "description": "React UI components library for Chop Logic project",
   "type": "module",
   "main": "dist/index.cjs.js",

package/dist/hooks/use-click-outside/__docs__/Example.d.ts

@@ -1,2 +0,0 @@
-declare const Example: () => import("react/jsx-runtime").JSX.Element;
-export default Example;

package/dist/hooks/use-container-dimensions/__docs__/Example.d.ts

@@ -1,2 +0,0 @@
-declare const Example: () => import("react/jsx-runtime").JSX.Element;
-export default Example;

package/dist/hooks/use-key-press/__docs__/Example.d.ts

@@ -1,2 +0,0 @@
-declare const Example: () => import("react/jsx-runtime").JSX.Element;
-export default Example;

package/dist/hooks/use-modal-focus-trap/__docs__/Example.d.ts

@@ -1,2 +0,0 @@
-declare const Example: () => import("react/jsx-runtime").JSX.Element;
-export default Example;

package/dist/hooks/use-mount/__docs__/Example.d.ts

@@ -1,2 +0,0 @@
-declare const Example: () => import("react/jsx-runtime").JSX.Element;
-export default Example;

package/dist/hooks/use-tooltip-position/__docs__/Example.d.ts

@@ -1,2 +0,0 @@
-declare const Example: () => import("react/jsx-runtime").JSX.Element;
-export default Example;

package/dist/hooks/use-window-dimensions/__docs__/Example.d.ts

@@ -1,2 +0,0 @@
-declare const Example: () => import("react/jsx-runtime").JSX.Element;
-export default Example;

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

@@ -1,15 +0,0 @@
-import { CSSProperties } from 'react';
-
-export type CommonInputProps = CommonComponentProps & {
-    label: string;
-    name: string;
-    disabled?: boolean;
-    required?: boolean;
-};
-export type CommonComponentProps = {
-    id?: string;
-    className?: string;
-    style?: CSSProperties;
-    tabIndex?: number;
-    title?: string;
-};

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

@@ -1,18 +0,0 @@
-import { ChopLogicAlertMode, ChopLogicIconName } from '../../enums';
-import { ChopLogicTheme } from '..';
-import { CommonComponentProps } from './_common';
-
-export type ChopLogicAlertProps = CommonComponentProps & {
-    isOpened: boolean;
-    onClose: () => void;
-    message: string;
-    mode?: ChopLogicAlertMode;
-    icon?: ChopLogicIconName;
-};
-export type ChopLogicAlertHeaderProps = {
-    onClose: () => void;
-    theme: ChopLogicTheme;
-    mode: ChopLogicAlertMode;
-    title?: string;
-    icon?: ChopLogicIconName;
-};

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

@@ -1,15 +0,0 @@
-import { HTMLAttributes, PropsWithChildren } from 'react';
-import { ChopLogicTheme } from '..';
-import { CommonComponentProps } from './_common';
-
-export type ChopLogicDialogProps = CommonComponentProps & PropsWithChildren & {
-    isOpened: boolean;
-    onClose: () => void;
-    title: string;
-};
-export type DialogLayoutProps = PropsWithChildren & HTMLAttributes<HTMLDivElement> & {
-    title: string;
-    onClose: () => void;
-    isOpened: boolean;
-    theme: ChopLogicTheme;
-};

package/dist/types/components/multi-select.d.ts

@@ -1,38 +0,0 @@
-import { ChopLogicTheme } from '..';
-import { CommonInputProps } from './_common';
-import { SelectValue } from './select';
-
-export type MultiSelectValue = SelectValue & {
-    selected: boolean;
-};
-export type ChopLogicMultiSelectProps = CommonInputProps & {
-    options: SelectValue[];
-    onChange?: (values?: SelectValue[]) => void;
-    defaultValue?: string | number | readonly string[];
-    placeholder?: string;
-};
-export type MultiSelectDropdownProps = {
-    options: MultiSelectValue[];
-    opened: boolean;
-    dropdownId: string;
-    onClose: () => void;
-    onSelect: (id: string) => void;
-    theme: ChopLogicTheme;
-};
-export type MultiSelectComboboxProps = {
-    opened: boolean;
-    disabled: boolean;
-    required: boolean;
-    onClick: () => void;
-    comboboxId: string;
-    dropdownId: string;
-    values?: MultiSelectValue[];
-    placeholder?: string;
-    name: string;
-    theme: ChopLogicTheme;
-};
-export type MultiSelectOptionProps = {
-    value: MultiSelectValue;
-    onSelect: (id: string) => void;
-    theme: ChopLogicTheme;
-};

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

@@ -1,45 +0,0 @@
-import { ChopLogicTheme } from '..';
-import { CommonInputProps } from './_common';
-
-export type SelectValue = {
-    id: string;
-    label: string;
-} & {
-    [key in string]: unknown;
-};
-export type ChopLogicSelectProps = CommonInputProps & {
-    options: SelectValue[];
-    onChange?: (value?: SelectValue) => void;
-    placeholder?: string;
-    defaultValue?: string | number | readonly string[];
-};
-export type SelectOptionProps = {
-    value: SelectValue;
-    selected: boolean;
-    onSelect: (id: string) => void;
-    onClear: () => void;
-    theme: ChopLogicTheme;
-};
-export type SelectComboboxProps = {
-    opened: boolean;
-    disabled: boolean;
-    required: boolean;
-    onClick: () => void;
-    comboboxId: string;
-    dropdownId: string;
-    selected?: SelectValue;
-    placeholder?: string;
-    name: string;
-    theme: ChopLogicTheme;
-};
-export type SelectDropdownProps = {
-    options: SelectValue[];
-    opened: boolean;
-    dropdownId: string;
-    comboboxId: string;
-    onClose: () => void;
-    selected?: SelectValue;
-    onSelect: (id: string) => void;
-    onClear: () => void;
-    theme: ChopLogicTheme;
-};

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

@@ -1,25 +0,0 @@
-import { ReactElement } from 'react';
-import { ChopLogicTheme } from '..';
-import { CommonComponentProps } from './_common';
-
-export type ChopLogicTabsProps = CommonComponentProps & {
-    tabs: ChopLogicTabItem[];
-    defaultTabId?: string;
-    mode?: ChopLogicTabsMode;
-};
-export type ChopLogicTabListProps = {
-    tabs: ChopLogicTabItem[];
-    tabIds: string[];
-    onTabSelect: (id: string) => void;
-    selectedTabId: string;
-    tabPanelIds: string[];
-    mode: ChopLogicTabsMode;
-    theme: ChopLogicTheme;
-};
-export type ChopLogicTabItem = {
-    content: ReactElement;
-    title: string;
-    id: string;
-    disabled?: boolean;
-};
-export type ChopLogicTabsMode = 'vertical' | 'horizontal';

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

@@ -1,9 +0,0 @@
-import { PropsWithChildren, ReactElement } from 'react';
-import { CommonComponentProps } from './_common';
-
-export type ChopLogicTooltipProps = PropsWithChildren & CommonComponentProps & {
-    tooltipContent: string | ReactElement;
-    containerTag?: TooltipContainerTag;
-    visibleOn?: 'hover' | 'click' | 'focus' | 'contextmenu';
-};
-export type TooltipContainerTag = 'span' | 'div' | 'p' | 'strong' | 'em';

package/dist/types/index.d.ts

@@ -1,13 +0,0 @@
-export type { ChopLogicTheme } from './chop-logic-theme.ts';
-export * from './components/alert.ts';
-export * from './components/button.ts';
-export * from './components/checkbox.ts';
-export * from './components/dialog.ts';
-export * from './components/form.ts';
-export * from './components/grid.ts';
-export * from './components/multi-select.ts';
-export * from './components/numeric.ts';
-export * from './components/select.ts';
-export * from './components/tabs.ts';
-export * from './components/text.ts';
-export * from './components/tooltip.ts';