nexus-shared 1.1.21 → 2.0.0

package/src/components/inputs/input.tsx

@@ -1,181 +0,0 @@
-import { CreateClone } from "../../helpers/datasource-helpers";
-import { GetInputClasses, GetInputId, GetParentKey } from "../../helpers/input-helpers";
-import { IsNullOrEmpty } from "../../helpers/string-helpers";
-import { Debounce } from "../../helpers/utility-helpers";
-import { DEFAULT_TEXTAREA_ROWS, EInputTypes, ICheckbox, IElement, IInputCreateResults, IInputRootParameters, ILinkbutton, INumber, IRadiobox, ISlider, ISubmitbutton, ITextarea, ITextbox, MAX_INPUT_TYPE, OnFormChangeHandler, REQUIRED_TEXT1 } from "../../interfaces/input-interfaces";
-import { UN } from "../../interfaces/type-interfaces";
-import { CreateCheckbox } from "./checkbox-input";
-import { CreateElement, CreateInputButton, CreateInputLink } from "./input-element";
-import { CreateNumber } from "./number-input";
-import { CreateRadiobox } from "./radiobox-input";
-import { CreateTextarea } from "./textarea-input";
-import { CreateTextbox } from "./textbox-input";
-
-const _getInputType = (inputType: EInputTypes) => {
-  switch (inputType) {
-    case EInputTypes.Checkbox:
-      return "checkbox";
-    case EInputTypes.Textarea:
-      return "textarea";
-    case EInputTypes.Number:
-      return "number";
-    case EInputTypes.Slider:
-    case EInputTypes.Range:
-      return "range";
-    default:
-      return "text";
-  }
-};
-
-export function CreateInput(param: ITextbox | ISlider | ICheckbox | ITextarea | INumber) {
-  const isTextarea = param.inputType === EInputTypes.Textarea;
-  const isNumber = param.inputType === EInputTypes.Number;
-  const isSlider = param.inputType === EInputTypes.Slider || param.inputType === EInputTypes.Range;
-  const isCheckbox = param.inputType === EInputTypes.Checkbox;
-  const isRadiobox = param.inputType === EInputTypes.Radiobox;
-
-  const inputType = _getInputType(param.inputType);
-  const input = document.createElement(isTextarea ? "textarea" : "input");
-  if (!isTextarea) (input as HTMLInputElement).type = inputType;
-  if (isCheckbox || isRadiobox) {
-    if ((param as ICheckbox).groupId) (input as HTMLInputElement).name = (param as ICheckbox).groupId!;
-    else if (isRadiobox) (input as HTMLInputElement).name = GetInputId(param as IRadiobox);
-
-    // No need to set type
-  } else if (isTextarea) (input as HTMLTextAreaElement).rows = (param as ITextarea).rows ?? DEFAULT_TEXTAREA_ROWS;
-  else if (isNumber) {
-    const numberParam = param as INumber;
-    const numberInput = input as HTMLInputElement;
-    const decimalPlaces = numberParam.floatingPoint ?? 0;
-    numberInput.type = "number";
-
-    if (numberParam.step) numberInput.step = numberParam.step.toString();
-    else numberInput.step = decimalPlaces > 0 ? (1 / Math.pow(10, decimalPlaces)).toString() : "1";
-
-    if (numberParam.minLength !== undefined && numberParam.minLength !== null) numberInput.min = numberParam.minLength.toString();
-    if (numberParam.maxLength !== undefined && numberParam.maxLength !== null) numberInput.max = numberParam.maxLength.toString();
-  } else if (isSlider) {
-    (input as HTMLInputElement).type = "range";
-    (input as HTMLInputElement).step = (param as ISlider).step?.toString() ?? "1";
-    (input as HTMLInputElement).min = (param as ISlider).minLength?.toString() ?? "0";
-    (input as HTMLInputElement).max = (param as ISlider).maxLength?.toString() ?? "100";
-  } else (input as HTMLInputElement).type = (param as ITextbox).isPassword ? "password" : "text";
-  if (!isSlider && !isNumber) {
-    if ((param as ITextbox).minLength) (input as HTMLInputElement).minLength = (param as ITextbox).minLength ?? 0;
-    if ((param as ITextbox).maxLength) (input as HTMLInputElement).maxLength = (param as ITextbox).maxLength ?? 0;
-  }
-
-  input.className = `${GetInputClasses(param.inputSize, param.defaultClass)}${isTextarea ? " sb" : ""}`;
-  input.autocomplete = param.autoComplete ?? "on";
-  input.required = !!param.isRequired;
-  input.readOnly = !!param.isReadonly;
-  input.disabled = !!param.isReadonly;
-  input.id = param.id;
-  input.placeholder = param.placeholder ?? "";
-  input.value = param.defaultValue?.toString() ?? "";
-
-  return input;
-}
-export const CreateInputs = (inputs: IInputRootParameters<any>[], onChanged: OnFormChangeHandler, index: number, isTabularForm: boolean, parentElement: HTMLElement | null, defaultValue?: any): IInputCreateResults[] => {
-  if (inputs.length === 0 || !onChanged) {
-    //TODO: WarningMessage("Invalid Inputs", "Please provide valid inputs, onChanged function and parent element.");
-    return [];
-  }
-  const inputValues: any = {};
-  const onChangedDebounced = Debounce(onChanged, 10);
-
-  const results: IInputCreateResults[] = [];
-  const pushResult = (result: IInputCreateResults) => results.push(result);
-  const handleInputChange = (currentValue: any, isInitilizing: boolean, isForcedChanged: boolean, isDisposed: boolean, currentKey: string, dataSource?: any[]) => {
-    if (inputValues[currentKey] === currentValue && !isForcedChanged && !isDisposed) return;
-
-    inputValues[currentKey] = currentValue;
-    (isInitilizing && !isTabularForm ? onChangedDebounced : onChanged)(inputValues, isInitilizing, isForcedChanged, isDisposed, currentKey, index, undefined, dataSource);
-    const result = results.find((x) => GetInputId(x.input) === currentKey);
-    if (result) {
-      const timeout = setTimeout(() => {
-        clearTimeout(timeout);
-        const children = results.filter((x) => GetParentKey(x.input.parentKey) === currentKey);
-        for (const child of children) {
-          child.input.defaultValue = inputValues[child.input.id];
-          child.onParentChanged?.(currentValue, isInitilizing, isForcedChanged, isDisposed, currentKey, index, undefined, dataSource);
-        }
-      }, 1);
-    }
-  };
-  const udpatedInputs = (CreateClone(inputs) as IInputRootParameters<any>[]).sort((a, b) => a.displayOrder - b.displayOrder);
-  for (const ipt of udpatedInputs) {
-    const ELEMENT_ID = GetInputId(ipt);
-    ipt.defaultValue = defaultValue?.[ELEMENT_ID] ?? ipt.defaultValue;
-    if (ipt.inputType < MAX_INPUT_TYPE) {
-      ipt.onChanged = (currentValue: any, isInitilizing: boolean, isForcedChanged: boolean, isDisposed: boolean, currentKey: string, dataSource?: any | any[]) => handleInputChange(currentValue, isInitilizing, isForcedChanged, isDisposed, currentKey, dataSource);
-      if ((ipt as any).isRequired && !IsNullOrEmpty(ipt.placeholder)) ipt.placeholder += ` ${REQUIRED_TEXT1}`;
-    }
-
-    switch (ipt.inputType) {
-      case EInputTypes.Textbox: {
-        pushResult(CreateTextbox(ipt as ITextbox, parentElement, isTabularForm));
-        break;
-      }
-      case EInputTypes.Number: {
-        pushResult(CreateNumber(ipt as INumber, parentElement, isTabularForm));
-        break;
-      }
-      case EInputTypes.Textarea: {
-        pushResult(CreateTextarea(ipt as ITextarea, parentElement, isTabularForm));
-        break;
-      }
-      case EInputTypes.Checkbox: {
-        pushResult(CreateCheckbox(ipt as ICheckbox, parentElement, isTabularForm));
-        break;
-      }
-      case EInputTypes.Radiobox: {
-        pushResult(CreateRadiobox(ipt as IRadiobox, parentElement, isTabularForm));
-        break;
-      }
-      case EInputTypes.LinkButton: {
-        pushResult(CreateInputLink(ipt as ILinkbutton, parentElement, isTabularForm));
-        break;
-      }
-      case EInputTypes.HtmlElement: {
-        pushResult(CreateElement(ipt as IElement, parentElement, isTabularForm));
-        break;
-      }
-      case EInputTypes.SubmitButton: {
-        pushResult(CreateInputButton(ipt as ISubmitbutton, parentElement, isTabularForm));
-        break;
-      }
-      /*
-      case EInputTypes.MultiSelection:
-      case EInputTypes.SingleSelection: {
-        pushResult(CreateSelection(ipt as ISelection, parentElement, isTabularForm));
-        break;
-      }
-
-      case EInputTypes.TabularForm: {
-        pushResult(CreateTabular(ipt as ITablularForm, parentElement));
-        break;
-      }
-
-      case EInputTypes.Datepicker: {
-        pushResult(CreateDatepicker(ipt as IDate, parentElement, isTabularForm));
-        break;
-      }
-      case EInputTypes.Slider:
-      case EInputTypes.Range: {
-        pushResult(CreateSlider(ipt as ISlider, parentElement, isTabularForm));
-        break;
-      }
-     
-
-        */
-      default:
-        break;
-    }
-  }
-  return results;
-};
-export const DisposeInputs = (inputs: IInputCreateResults[] | UN, invokeOnChanged?: boolean) => {
-  if (!inputs || inputs.length === 0) return;
-  for (const input of inputs) input.dispose(invokeOnChanged);
-};

