nexus-shared 1.1.5 → 1.1.7

package/src/interfaces/button-interfaces.tsx

@@ -0,0 +1,63 @@
+import { EIcons, EIconTypes } from "./icon-interfaces";
+import { ESizes } from "./layout-interfaces";
+import { EBackgrounds } from "./theme-interfaces";
+import { ClickHandler, StringCallbackHandler, UN } from "./type-interfaces";
+
+export const DEFAULT_BUTTON_CLASS = (column?: number | UN, padding?: number | UN, borderSize?: number | UN, background?: EBackgrounds | UN, defaultClass?: string | UN, needColumnSize?: boolean | UN) => {
+  const col = `btn pr h w100 sn db toh p${padding ?? 3} ${background ?? EBackgrounds.Background1} df ac ${borderSize ? "bb" + borderSize : ""} ${defaultClass ?? ""}`;
+  if (needColumnSize !== false) return `${col} col-sm-12 ${`col-${column ?? 12}`}`;
+  return col;
+};
+
+export const DEFAULT_LINK_BUTTON_STYLE: React.CSSProperties = {
+  color: "var(--B20)",
+  borderBottom: "var(--BRD1) solid var(--B20)",
+  width: "fit-content",
+};
+
+export enum ETargets {
+  Blank = "_blank",
+  Self = "_self",
+  Parent = "_parent",
+  Top = "_top",
+}
+export enum EButtonTypes {
+  BUTTON = "button",
+  SUBMIT = "submit",
+}
+
+export interface IButton {
+  label?: string | StringCallbackHandler | string | UN;
+  id?: string | UN;
+  icon?: EIcons | UN;
+  onClick?: ClickHandler | UN;
+  url?: string | UN;
+  background?: EBackgrounds | UN;
+  defaultClass?: string | UN;
+  displayOrder?: number | UN;
+  data?: any | Event | UN;
+  iconType?: EIconTypes | UN;
+  iconSize?: ESizes | UN;
+  columnSize?: number | UN;
+  borderSize?: number | UN;
+  target?: ETargets | UN;
+}
+
+export const GetButton = (label?: string | StringCallbackHandler | string | UN, id?: string | UN, url?: string | UN, icon?: EIcons | UN, onClick?: ClickHandler | UN, data?: any | Event | UN, background?: EBackgrounds | UN, defaultClass?: string | UN, displayOrder?: number | UN, iconType?: EIconTypes | UN, iconSize?: ESizes | UN, columnSize?: number | UN, borderSize?: number | UN, target?: ETargets | UN): IButton => {
+  return {
+    label: label,
+    id: id,
+    icon: icon,
+    onClick: onClick,
+    url: url,
+    background: background,
+    defaultClass: defaultClass,
+    displayOrder: displayOrder,
+    data: data,
+    iconType: iconType,
+    iconSize: iconSize,
+    columnSize: columnSize,
+    borderSize: borderSize,
+    target: target,
+  };
+};

package/src/interfaces/datasource-interfaces.tsx

@@ -0,0 +1,22 @@
+import { IApiInformations, IGetApiInformations } from "./http-interfaces";
+
+export type DatasourceTypes = any[] | IApiInformations | IJoining | IGetApiInformations;
+
+export interface IJoiningKey {
+  /** someting we do not need from just need only TOs
+   * LIKE: City case,
+   * City have , Cityname, Countryname, CountryCode so, we do not need FROMs, we need only TOs
+   */
+  from?: string;
+  to: string;
+  status?: string;
+}
+export interface IJoining {
+  /** Root Client side ID KEY */
+  rootFrom: string;
+  /** Root Servier side ID KEY */
+  rootTo: string;
+  joinings: IJoiningKey[];
+  /** Comes From Server */
+  apiInformation: IGetApiInformations;
+}

package/src/interfaces/datatable-interfaces.tsx

