beesoft-components 0.2.25 → 0.2.26-1

package/build/types/src/components/common-functions.d.ts

@@ -1,3 +1,4 @@
+import { IToString } from './common-interfaces';
 export declare function getElementByClassNameRecursive(element: Element, className: string): Element;
 export declare function getBrowserLanguage(): string;
 export declare function padNumber(value: number, padCount: number, padCharacter: string): string;
@@ -10,3 +11,6 @@ export declare function elementHasAnyStyle(element: HTMLElement, styles: Record<
 export declare function getElementByCssStylesRecursive(element: HTMLElement, styles: Record<string, string | number>, matchAllStyles?: boolean): any;
 export declare function getAllElementStyleValuesRecursive(element: HTMLElement, style: string, action: (styleValue: string) => boolean, currentValues?: Array<string>): Array<string>;
 export declare function getAllElementStyleValues(style: string, action: (styleValue: string) => boolean): string[];
+export declare function isObject(object: unknown): object is Record<string, never>;
+export declare function isPrimitive(item: unknown): item is string | number | Date | boolean | bigint;
+export declare function containsToString(object: unknown): object is IToString;

package/build/types/src/components/common-interfaces.d.ts

@@ -5,3 +5,9 @@ export interface WindowSize {
     width: number;
     height: number;
 }
+export interface IToString {
+    toString(): string;
+}
+export interface IDisposable {
+    dispose: () => void;
+}

package/build/types/src/components/form/date-time/date-time-functions.d.ts

@@ -14,6 +14,7 @@ export declare function getTranslatedYearMatrix(matrixDate: Date, locale: Locale
 export declare function getDefaultTime(locale: Locale): string;
 export declare function isDateBetween(checkDate: Date, startComparisonDate: Date, endComparisonDate: Date): boolean;
 export declare function loadLocale(localeToLoad: string): Promise<Locale>;
+export declare function getDateFormatByLocale(locale: string): string;
 export declare function createDefaultColors(): DateTimeColors;
 export declare function parseDate(dateValue: string, locale?: Locale): Date | undefined;
 export declare function parseDateRange(dateRangeValue: string, locale?: Locale): Date[] | undefined;

package/build/types/src/components/form/date-time/date-time.component.d.ts

@@ -1,16 +1,14 @@
 import React from 'react';
 import { TemplateFunction } from '../../common/template-outlet/template-outlet.component';
+import { FormInputControl } from '../form-control.interface';
 import { DateTimeCalendarTemplate } from './date-time-calendar.component';
 import { DateTimeScrollerTemplate } from './date-time-scroller.component';
 import { CalendarIconPosition, DateFormatType, DateSelectionType, DateTimeColors, TimeConstraints } from './date-time-types';
-export interface DateTimeProps {
-    value?: string | Date | Array<Date>;
-    readOnly?: boolean;
-    label?: string;
+export interface DateTimeProps extends FormInputControl<string | Date | Array<Date>, Date | Array<Date>> {
     useDefaultDateValue?: boolean;
+    useFormattedInput?: boolean;
     allowClear?: boolean;
     locale?: string;
-    className?: string;
     dateSelection?: DateSelectionType;
     dateFormat?: DateFormatType;
     timeConstraints?: TimeConstraints;
@@ -20,7 +18,6 @@ export interface DateTimeProps {
     colors?: DateTimeColors;
     selectableDate?: (currentDate: Date) => boolean;
     isValidDate?: (selectedDate: Date) => boolean;
-    onChange?: (value?: Date | Array<Date>) => void;
     calendarTemplate?: DateTimeCalendarTemplate;
     dateScrollerTemplate?: DateTimeScrollerTemplate;
     inputTemplate?: DateTimeInputTemplate;
@@ -30,10 +27,10 @@ export interface DateTimeInputTemplateProps {
     readOnly: boolean;
     allowClear: boolean;
     getValue: () => string;
-    onFocus: (event: React.FocusEvent) => void;
+    onFocus: (event: FocusEvent) => void;
     onInput: (event: React.FormEvent) => void;
     iconPosition: CalendarIconPosition;
     iconElement?: JSX.Element;
 }
 export type DateTimeInputTemplate = TemplateFunction<DateTimeInputTemplateProps>;
-export default function DateTime({ value, readOnly, label, useDefaultDateValue, allowClear, locale, className, dateSelection, dateFormat, timeConstraints, icon, iconPosition, inputElement, colors, selectableDate, isValidDate, onChange, calendarTemplate, dateScrollerTemplate, inputTemplate, }: DateTimeProps): JSX.Element;
+export default function DateTime({ value, readOnly, label, useDefaultDateValue, useFormattedInput, allowClear, locale, className, dateSelection, dateFormat, timeConstraints, icon, iconPosition, inputElement, colors, selectableDate, isValidDate, onChange, calendarTemplate, dateScrollerTemplate, inputTemplate, }: DateTimeProps): JSX.Element;

package/build/types/src/components/form/date-time/date-time.reducer.d.ts

@@ -1,3 +1,4 @@
+import { FormattedInputDefaultFormats } from '../input/formatted-input/formats/input-format.enums';
 export declare enum DateTimeActionType {
     DaySelector = 0,
     MonthSelector = 1,
@@ -9,8 +10,9 @@ export declare enum DateTimeActionType {
     SetSelectedDateRange = 7,
     SetSelectedStartDate = 8,
     SetSelectedEndDate = 9,
-    ClearDates = 10,
-    InitializeDates = 11
+    SetInputFormat = 10,
+    ClearDates = 11,
+    InitializeDates = 12
 }
 export interface DateTimeState {
     currentSelector: DateTimeActionType;
@@ -19,6 +21,7 @@ export interface DateTimeState {
     selectedStartDate?: Date;
     selectedEndDate?: Date;
     dateInitialized: boolean;
+    inputFormat?: FormattedInputDefaultFormats;
 }
 export interface DateTimeReducerAction {
     type: DateTimeActionType;
@@ -27,6 +30,7 @@ export interface DateTimeReducerAction {
     selectedStartDate?: Date;
     selectedEndDate?: Date;
     initialDate?: Date | Array<Date>;
+    inputFormat?: FormattedInputDefaultFormats;
 }
 declare const reducer: (state: DateTimeState, action: DateTimeReducerAction) => DateTimeState;
 export default reducer;

package/build/types/src/components/form/form-control.interface.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export interface FormInputControl<V = unknown, C = undefined> {
+    label?: string;
+    value?: V;
+    readOnly?: boolean;
+    placeholder?: string;
+    onFocus?: (event: FocusEvent) => void;
+    onBlur?: (event: FocusEvent) => void;
+    onInput?: (event: React.FormEvent) => void;
+    onChange?: (value?: C extends undefined ? V : C) => void;
+    className?: string;
+}

package/build/types/src/components/form/{content-editable-input → input/content-editable-input}/content-editable-input.component.d.ts

@@ -1,25 +1,25 @@
 import React from 'react';
-export interface ContentEditableInputProps {
-    value?: string;
-    readOnly?: boolean;
+import { FormInputControl } from '../../form-control.interface';
+export interface ContentEditableInputProps extends FormInputControl<string> {
     debounceTime?: number;
     fillContainer?: boolean;
     leftElement?: JSX.Element;
     rightElement?: JSX.Element;
-    className?: string;
     leftElementClassName?: string;
     rightElementClassName?: string;
     isSingleLine?: boolean;
     allowSingleLineScroll?: boolean;
-    onFocus?: (event: React.FocusEvent) => void;
-    onBlur?: (event: React.FocusEvent) => void;
-    onInput?: (event: React.FormEvent) => void;
+    onInnerTextChange?: (value: string) => void;
+    onInnerHTMLChange?: (value: string) => void;
     onElementCreate?: (element: HTMLElement) => void;
     onLeftElementClick?: (event: React.MouseEvent) => void;
     onRightElementClick?: (event: React.MouseEvent) => void;
 }
 export interface ContentEditableInputRef {
+    inputElement?: HTMLElement;
+    setInnerText: (innerText: string) => void;
+    setInnerHTML: (innerHTML: string) => void;
     focus: () => void;
 }
-declare const _default: React.ForwardRefExoticComponent<ContentEditableInputProps & React.RefAttributes<ContentEditableInputRef>>;
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<ContentEditableInputProps & React.RefAttributes<ContentEditableInputRef>>>;
 export default _default;

package/build/types/src/components/form/input/formatted-input/formats/date/day-month-year/format.d.ts

@@ -0,0 +1,3 @@
+import { InputFormat } from '../../input-format.interfaces';
+declare const format: InputFormat;
+export default format;

package/build/types/src/components/form/input/formatted-input/formats/date/month-day-year/format.d.ts

@@ -0,0 +1,3 @@
+import { InputFormat } from '../../input-format.interfaces';
+declare const format: InputFormat;
+export default format;

package/build/types/src/components/form/input/formatted-input/formats/date/year-month-day/format.d.ts

@@ -0,0 +1,3 @@
+import { InputFormat } from '../../input-format.interfaces';
+declare const format: InputFormat;
+export default format;

package/build/types/src/components/form/input/formatted-input/formats/date-range/day-month-year/format.d.ts

@@ -0,0 +1,3 @@
+import { InputFormat } from '../../input-format.interfaces';
+declare const format: InputFormat;
+export default format;

package/build/types/src/components/form/input/formatted-input/formats/date-range/month-day-year/format.d.ts

@@ -0,0 +1,3 @@
+import { InputFormat } from '../../input-format.interfaces';
+declare const format: InputFormat;
+export default format;

package/build/types/src/components/form/input/formatted-input/formats/date-range/year-month-day/format.d.ts

@@ -0,0 +1,3 @@
+import { InputFormat } from '../../input-format.interfaces';
+declare const format: InputFormat;
+export default format;

package/build/types/src/components/form/input/formatted-input/formats/index.d.ts

@@ -0,0 +1,9 @@
+import DayMonthYearFormat from './date/day-month-year/format';
+import MonthDayYearFormat from './date/month-day-year/format';
+import YearMonthDayFormat from './date/year-month-day/format';
+import DayMonthYearRangeFormat from './date-range/day-month-year/format';
+import MonthDayYearRangeFormat from './date-range/month-day-year/format';
+import YearMonthDayRangeFormat from './date-range/year-month-day/format';
+import TwelveHourFormat from './time/12-hour/format';
+import TwentyFourHourFormat from './time/24-hour/format';
+export { DayMonthYearFormat, MonthDayYearFormat, YearMonthDayFormat, DayMonthYearRangeFormat, MonthDayYearRangeFormat, YearMonthDayRangeFormat, TwelveHourFormat, TwentyFourHourFormat, };

package/build/types/src/components/form/input/formatted-input/formats/input-format.enums.d.ts

@@ -0,0 +1,11 @@
+export declare enum FormattedInputDefaultFormats {
+    DateDayMonthYear = 0,
+    DateMonthDayYear = 1,
+    DateYearMonthDay = 2,
+    DateRangeDayMonthYear = 3,
+    DateRangeMonthDayYear = 4,
+    DateRangeYearMonthDay = 5,
+    Time12Hour = 6,
+    Time24Hour = 7,
+    Custom = 8
+}

package/build/types/src/components/form/input/formatted-input/formats/input-format.interfaces.d.ts

@@ -0,0 +1,23 @@
+export declare enum FormatValueType {
+    Text = 0,
+    Numeric = 1
+}
+export interface FormatPart {
+    characterCount: number;
+    placeholder?: string;
+    inputText?: string;
+    isSeparator: boolean;
+    allCharactersRequired?: boolean;
+    possibleValues?: Array<string>;
+    valueType?: FormatValueType;
+    minimumValue?: number;
+    maximumValue?: number;
+    exceedingMaximumValueCausesError?: boolean;
+    exceedingMaximumValueCausesTab?: boolean;
+    padWithZeros?: boolean;
+    addInOutputValue?: boolean;
+}
+export interface InputFormat {
+    deleteShiftsFormatPart?: boolean;
+    formatParts: Array<FormatPart>;
+}

package/build/types/src/components/form/input/formatted-input/formats/time/12-hour/format.d.ts

@@ -0,0 +1,3 @@
+import { InputFormat } from '../../input-format.interfaces';
+declare const format: InputFormat;
+export default format;

package/build/types/src/components/form/input/formatted-input/formats/time/24-hour/format.d.ts

@@ -0,0 +1,3 @@
+import { InputFormat } from '../../input-format.interfaces';
+declare const format: InputFormat;
+export default format;

package/build/types/src/components/form/input/formatted-input/formatted-input.component.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { ContentEditableInputProps } from '../content-editable-input/content-editable-input.component';
+import { FormattedInputDefaultFormats } from './formats/input-format.enums';
+import { InputFormat } from './formats/input-format.interfaces';
+export interface FormattedInputProps extends Omit<ContentEditableInputProps, 'placeholder'> {
+    format?: InputFormat;
+    defaultFormat: FormattedInputDefaultFormats;
+}
+export interface FormattedInputRef {
+    focus: () => void;
+}
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<FormattedInputProps & React.RefAttributes<FormattedInputRef>>>;
+export default _default;

package/build/types/src/components/form/input/formatted-input/parser/format-navigator.d.ts

@@ -0,0 +1,31 @@
+import { InputFormat } from '../formats/input-format.interfaces';
+export declare class FormatNavigator {
+    private static _instance;
+    private readonly formatPartList;
+    private readonly inputSlotCollection;
+    private currentPartIndex;
+    private currentCursorPosition;
+    private inputElement?;
+    private inputSelection;
+    private inputRange?;
+    private textNode?;
+    private constructor();
+    static getInstance(format: InputFormat): FormatNavigator;
+    getCursorPosition(): number;
+    getCurrentPartIndex(): number;
+    setInputElement(element: HTMLElement): void;
+    setCursorToCurrentPosition(): void;
+    setCursorPosition(position: number): void;
+    setCursorSelection(start: number, end?: number): void;
+    isAtLastPart(): boolean;
+    moveHome(): void;
+    moveEnd(): void;
+    moveCursorLeft(): void;
+    moveCursorRight(): void;
+    moveToNextInputPart(): void;
+    moveToPreviousInputPart(): void;
+    private findNextEditablePart;
+    private findPreviousEditablePart;
+    private setPartIndexByCursorPosition;
+    private createInputRangeSelection;
+}

package/build/types/src/components/form/input/formatted-input/parser/format-parser.d.ts

@@ -0,0 +1,19 @@
+import { InputFormat } from '../formats/input-format.interfaces';
+import { FormatCompleteEvent } from './parser.interfaces';
+export declare class FormatParser {
+    private inputValue;
+    private readonly keyProcessor;
+    private readonly formatNavigator;
+    private readonly formatRenderer;
+    private readonly inputSlotCollection;
+    private readonly inputRuleProcessor;
+    private inputElementSet;
+    private inputElement?;
+    private onFormatComplete?;
+    constructor(format: InputFormat, inputValue?: string);
+    inputElementCreated(element: HTMLElement): void;
+    inputFocused(): void;
+    inputValuePassed(inputValue: string): void;
+    registerFormatCompleteEvent(onFormatComplete: FormatCompleteEvent): void;
+    keyDownHandler(event: KeyboardEvent): void;
+}

package/build/types/src/components/form/input/formatted-input/parser/format-renderer.d.ts

@@ -0,0 +1,9 @@
+import { InputFormat } from '../formats/input-format.interfaces';
+export declare class FormatRenderer {
+    private readonly formatPartList;
+    private readonly inputSlotCollection;
+    private inputElement?;
+    constructor(format: InputFormat);
+    setInputElement(element: HTMLElement): void;
+    render(): void;
+}

package/build/types/src/components/form/input/formatted-input/parser/input-rule-processor.d.ts

@@ -0,0 +1,19 @@
+import { InputFormat } from '../formats/input-format.interfaces';
+export declare class InputRuleProcessor {
+    private format;
+    private readonly inputSlotCollection;
+    private readonly formatNavigator;
+    private readonly keyTypeChecker;
+    private readonly formatRenderer;
+    private readonly formatPartList;
+    constructor(format: InputFormat);
+    setInputElement(element: HTMLElement): void;
+    processKeyPress(event: KeyboardEvent): void;
+    processInputValue(value: string): void;
+    private processEditRules;
+    private shiftFormatParts;
+    private processInputRules;
+    private addToInputSlot;
+    private createNewValue;
+    private processSlotRules;
+}

package/build/types/src/components/form/input/formatted-input/parser/input-slot-collection.d.ts

@@ -0,0 +1,15 @@
+import { InputFormat } from '../formats/input-format.interfaces';
+import { FormatPartSlot } from './parser.interfaces';
+export declare class InputSlotCollection {
+    private static instance;
+    private readonly inputSlots;
+    private constructor();
+    static getInstance(format: InputFormat): InputSlotCollection;
+    clearAllSlots(): void;
+    getSlot(partIndex: number): FormatPartSlot | undefined;
+    getFirstSlot(): FormatPartSlot;
+    getNextSlot(currentPartIndex: number): FormatPartSlot | undefined;
+    getPreviousSlot(currentPartIndex: number): FormatPartSlot | undefined;
+    getLastSlotWithData(): FormatPartSlot;
+    allSlotsCompleted(): boolean;
+}

package/build/types/src/components/form/input/formatted-input/parser/input-slot-creator.d.ts

@@ -0,0 +1,4 @@
+import { FormatPartEntry, FormatPartSlot } from './parser.interfaces';
+export declare class InputSlotCreator {
+    static create(formatPartEntries: FormatPartEntry[]): FormatPartSlot[];
+}

package/build/types/src/components/form/input/formatted-input/parser/key-processor.d.ts

@@ -0,0 +1,13 @@
+import { InputFormat } from '../formats/input-format.interfaces';
+import { MovementKeyboardEvent } from './parser.interfaces';
+export declare class KeyProcessor {
+    private format;
+    private readonly formatNavigator;
+    private readonly ruleProcessor;
+    private readonly keyTypeChecker;
+    private readonly formatRenderer;
+    constructor(format: InputFormat);
+    setInputElement(element: HTMLElement): void;
+    processMovementKey(event: MovementKeyboardEvent): void;
+    processKeyPress(event: KeyboardEvent): boolean;
+}

package/build/types/src/components/form/input/formatted-input/parser/key-type-checker.d.ts

@@ -0,0 +1,11 @@
+import { EditingKeyboardEvent, MovementKeyboardEvent } from './parser.interfaces';
+export declare class KeyTypeChecker {
+    private numberKeys;
+    private movementKeys;
+    private editingKeys;
+    private ignoreKeys;
+    isNumberKey(key: string): boolean;
+    isMovementKey(event: KeyboardEvent): event is MovementKeyboardEvent;
+    isEditingKey(event: KeyboardEvent): event is EditingKeyboardEvent;
+    isIgnoreKey(event: KeyboardEvent): boolean;
+}

package/build/types/src/components/form/input/formatted-input/parser/parser.interfaces.d.ts

@@ -0,0 +1,24 @@
+import { FormatPart } from '../formats/input-format.interfaces';
+export interface FormatPartEntry extends FormatPart {
+    startPosition: number;
+    endPosition: number;
+}
+export interface FormatPartSlot extends FormatPartEntry {
+    partIndex: number;
+    partText: string;
+    isComplete: boolean;
+}
+export interface KeyPressValidationResult {
+    isValid: boolean;
+    isMovement: boolean;
+    key: string;
+    isShiftKey: boolean;
+    newCursorLocation: number;
+}
+export interface EditingKeyboardEvent extends Omit<KeyboardEvent, 'key'> {
+    key: 'Backspace' | 'Delete';
+}
+export interface MovementKeyboardEvent extends Omit<KeyboardEvent, 'key'> {
+    key: 'ArrowLeft' | 'ArrowRight' | 'Home' | 'End';
+}
+export type FormatCompleteEvent = (value: string) => void;

package/build/types/src/components/form/input/formatted-input/parser/part-entry-creator.d.ts

@@ -0,0 +1,5 @@
+import { InputFormat } from '../formats/input-format.interfaces';
+import { FormatPartEntry } from './parser.interfaces';
+export declare class PartEntryCreator {
+    static create(format: InputFormat): FormatPartEntry[];
+}

package/build/types/src/components/form/input/formatted-input/parser/part-entry-iterator.d.ts

@@ -0,0 +1,14 @@
+import { IIterator } from '../../../../../interfaces/iterator.interface';
+import { InputFormat } from '../formats/input-format.interfaces';
+import { FormatPartEntry } from './parser.interfaces';
+export declare class PartEntryIterator implements IIterator<FormatPartEntry> {
+    private _currentIndex;
+    private index;
+    private readonly formatParts;
+    get currentIndex(): number;
+    constructor(format: InputFormat);
+    hasNext(): boolean;
+    next(): FormatPartEntry | undefined;
+    peek(): FormatPartEntry | undefined;
+    reset(): void;
+}

package/build/types/src/index.d.ts

@@ -1,5 +1,9 @@
 import DateTime from './components/form/date-time/date-time.component';
 import OverlayPanel from './components/overlay/overlay-panel/overlay-panel.component';
+import { DateTimeInputTemplateProps } from './components/form/date-time/date-time.component';
+import { DateTimeScrollerTemplateProps } from './components/form/date-time/date-time-scroller.component';
+import { DateTimeCalendarTemplateProps } from './components/form/date-time/date-time-calendar.component';
 import './index.css';
 import '../src/components/font-awesome';
 export { DateTime, OverlayPanel };
+export type { DateTimeInputTemplateProps, DateTimeScrollerTemplateProps, DateTimeCalendarTemplateProps };

package/build/types/src/interfaces/iterator.interface.d.ts

@@ -0,0 +1,7 @@
+export interface IIterator<T> {
+    currentIndex: number;
+    next(): T | undefined;
+    peek(): T | undefined;
+    reset(): void;
+    hasNext(): boolean;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "beesoft-components",
-  "version": "0.2.25",
+  "version": "0.2.26-1",
   "private": false,
   "author": "Brandon Trabon",
   "keywords": [
@@ -16,10 +16,13 @@
     "build",
     "types"
   ],
+  "publishConfig": {
+    "registry": "https://registry.yarnpkg.com/"
+  },
   "license": "MIT",
   "main": "build/index.cjs.js",
   "module": "build/index.min.js",
-  "types": "types/src/index.d.ts",
+  "types": "build/types/src/index.d.ts",
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^6.4.0",
     "@fortawesome/free-regular-svg-icons": "^6.4.0",