package/src/components/inputs/number-input.tsx

@@ -1,108 +0,0 @@
-import { GetInputId, SetHaveValueClass } from "../../helpers/input-helpers";
-import { IsNullOrEmpty } from "../../helpers/string-helpers";
-import { IInputCreateResults, INumber } from "../../interfaces/input-interfaces";
-import { CreateInput } from "./input";
-import { CreateInputBox, CreateInputWrapper } from "./input-box";
-
-function getDecimalPlaces(param: INumber): number {
-  const fp = param.floatingPoint;
-  if (fp === undefined || fp === null || fp < 0) return 0;
-  return Math.floor(fp);
-}
-
-function roundToDecimalPlaces(value: number, decimalPlaces: number): number {
-  if (decimalPlaces <= 0) return Math.round(value);
-  const factor = Math.pow(10, decimalPlaces);
-  return Math.round(value * factor) / factor;
-}
-
-function parseNumber(raw: string): number | null {
-  const trimmed = raw.trim();
-  if (trimmed === "") return null;
-  const parsed = Number(trimmed);
-  return Number.isFinite(parsed) ? parsed : null;
-}
-
-function adjustValue(value: number, raw: string, param: INumber, decimalPlaces: number, forceClamp = false): number {
-  let result = roundToDecimalPlaces(value, decimalPlaces);
-  if (!param.isAutoAdjust) return result;
-
-  const inputLength = raw.trim().length;
-
-  if (param.minLength !== undefined && param.minLength !== null) {
-    const minLength = String(param.minLength).length;
-    if ((forceClamp || inputLength >= minLength) && result < param.minLength) result = param.minLength;
-  }
-  if (param.maxLength !== undefined && param.maxLength !== null) {
-    const maxLength = String(param.maxLength).length;
-    if ((forceClamp || inputLength >= maxLength) && result > param.maxLength) result = param.maxLength;
-  }
-  return result;
-}
-
-export const CreateNumber = (param: INumber, parentElement: HTMLElement | null, isTabular: boolean = false) => {
-  const ELEMENT_ID = GetInputId(param);
-  const hasPlaceholder = !IsNullOrEmpty(param.placeholder);
-  const decimalPlaces = getDecimalPlaces(param);
-
-  const input = CreateInput(param) as HTMLInputElement;
-  const box = CreateInputBox(param, input, null, isTabular);
-  const wrapper = isTabular ? box : CreateInputWrapper(param, box, parentElement);
-
-  function handleChanged(val: number | undefined | null, isInit: boolean, isForced: boolean, isDisposed: boolean) {
-    param.onChanged?.(val ?? null, isInit, isForced, isDisposed, ELEMENT_ID, undefined);
-    SetHaveValueClass(input, (val !== undefined && val !== null) || hasPlaceholder);
-  }
-
-  function forceChangeDefaultValue(defaultValue: number | null): boolean {
-    if (defaultValue === null || defaultValue === undefined) {
-      input.value = "";
-      handleChanged(null, false, true, false);
-      return true;
-    }
-    const adjusted = adjustValue(defaultValue, defaultValue.toString(), param, decimalPlaces, true);
-    input.value = adjusted.toString();
-    handleChanged(adjusted, false, true, false);
-    return true;
-  }
-
-  function onInputChanged() {
-    if (param.isAutoAdjust) return;
-    const parsed = parseNumber(input.value);
-    handleChanged(parsed, false, false, false);
-  }
-
-  function onBlur() {
-    if (!param.isAutoAdjust) return;
-    const raw = input.value;
-    const parsed = parseNumber(raw);
-    if (parsed === null) {
-      handleChanged(null, false, false, false);
-      return;
-    }
-    const adjusted = adjustValue(parsed, raw, param, decimalPlaces, true);
-    input.value = adjusted.toString();
-    handleChanged(adjusted, false, false, false);
-  }
-
-  if (!param.isAutoAdjust) input.addEventListener("input", onInputChanged);
-  if (param.isAutoAdjust) input.addEventListener("blur", onBlur);
-
-  // Keep initial display as loaded from DB/default — do not round or clamp on init.
-  handleChanged(param.defaultValue ?? null, true, false, false);
-
-  return {
-    input: param,
-    inputElement: input,
-    rootElement: wrapper,
-    forceChangeDefaultValue: forceChangeDefaultValue,
-    dispose: function (invokeOnChanged?: boolean) {
-      if (invokeOnChanged !== false) handleChanged(null, false, true, true);
-      input.removeEventListener("input", onInputChanged);
-      input.removeEventListener("blur", onBlur);
-      input.remove();
-      box.remove();
-      wrapper.remove();
-    },
-  } as IInputCreateResults;
-};