@@ -0,0 +1,25 @@
+import { IJoining } from "./datasource-interfaces";
+
+export type OnRenderTableData = (data: any, object: any, index: number, tr: HTMLElement | null, td: HTMLElement | null, isDatatable?: boolean) => any;
+
+export interface IColumn {
+  systemName: string;
+  displayName: string;
+  displayOrder: number;
+  isVisible: boolean;
+  isSearchable: boolean;
+  isSortable: boolean;
+  render?: OnRenderTableData;
+  defaultWidth?: number | string;
+  minWidth?: string | number;
+  maxWidth?: string | number;
+  joining?: IJoining;
+  defaultClass?: string;
+  childColumns?: IColumn[];
+  rowSpan?: number;
+  colSpan: number;
+  columnSize?: number;
+  isSerialNumber: boolean;
+  allowResize: boolean;
+  //filterInput?: IInputBaseParameters<any>;
+}

package/src/interfaces/dialogbox-interfaces.tsx

@@ -0,0 +1,5 @@
+export interface IDialogboxResults {
+  visibility: (isVisible: boolean, isInitial?: boolean) => void;
+  isValid: () => boolean;
+  destroy: () => void;
+}

package/src/interfaces/http-interfaces.tsx

@@ -0,0 +1,15 @@
+export enum EActionMethods {
+  Get = 1,
+  Post = 2,
+  Put = 3,
+  Delete = 4,
+}
+export interface IApiInformations {
+  api: string;
+  method: EActionMethods;
+}
+export interface IGetApiInformations extends IApiInformations {
+  cacheCode?: string;
+  /** In Minutes */
+  cacheLifetime?: number;
+}

package/src/interfaces/icon-interfaces.tsx

@@ -0,0 +1,126 @@
+export const DEFAULT_ICON_ELEMENT_NAME = "ion-icon";
+export const DEFAULT_SMALL_ICON_BOX_SIZE = 1 / 1.25;
+export enum EIconTypes {
+  OUTLINED = "-outline",
+  SHARP = "-sharp",
+  FILLED = "",
+}
+export enum EIcons {
+  COPYRIGHT = "copyright",
+  WOMAN = "woman",
+  MAN = "man",
+  AT = "at",
+  BRIEFCASE = "briefcase",
+  LOCK_CLOSED = "lock-closed",
+  BOOKMARK = "bookmark",
+  CODE_WORKING = "code-working",
+  BOOKMARKS = "bookmarks",
+  READER = "reader",
+  SHARE_SOCIAL = "share-social",
+  ALERT_CIRCLE = "alert-circle",
+  SEND = "send",
+  FOOTBALL = "football",
+  BALLOON = "balloon",
+  SCHOOL = "school",
+  WALK = "walk",
+  GAME_CONTROLLER = "game-controller",
+  WATER = "water",
+  NOTIFICATIONS = "notifications",
+  LANGUAGE = "language",
+  CUBE = "cube",
+  FLAME = "flame",
+  BED = "bed",
+  DOCUMENT = "document",
+  START = "star",
+  CALENDAR = "calendar",
+  START_HALF = "star-half",
+  PEOPLE = "people",
+  MEGAPHONE = "megaphone",
+  SETTINGS = "settings",
+  PERSON_ADD = "person-add",
+  ANALYTICS = "analytics",
+  HOURGLASS = "hourglass",
+  STATS_CHART = "stats-chart",
+  GRID = "grid",
+  HEART = "heart",
+  CART = "cart",
+  REPEAT = "repeat",
+  HOME = "home",
+  WALLET = "wallet",
+  RELOAD = "reload",
+  CASH = "cash",
+  IMAGES = "images",
+  IMAGE = "image",
+  LOCK_OPEN = "lock-open",
+  CHATBOT_ELLIPSES = "chatbox-ellipses",
+  LOCATION = "location",
+  BUSINESS = "business",
+  CONSTRUCT = "construct",
+  CALENDER_NUMBER = "calendar-number",
+  HEART_CIRCLE = "heart-circle",
+  PERSON = "person",
+  CALL = "call",
+  FLAG = "flag",
+  TRANSGENDER = "transgender",
+  CARD = "card",
+  ID_CARD = "id-card",
+  MAIL = "mail",
+  MAIL_UNREAD = "mail-unread",
+  KEY = "key",
+  CREATE = "create",
+  MENU = "menu",
+  ARCHIVE = "archive",
+  ELLIPSIS_HORIZONTAL = "ellipsis-horizontal",
+  CHEVRON_DOWN = "chevron-down",
+  ARROW_FORWARD = "arrow-forward",
+  CHECKMARK_DOUBLE = "checkmark-done",
+  CLOSE = "close",
+  WARNING = "warning",
+  INFORMATION = "information",
+  HELP = "help",
+  HELP_CIRCLE = "help-circle",
+  TRASH_BIN = "trash-bin",
+  CLOUD_DOWNLOAD = "cloud-download",
+  CLOUD_UPLOAD = "cloud-upload",
+  EXIT = "exit",
+  CAMERA = "camera",
+  SUNNY = "sunny",
+  MOON = "moon",
+  COLOR_PALETTE = "color-palette",
+  RESIZE = "resize",
+  EXPAND = "expand",
+  REMOVE = "remove",
+  EYE = "eye",
+  OPTIONS = "options",
+  SEARCH = "search",
+  LIST = "list",
+  TRASH = "trash",
+  ADD = "add",
+  ADD_CIRCLE = "add-circle",
+  CARET_DOWN = "caret-down",
+  CARET_UP = "caret-up",
+  FUNNEL = "funnel",
+  BARBELL = "barbell",
+  DESKTOP = "desktop",
+  BUILD = "build",
+  BULB = "bulb",
+  NEWSPAPER = "newspaper",
+  CODE_SLASH = "code-slash",
+  GLOBE = "globe",
+  LEAF = "leaf",
+  REFRESH = "refresh",
+  LOGIN = "log-in",
+  SAVE = "save",
+  STOREFRONT = "storefront",
+  TEXT = "text",
+
+  LOGO_GOOGLE = "logo-google",
+  LOGO_FACEBOOK = "logo-facebook",
+  LOGO_INSTAGRAM = "logo-instagram",
+  LOGO_TIKTOK = "logo-tiktok",
+  LOGO_LINKEDIN = "logo-linkedin",
+  LOGO_GITHUB = "logo-github",
+  LOGO_TWITTER = "logo-twitter",
+  LOGO_WHATSAPP = "logo-whatsapp",
+  LOGO_YOUTUBE = "logo-youtube",
+}