package/src/components/inputs/radiobox-input.tsx

@@ -1,53 +0,0 @@
-import { GetInputId, SetHaveValueClass } from "../../helpers/input-helpers";
-import { IInputCreateResults, IRadiobox } from "../../interfaces/input-interfaces";
-import { CreateInput } from "./input";
-import { CreateInputBox, CreateInputWrapper } from "./input-box";
-
-export const CreateRadiobox = (param: IRadiobox, parentElement: HTMLElement | null, isTabular: boolean, isCheckbox: boolean = false) => {
-  const input = CreateInput(param) as HTMLInputElement;
-  const ELEMENT_ID = GetInputId(param);
-
-  input.classList.add("pr");
-  input.classList.remove("ipt");
-  input.defaultChecked = param.defaultValue ?? false;
-  input.type = "radio";
-  if (isCheckbox) input.classList.add("checkbox");
-
-  const box = CreateInputBox(param, input, null, isTabular);
-  const label = box.querySelector("label") as HTMLLabelElement;
-  if (label) label.className = "p2 ilb hc o08";
-  const wrapper = isTabular ? box : CreateInputWrapper(param, box, parentElement);
-
-  box.classList.add("df", "ac", "pl3", "ipt-bxh");
-  box.classList.remove("ipt-bx");
-
-  function handleChanged(val: boolean, isInit: boolean, isForced: boolean, isDisposed: boolean) {
-    if (!val) return;
-
-    param.onChanged?.(param.checkedValue, isInit, isForced, isDisposed, ELEMENT_ID, undefined);
-  }
-  function forceChangeDefaultValue(defaultValue: boolean): boolean {
-    input.value = defaultValue.toString();
-    handleChanged(defaultValue, false, true, false);
-    return true;
-  }
-  function onInputChanged(e: Event) {
-    handleChanged(input.checked, false, false, false);
-  }
-  input.addEventListener("input", onInputChanged);
-  SetHaveValueClass(input, true);
-  handleChanged(input.checked, true, false, false);
-  return {
-    input: param,
-    inputElement: input,
-    rootElement: wrapper,
-    forceChangeDefaultValue: forceChangeDefaultValue,
-    dispose: function (invokeOnChanged?: boolean) {
-      if (invokeOnChanged !== false) handleChanged(param.defaultValue ?? false, false, true, true);
-      input.removeEventListener("input", onInputChanged);
-      input.remove();
-      box.remove();
-      wrapper.remove();
-    },
-  } as IInputCreateResults;
-};

package/src/components/inputs/textarea-input.tsx

@@ -1,47 +0,0 @@
-import { GetInputId, SetHaveValueClass } from "../../helpers/input-helpers";
-import { IsNullOrEmpty } from "../../helpers/string-helpers";
-import { IInputCreateResults, ITextarea } from "../../interfaces/input-interfaces";
-import { CreateInput } from "./input";
-import { CreateInputBox, CreateInputWrapper } from "./input-box";
-
-export const CreateTextarea = (param: ITextarea, parentElement: HTMLElement | null, isTabular: boolean = false) => {
-  const ELEMENT_ID = GetInputId(param);
-  const hasPlaceholder = !IsNullOrEmpty(param.placeholder);
-
-  const input = CreateInput(param) as HTMLTextAreaElement;
-  const box = CreateInputBox(param, input, null, isTabular);
-  const wrapper = isTabular ? box : CreateInputWrapper(param, box, parentElement);
-
-  box.classList.add("textarea-box");
-
-  function handleChanged(val: string | undefined | null, isInit: boolean, isForced: boolean, isDisposed: boolean) {
-    const value = val?.trim() ?? null;
-    const isNullorEmpty = IsNullOrEmpty(value);
-    param.onChanged?.(isNullorEmpty ? null : value, isInit, isForced, isDisposed, ELEMENT_ID, undefined);
-    SetHaveValueClass(input, !isNullorEmpty || hasPlaceholder);
-  }
-
-  function forceChangeDefaultValue(defaultValue: string | null): boolean {
-    input.value = defaultValue ?? "";
-    handleChanged(defaultValue, false, true, false);
-    return true;
-  }
-  function onInputChanged(e: Event) {
-    handleChanged((e.currentTarget as HTMLInputElement).value, false, false, false);
-  }
-  input.addEventListener("input", onInputChanged);
-  handleChanged(param.defaultValue, true, false, false);
-  return {
-    input: param,
-    inputElement: input,
-    rootElement: wrapper,
-    forceChangeDefaultValue: forceChangeDefaultValue,
-    dispose: function (invokeOnChanged?: boolean) {
-      if (invokeOnChanged !== false) handleChanged(null, false, true, true);
-      input.removeEventListener("input", onInputChanged);
-      input.remove();
-      box.remove();
-      wrapper.remove();
-    },
-  } as IInputCreateResults;
-};