package/src/interfaces/input-interfaces.tsx

@@ -0,0 +1,360 @@
+import { EButtonTypes, ETargets } from "./button-interfaces";
+import { DatasourceTypes } from "./datasource-interfaces";
+import { IColumn } from "./datatable-interfaces";
+import { EIcons, EIconTypes } from "./icon-interfaces";
+import { EFlexPositions, EOpacity, ESizes } from "./layout-interfaces";
+import { EBackgrounds } from "./theme-interfaces";
+import { ClickHandler, IInterface, UN } from "./type-interfaces";
+
+export type OnInputChangeHandler<T> = (currentValue: T, isInitilizing: boolean, isForcedChanged: boolean, isDisposed: boolean, inputKey: string, dataSource?: any | any[]) => void;
+export type OnElementLoad = (inputBox: HTMLElement | null, inputWrapper: HTMLElement | null, isInitilizing: boolean, isForcedChanged: boolean, isDisposed: boolean, currentKey: string, index: number) => void;
+export type AutoCompletes = "on" | "off";
+export type ForceChangeDefaultValue<T> = (defaultValue: T, type?: EValueChangeTypes, invokeOnChanged?: boolean | UN) => boolean;
+export type OnFormChangeHandler = (currentValue: any, isInitilizing: boolean, isForcedChanged: boolean, isDisposed: boolean, currentKey: string, index: number, type?: EValueChangeTypes, dataSource?: any | any[]) => void;
+
+export const DEFAULT_INPUT_BACKGROUND = EBackgrounds.Background1;
+export const MAX_INPUT_TYPE = 1900;
+export const DEFAULT_INPUT_BORDER_SIZE = 1;
+export const DEFAULT_TEXTAREA_ROWS = 3;
+
+export const REQUIRED_TEXT1 = "✲";
+
+export enum EValueChangeTypes {
+  Default = 0,
+  ForceChanged = 1,
+  FormCleared = 2,
+  FormReset = 3,
+  Disposed = 4,
+}
+export enum ERegexs {
+  Fullname = "^[A-Za-z]+(?: [A-Za-z]+)*[0-9]?$",
+  Username = "^[A-Za-z0-9]{7,30}$",
+  ContactNumber = "^[0-9]{10}$",
+  /** Allow Null */
+  ContactNumber_NULL = "^$|^[0-9]{10}$",
+  Email = "^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$",
+  /** Allow Null */
+  Email_NULL = "^$|^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,}$",
+  EmailUsername = "^(?=.*[a-zA-Z0-9])[a-zA-Z0-9]+@[a-zA-Z0-9]+\\.[a-zA-Z]{2,}$|[a-zA-Z0-9]{8,100}$",
+  Password = "^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%^&*()_+{}|:,.<>?/~]).{8,30}$",
+  EmailUsernameContact = "^(?:[A-Za-z]+[A-Za-z0-9]{2,30}|[0-9]{10}|[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,})$",
+  Hexadecimal = "^[0-9A-Fa-f]{8}$",
+  ContactEmail = "^(?:[0-9]{10}|[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,})$",
+}
+export enum EInputTypes {
+  Textbox = 1,
+  Textarea = 5,
+  Texteditor = 10,
+  Timepicker = 15,
+  Datepicker = 20,
+  Datetimepicker = 25,
+  DateRangepicker = 30,
+  DatetimeRangepicker = 35,
+  SingleSelection = 40,
+  MultiSelection = 45,
+  Checkbox = 50,
+  Radiobox = 55,
+  Radiogroup = 60,
+  Number = 65,
+  TabularForm = 70,
+  InputForm = 75,
+  Range = 80,
+  Slider = 85,
+  LinkButton = 2000,
+  HtmlElement = 3000,
+  FormTitle = 4000,
+  SubmitButton = 5000,
+}
+export interface IInputIcon {
+  icon: EIcons;
+  iconSize?: ESizes | UN;
+  boxSize?: ESizes | UN;
+  opacity?: EOpacity | UN;
+  type?: EIconTypes | UN;
+  background?: EBackgrounds | UN;
+  onClicked?: ClickHandler | UN;
+  onMouseEnter?: ClickHandler | UN;
+}
+export interface IInputRootParameters<T> extends IInterface {
+  id: string;
+  inputType: EInputTypes;
+  columnSize: number;
+  displayOrder: number;
+  borderSize: number;
+  background?: EBackgrounds | UN;
+  inputSize?: ESizes | UN;
+  defaultClass?: string | UN;
+  autoAdjustColumn?: boolean | UN;
+  icon?: IInputIcon | UN;
+  parentKey?: string;
+  defaultValue?: T | UN;
+  onChanged?: OnInputChangeHandler<T> | UN;
+  placeholder?: string | UN;
+  label?: string | UN;
+}
+export interface IInputBaseParameters<T> extends IInputRootParameters<T> {
+  validatorKey?: string | UN;
+  isRequired: boolean;
+  autoComplete?: AutoCompletes | UN;
+  isReadonly?: boolean | UN;
+}
+export interface IElement extends IInputRootParameters<void> {
+  onLoad?: OnElementLoad | UN;
+}
+export interface IInputParameters<T> extends IInputBaseParameters<T> {
+  minLength?: number | UN;
+  maxLength?: number | UN;
+}
+export interface ILinkbutton extends IElement {
+  href: string;
+  onClicked?: ClickHandler | UN;
+  borderBottom?: boolean | UN;
+  opacity?: EOpacity | UN;
+  position?: EFlexPositions | UN;
+  target?: ETargets | UN;
+}
+export interface ISubmitbutton extends IElement {
+  onClicked?: ClickHandler | UN;
+  type?: EButtonTypes | UN;
+}
+export interface ITextbox extends IInputParameters<string | null> {
+  isPassword?: boolean | UN;
+  regexKey?: ERegexs | UN;
+}
+export interface ISlider extends IInputParameters<number | null> {
+  step?: number | UN;
+  showTitleOnTop?: boolean | UN;
+}
+export interface ICheckbox extends IInputBaseParameters<boolean | any> {
+  checkedValue?: any | UN;
+  groupId?: string | UN;
+}
+export interface IRadiobox extends ICheckbox {}
+export interface ITextarea extends IInputParameters<string | null> {
+  isShowPreview?: boolean | UN;
+  rows?: number | UN;
+  regexKey?: ERegexs | UN;
+}
+export interface INumber extends IInputParameters<number | null> {
+  floatingPoint?: number | UN;
+  isAutoAdjust?: boolean | UN;
+  step?: number | string | UN;
+}
+export interface IDate extends IInputBaseParameters<string | Date | null> {
+  minDate?: Date | string | UN;
+  maxDate?: Date | string | UN;
+}
+export interface ISelection extends IInputBaseParameters<any | any[] | null> {
+  isSearchable: boolean | UN;
+  valueKey: string | UN;
+  labelKey: string | UN;
+  selectedLabel?: string | UN;
+  columnName?: string | UN;
+  dataSource: DatasourceTypes | UN;
+  onSelectionChanged?: OnInputChangeHandler<any | any[] | null> | UN;
+  columns?: IColumn[] | UN;
+  minDialogWidth?: number | UN;
+  bitwiseEnum?: any | UN;
+}
+export interface ITablularForm extends IInputParameters<any[]> {
+  inputs: IInputRootParameters<any>[];
+  disabledAdd?: boolean | UN;
+  disabledRemove?: boolean | UN;
+}
+export interface IInputCreateResults {
+  input: IInputRootParameters<any>;
+  /** This is input element like: textbox, textarea, checkbox */
+  inputElement: HTMLElement;
+  /** input element base parent like: formGroup/formWrapper */
+  rootElement: HTMLElement;
+  forceChangeDefaultValue: ForceChangeDefaultValue<any> | null;
+  dispose: (invokeOnChanged?: boolean | UN) => void;
+  onParentChanged?: OnFormChangeHandler | UN;
+}
+export interface IForm {
+  inputs: IInputRootParameters<any>[];
+  onChanged: OnFormChangeHandler;
+  index: number;
+  isTabularForm: boolean;
+  parentIdentifier: HTMLElement | UN | string;
+  defaultValue?: any | UN;
+}
+export interface IFormCreateResults {
+  inputResults: IInputCreateResults[];
+  formElement: HTMLElement;
+  dispose: (invokeOnChanged?: boolean) => void;
+  forceChangeDefaultValue: ForceChangeDefaultValue<any> | null;
+}
+
+export const GetForms = {
+  FORM: (inputs: IInputRootParameters<any>[], parentIdentifier: HTMLElement | string | UN, onChanged: OnFormChangeHandler, defaultValue?: any, index?: number, isTabularForm?: boolean): IForm => ({ inputs, onChanged, index: index ?? 0, isTabularForm: isTabularForm ?? false, parentIdentifier, defaultValue }),
+};
+export const GetInputs = {
+  ICON: (icon: EIcons, iconSize?: ESizes | UN, boxSize?: ESizes | UN, opacity?: EOpacity | UN, type?: EIconTypes | UN, background?: EBackgrounds | UN, onClicked?: ClickHandler | UN, onMouseEnter?: ClickHandler | UN): IInputIcon => ({
+    icon: icon,
+    iconSize: iconSize,
+    boxSize: boxSize,
+    opacity: opacity,
+    type: type,
+    background: background,
+    onClicked: onClicked,
+    onMouseEnter: onMouseEnter,
+  }),
+  TEXTBOX: (id: string, columnSize: number, displayOrder: number, label?: string | UN, placeholder?: string | UN, validatorKey?: string | UN, minLength?: number | UN, maxLength?: number | UN, regexKey?: ERegexs | UN, isPassword?: boolean | UN, isReadonly?: boolean | UN, isAutoComplete?: boolean | UN, defaultValue?: string | UN, background?: EBackgrounds | UN, borderSize?: number | UN, inputSize?: ESizes | UN, icon?: IInputIcon | UN, defaultClass?: string | UN, onChanged?: OnInputChangeHandler<string | null> | UN): ITextbox => ({
+    id: id,
+    columnSize: columnSize,
+    displayOrder: displayOrder,
+    label: label,
+    placeholder: placeholder,
+    validatorKey: validatorKey,
+    minLength: minLength,
+    maxLength: maxLength,
+    regexKey: regexKey,
+    defaultValue: defaultValue,
+    background: background,
+    borderSize: borderSize ?? DEFAULT_INPUT_BORDER_SIZE,
+    inputSize: inputSize,
+    isPassword: isPassword,
+    icon: icon,
+    isReadonly: isReadonly,
+    defaultClass: defaultClass,
+    onChanged: onChanged,
+    isRequired: (minLength !== undefined && minLength !== null && minLength > 0) ?? false,
+    inputType: EInputTypes.Textbox,
+    autoComplete: isAutoComplete !== false ? undefined : "off",
+  }),
+  TEXTAREA: (id: string, columnSize: number, displayOrder: number, label?: string | UN, placeholder?: string | UN, validatorKey?: string | UN, minLength?: number | UN, maxLength?: number | UN, rows?: number | UN, isShowPreview?: boolean | UN, defaultValue?: string | UN, regexKey?: ERegexs | UN, isReadonly?: boolean | UN, isAutoComplete?: boolean | UN, background?: EBackgrounds | UN, borderSize?: number | UN, inputSize?: ESizes | UN, icon?: IInputIcon | UN, defaultClass?: string | UN, onChanged?: OnInputChangeHandler<string | null> | UN): ITextarea => ({
+    id: id,
+    columnSize: columnSize,
+    displayOrder: displayOrder,
+    label: label,
+    placeholder: placeholder,
+    validatorKey: validatorKey,
+    minLength: minLength,
+    maxLength: maxLength,
+    isShowPreview: isShowPreview,
+    rows: rows ?? DEFAULT_TEXTAREA_ROWS,
+    regexKey: regexKey,
+    defaultValue: defaultValue,
+    background: background,
+    borderSize: borderSize ?? DEFAULT_INPUT_BORDER_SIZE,
+    inputSize: inputSize,
+    icon: icon,
+    isReadonly: isReadonly,
+    defaultClass: defaultClass,
+    onChanged: onChanged,
+    isRequired: (minLength !== undefined && minLength !== null && minLength > 0) ?? false,
+    inputType: EInputTypes.Textarea,
+    autoComplete: isAutoComplete !== false ? undefined : "off",
+  }),
+  NUMBER: (id: string, columnSize: number, displayOrder: number, label?: string | UN, placeholder?: string | UN, validatorKey?: string | UN, floatingPoint?: number | UN, isAutoAdjust?: boolean | UN, step?: number | string | UN, minLength?: number | UN, maxLength?: number | UN, defaultValue?: number | UN, isAutoComplete?: boolean | UN, background?: EBackgrounds | UN, borderSize?: number | UN, inputSize?: ESizes | UN, icon?: IInputIcon | UN, isReadonly?: boolean | UN, defaultClass?: string | UN, onChanged?: OnInputChangeHandler<number | null> | UN): INumber => ({
+    id: id,
+    columnSize: columnSize,
+    displayOrder: displayOrder,
+    label: label,
+    placeholder: placeholder,
+    validatorKey: validatorKey,
+    minLength: minLength,
+    maxLength: maxLength,
+    floatingPoint: floatingPoint,
+    isAutoAdjust: isAutoAdjust,
+    step: step,
+    defaultValue: defaultValue,
+    background: background,
+    borderSize: borderSize ?? DEFAULT_INPUT_BORDER_SIZE,
+    inputSize: inputSize,
+    icon: icon,
+    isReadonly: isReadonly,
+    defaultClass: defaultClass,
+    onChanged: onChanged,
+    isRequired: (minLength !== undefined && minLength !== null && minLength > 0) ?? false,
+    inputType: EInputTypes.Number,
+    autoComplete: isAutoComplete !== false ? undefined : "off",
+  }),
+
+  CHECKBOX: (id: string, columnSize: number, displayOrder: number, label?: string | UN, defaultValue?: boolean | UN, groupId?: string | UN, checkedValue?: any | UN, isAutoComplete?: boolean | UN, background?: EBackgrounds | UN, borderSize?: number | UN, inputSize?: ESizes | UN, icon?: IInputIcon | UN, isRequired?: boolean | UN, isReadonly?: boolean | UN, defaultClass?: string | UN, onChanged?: OnInputChangeHandler<boolean | any | null> | UN): ICheckbox => ({
+    id: id,
+    columnSize: columnSize,
+    displayOrder: displayOrder,
+    label: label,
+    defaultValue: defaultValue,
+    groupId: groupId,
+    checkedValue: checkedValue,
+    background: background,
+    borderSize: borderSize ?? 0,
+    inputSize: inputSize,
+    icon: icon,
+    isReadonly: isReadonly,
+    defaultClass: defaultClass,
+    onChanged: onChanged,
+    isRequired: isRequired ?? false,
+    inputType: EInputTypes.Checkbox,
+    autoComplete: isAutoComplete !== false ? undefined : "off",
+  }),
+  RADIOBOX: (id: string, columnSize: number, displayOrder: number, label?: string | UN, defaultValue?: boolean | UN, groupId?: string | UN, checkedValue?: any | UN, isAutoComplete?: boolean | UN, background?: EBackgrounds | UN, borderSize?: number | UN, inputSize?: ESizes | UN, icon?: IInputIcon | UN, isRequired?: boolean | UN, isReadonly?: boolean | UN, defaultClass?: string | UN, onChanged?: OnInputChangeHandler<boolean | any | null> | UN): ICheckbox => ({
+    id: id,
+    columnSize: columnSize,
+    displayOrder: displayOrder,
+    label: label,
+    groupId: groupId,
+    checkedValue: checkedValue,
+    defaultValue: defaultValue,
+    background: background,
+    borderSize: borderSize ?? 0,
+    inputSize: inputSize,
+    icon: icon,
+    isReadonly: isReadonly,
+    defaultClass: defaultClass,
+    onChanged: onChanged,
+    isRequired: isRequired ?? false,
+    inputType: EInputTypes.Radiobox,
+    autoComplete: isAutoComplete !== false ? undefined : "off",
+  }),
+  LINKBUTTON: (id: string, columnSize: number, displayOrder: number, href: string, label?: string | UN, onClicked?: ClickHandler | UN, onLoad?: OnElementLoad | UN, borderBottom?: boolean | UN, opacity?: EOpacity | UN, position?: EFlexPositions | UN, target?: ETargets | UN, background?: EBackgrounds | UN, borderSize?: number | UN, inputSize?: ESizes | UN, defaultClass?: string | UN): ILinkbutton => ({
+    id: id,
+    columnSize: columnSize,
+    displayOrder: displayOrder,
+    href: href,
+    label: label,
+    onClicked: onClicked,
+    onLoad: onLoad,
+    borderBottom: borderBottom,
+    opacity: opacity,
+    position: position,
+    target: target,
+    background: background,
+    borderSize: borderSize ?? 0,
+    inputSize: inputSize,
+    defaultClass: defaultClass,
+    inputType: EInputTypes.LinkButton,
+  }),
+  BUTTON: (
+    //
+    id: string,
+    columnSize: number,
+    displayOrder: number,
+    label?: string | UN,
+    onClicked?: ClickHandler | UN,
+    type?: EButtonTypes | UN,
+    onLoad?: OnElementLoad | UN,
+    background?: EBackgrounds | UN,
+    borderSize?: number | UN,
+    inputSize?: ESizes | UN,
+    defaultClass?: string | UN,
+    icon?: IInputIcon | UN,
+  ): ISubmitbutton => ({
+    id: id,
+    columnSize: columnSize,
+    displayOrder: displayOrder,
+    label: label,
+    type: type,
+    onClicked: onClicked,
+    onLoad: onLoad,
+    background: background ?? EBackgrounds.PrimaryColor,
+    borderSize: borderSize ?? DEFAULT_INPUT_BORDER_SIZE,
+    inputSize: inputSize,
+    defaultClass: defaultClass,
+    inputType: EInputTypes.SubmitButton,
+    icon: icon,
+  }),
+};