package/src/components/inputs/textbox-input.tsx

@@ -1,45 +0,0 @@
-import { GetInputId, SetHaveValueClass } from "../../helpers/input-helpers";
-import { IsNullOrEmpty } from "../../helpers/string-helpers";
-import { IInputCreateResults, ITextbox } from "../../interfaces/input-interfaces";
-import { CreateInput } from "./input";
-import { CreateInputBox, CreateInputWrapper } from "./input-box";
-
-export const CreateTextbox = (param: ITextbox, parentElement: HTMLElement | null, isTabular: boolean = false) => {
-  const ELEMENT_ID = GetInputId(param);
-  const hasPlaceholder = !IsNullOrEmpty(param.placeholder);
-
-  const input = CreateInput(param);
-  const box = CreateInputBox(param, input, null, isTabular);
-  const wrapper = isTabular ? box : CreateInputWrapper(param, box, parentElement);
-
-  function handleChanged(val: string | undefined | null, isInit: boolean, isForced: boolean, isDisposed: boolean) {
-    const value = val?.trim() ?? null;
-    const isNullorEmpty = IsNullOrEmpty(value);
-    param.onChanged?.(isNullorEmpty ? null : value, isInit, isForced, isDisposed, ELEMENT_ID, undefined);
-    SetHaveValueClass(input, !isNullorEmpty || hasPlaceholder);
-  }
-
-  function forceChangeDefaultValue(defaultValue: string | null): boolean {
-    input.value = defaultValue ?? "";
-    handleChanged(defaultValue, false, true, false);
-    return true;
-  }
-  function onInputChanged(e: Event) {
-    handleChanged((e.currentTarget as HTMLInputElement).value, false, false, false);
-  }
-  input.addEventListener("input", onInputChanged);
-  handleChanged(param.defaultValue, true, false, false);
-  return {
-    input: param,
-    inputElement: input,
-    rootElement: wrapper,
-    forceChangeDefaultValue: forceChangeDefaultValue,
-    dispose: function (invokeOnChanged?: boolean) {
-      if (invokeOnChanged !== false) handleChanged(null, false, true, true);
-      input.removeEventListener("input", onInputChanged);
-      input.remove();
-      box.remove();
-      wrapper.remove();
-    },
-  } as IInputCreateResults;
-};