dry-ux 1.53.0 → 1.54.0

package/dist/helpers/utilities.js

@@ -111,8 +111,15 @@ const fnWithAuthCheck = (fn, authCheckUrl, authRedirectUrl) => fetch(authCheckUr
     }
 });
 exports.fnWithAuthCheck = fnWithAuthCheck;
-exports.StorageUtils = {
-    isStorageAvailable: function () {
+/**
+ * Utility class for storage-related operations.
+ */
+class StorageUtils {
+    /**
+     * Checks if the storage is available.
+     * @returns A boolean indicating if the storage is available.
+     */
+    static isStorageAvailable() {
         let available = typeof Storage !== "undefined";
         try {
             if (available)
@@ -122,8 +129,14 @@ exports.StorageUtils = {
             available = false;
         }
         return available;
-    },
-};
+    }
+}
+exports.StorageUtils = StorageUtils;
+/**
+ * Converts a string to a hash code.
+ * @param input The string to convert.
+ * @returns The hash code of the input string.
+ */
 const toHashCode = (input) => {
     let hash = 0;
     if (input.length === 0)
@@ -135,6 +148,11 @@ const toHashCode = (input) => {
     return hash;
 };
 exports.toHashCode = toHashCode;
+/**
+ * Inserts a URL parameter.
+ * @param key The key of the parameter.
+ * @param value The value of the parameter.
+ */
 const insertUrlParam = (key, value) => {
     if (history.pushState) {
         let searchParams = new URLSearchParams(window.location.search);
@@ -149,8 +167,16 @@ const insertUrlParam = (key, value) => {
     }
 };
 exports.insertUrlParam = insertUrlParam;
+/**
+ * Inserts multiple URL parameters.
+ * @param params An object containing key-value pairs of parameters.
+ */
 const insertUrlParams = (params) => Object.keys(params).forEach(key => (0, exports.insertUrlParam)(key, params[key]));
 exports.insertUrlParams = insertUrlParams;
+/**
+ * Retrieves URL parameters as an object.
+ * @returns An object containing the URL parameters.
+ */
 const getUrlParams = () => {
     const searchParams = new URLSearchParams(window.location.search);
     const params = {};
@@ -160,6 +186,9 @@ const getUrlParams = () => {
     return params;
 };
 exports.getUrlParams = getUrlParams;
+/**
+ * A class representing a deferred promise.
+ */
 class Deferred {
     constructor() {
         this.promise = new Promise((resolve, reject) => {
@@ -167,14 +196,26 @@ class Deferred {
             this._reject = reject;
         });
     }
+    /**
+     * Resolves the promise with the given result.
+     */
     get resolve() {
         return this._resolve;
     }
+    /**
+     * Rejects the promise with the given error.
+     */
     get reject() {
         return this._reject;
     }
 }
 exports.Deferred = Deferred;
+/**
+ * Parses a JSON string and returns the corresponding object.
+ * @param json The JSON string to parse.
+ * @param errorValue The value to return if parsing fails.
+ * @returns The parsed object or the error value.
+ */
 const tryParseJson = (json, errorValue = {}) => {
     try {
         return JSON.parse(json);
@@ -184,6 +225,11 @@ const tryParseJson = (json, errorValue = {}) => {
     }
 };
 exports.tryParseJson = tryParseJson;
+/**
+ * Hook to check if an element is visible in the viewport.
+ * @param ref The reference to the element.
+ * @returns A boolean indicating if the element is visible.
+ */
 const useIsVisible = (ref) => {
     const [isIntersecting, setIntersecting] = React.useState(false);
     React.useEffect(() => {
@@ -196,13 +242,32 @@ const useIsVisible = (ref) => {
     return isIntersecting;
 };
 exports.useIsVisible = useIsVisible;
+/**
+ * Hook to publish and subscribe to custom events.
+ * @returns An object containing the usePub and useSub hooks.
+ */
 const usePubSub = () => {
     const getEventName = (event) => `dry-ux-event-${event}`;
+    /**
+     * Publishes a custom event with the specified name and data.
+     * @template TName The type of the event name.
+     * @template TPayload The type of the event payload.
+     * @param event The name of the event to publish.
+     * @param data The data to include in the event payload.
+     */
     const usePub = () => (event, data) => {
         document.dispatchEvent(new CustomEvent(getEventName(event), {
             detail: data,
         }));
     };
+    /**
+     * Subscribes to a custom event with the specified name and calls the callback when the event is triggered.
+     * @template TName The type of the event name.
+     * @template TPayload The type of the event payload.
+     * @param event The name of the event to subscribe to.
+     * @param callback The function to call when the event is triggered.
+     * @returns A function to unsubscribe from the event.
+     */
     const useSub = (event, callback) => {
         const controller = new AbortController();
         const unsubscribe = () => controller.abort();

package/dist/index.d.ts

@@ -14,3 +14,6 @@ export { ErrorScreen } from "./error/ErrorScreen";
 export { Loader } from "./ui-utils/Loader";
 export { Spinner } from "./ui-utils/Spinner";
 export { RenderWhenVisible } from "./ui-utils/RenderWhenVisible";
+export { Validation, Element } from "./enhanced-inputs/Validaition";
+export * from "./enhanced-inputs/HTMLInputs";
+export * from "./enhanced-inputs/interface";

package/dist/index.js

@@ -14,7 +14,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.RenderWhenVisible = exports.Spinner = exports.Loader = exports.ErrorScreen = exports.ErrorBoundary = exports.DajaxiceProxy = exports.unflatten = exports.flatten = exports.classSet = exports.DryUXProvider = exports.Money = exports.DryUXRenderer = exports.DryUXContext = exports.useDryUxContext = void 0;
+exports.Element = exports.Validation = exports.RenderWhenVisible = exports.Spinner = exports.Loader = exports.ErrorScreen = exports.ErrorBoundary = exports.DajaxiceProxy = exports.unflatten = exports.flatten = exports.classSet = exports.DryUXProvider = exports.Money = exports.DryUXRenderer = exports.DryUXContext = exports.useDryUxContext = void 0;
 var UIUtilProvider_1 = require("./ui-utils/UIUtilProvider");
 Object.defineProperty(exports, "useDryUxContext", { enumerable: true, get: function () { return UIUtilProvider_1.useUIUtilContext; } });
 Object.defineProperty(exports, "DryUXContext", { enumerable: true, get: function () { return UIUtilProvider_1.UIUtilContext; } });
@@ -44,3 +44,8 @@ var Spinner_1 = require("./ui-utils/Spinner");
 Object.defineProperty(exports, "Spinner", { enumerable: true, get: function () { return Spinner_1.Spinner; } });
 var RenderWhenVisible_1 = require("./ui-utils/RenderWhenVisible");
 Object.defineProperty(exports, "RenderWhenVisible", { enumerable: true, get: function () { return RenderWhenVisible_1.RenderWhenVisible; } });
+var Validaition_1 = require("./enhanced-inputs/Validaition");
+Object.defineProperty(exports, "Validation", { enumerable: true, get: function () { return Validaition_1.Validation; } });
+Object.defineProperty(exports, "Element", { enumerable: true, get: function () { return Validaition_1.Element; } });
+__exportStar(require("./enhanced-inputs/HTMLInputs"), exports);
+__exportStar(require("./enhanced-inputs/interface"), exports);

package/dist/ui-utils/Loader.d.ts

@@ -1,11 +1,31 @@
+/**
+ * A singleton class that manages the display of a fullscreen loader spinner.
+ */
 export declare class Loader {
     private readonly spinnerStyles;
     private readonly elementId;
     private static instance;
     private constructor();
+    /**
+     * Returns the singleton instance of the Loader class.
+     * @returns The Loader instance.
+     */
     static getInstance(): Loader;
+    /**
+     * Gets the loader element from the DOM.
+     * @returns The loader element.
+     */
     get element(): HTMLElement;
+    /**
+     * Shows the loader by setting its visibility to visible.
+     */
     show(): void;
+    /**
+     * Hides the loader by setting its visibility to hidden.
+     */
     hide(): void;
+    /**
+     * Adds the loader elements to the DOM if they do not already exist.
+     */
     private addElementsIfNotExists;
 }

package/dist/ui-utils/Loader.js

@@ -2,29 +2,49 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Loader = void 0;
 const SpinnerStyles_1 = require("./SpinnerStyles");
+/**
+ * A singleton class that manages the display of a fullscreen loader spinner.
+ */
 class Loader {
     constructor() {
         this.spinnerStyles = SpinnerStyles_1.SpinnerStyles.getInstance();
         this.elementId = "dry-ux-loader";
     }
+    /**
+     * Returns the singleton instance of the Loader class.
+     * @returns The Loader instance.
+     */
     static getInstance() {
         if (!Loader.instance) {
             Loader.instance = new Loader();
         }
         return Loader.instance;
     }
+    /**
+     * Gets the loader element from the DOM.
+     * @returns The loader element.
+     */
     get element() {
         return document.getElementById(this.elementId);
     }
+    /**
+     * Shows the loader by setting its visibility to visible.
+     */
     show() {
         this.addElementsIfNotExists();
         this.element.style.visibility = "visible";
     }
+    /**
+     * Hides the loader by setting its visibility to hidden.
+     */
     hide() {
         if (this.element) {
             this.element.style.visibility = "hidden";
         }
     }
+    /**
+     * Adds the loader elements to the DOM if they do not already exist.
+     */
     addElementsIfNotExists() {
         this.spinnerStyles.add();
         if (!this.element) {

package/dist/ui-utils/RenderWhenVisible.d.ts

@@ -1,4 +1,11 @@
 import * as React from "react";
+/**
+ * A React component that renders its children only when they become visible in the viewport.
+ * @param children The JSX element to render when visible.
+ * @param onLoad An optional callback function to call when the children are loaded.
+ * @param minHeight An optional minimum height for the container to ensure visibility.
+ * @returns A JSX element that conditionally renders its children based on visibility.
+ */
 export declare const RenderWhenVisible: React.FC<{
     children: JSX.Element;
     onLoad?: () => void;

package/dist/ui-utils/RenderWhenVisible.js

@@ -3,6 +3,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.RenderWhenVisible = void 0;
 const React = require("react");
 const utilities_1 = require("../helpers/utilities");
+/**
+ * A React component that renders its children only when they become visible in the viewport.
+ * @param children The JSX element to render when visible.
+ * @param onLoad An optional callback function to call when the children are loaded.
+ * @param minHeight An optional minimum height for the container to ensure visibility.
+ * @returns A JSX element that conditionally renders its children based on visibility.
+ */
 exports.RenderWhenVisible = React.memo(({ children, minHeight, onLoad }) => {
     const [isLoaded, setIsLoaded] = React.useState(false);
     const ref = React.useRef(null);

package/dist/ui-utils/Spinner.d.ts

@@ -1,2 +1,7 @@
 import * as React from "react";
-export declare const Spinner: React.MemoExoticComponent<() => JSX.Element>;
+/**
+ * A React component that renders a spinner.
+ * The spinner styles are added when the component is mounted.
+ * @returns A JSX element representing the spinner.
+ */
+export declare const Spinner: React.MemoExoticComponent<() => React.JSX.Element>;

package/dist/ui-utils/Spinner.js

@@ -3,6 +3,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Spinner = void 0;
 const React = require("react");
 const SpinnerStyles_1 = require("./SpinnerStyles");
+/**
+ * A React component that renders a spinner.
+ * The spinner styles are added when the component is mounted.
+ * @returns A JSX element representing the spinner.
+ */
 exports.Spinner = React.memo(() => {
     React.useEffect(() => {
         const spinnerStyles = SpinnerStyles_1.SpinnerStyles.getInstance();

package/dist/ui-utils/UIUtil.interface.d.ts

@@ -1,5 +1,4 @@
-/// <reference types="react" />
-export declare type PopUp = {
+export type PopUp = {
     /**
      * Hides the modal.
      */
@@ -13,7 +12,7 @@ export declare type PopUp = {
      */
     remove: () => void;
 };
-export declare type PopUpOptions = {
+export type PopUpOptions = {
     /**
      * The content of the modal.
      */
@@ -55,8 +54,8 @@ export declare type PopUpOptions = {
      */
     centered?: boolean;
 };
-export declare type ButtonType = "primary" | "info" | "success" | "warning" | "danger";
-export declare type PopUpAction = {
+export type ButtonType = "primary" | "info" | "success" | "warning" | "danger";
+export type PopUpAction = {
     /**
      * The content to display in the modal.
      */
@@ -74,7 +73,7 @@ export declare type PopUpAction = {
      */
     closeOnClick?: boolean;
 };
-export declare type UIUtilModal = {
+export type UIUtilModal = {
     /**
      * Creates a non-unique modal.
      * @param options The options for the modal.
@@ -133,4 +132,4 @@ export interface IUIUtilLoader {
      */
     hide: () => void;
 }
-export declare type UIUtilPrompt = Pick<UIUtilModal, "showConfirm" | "showActions" | "instances" | "getCurrent">;
+export type UIUtilPrompt = Pick<UIUtilModal, "showConfirm" | "showActions" | "instances" | "getCurrent">;

package/dist/ui-utils/UIUtilProvider.d.ts

@@ -52,5 +52,5 @@ export declare class UIUtilProvider extends React.PureComponent<{}, IUIUtilProvi
     removeModalInstance(id: string): void;
     getCurrentModal(id: string): PopUp;
     createModal(id: string, options: PopUpOptions): PopUp;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/ui-utils/UIUtilRenderer.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { IModalProps } from "./Modal";
-export declare type UIUtilRendererProps = {
+export type UIUtilRendererProps = {
     modalConfig?: IModalProps["config"];
 };
 export declare const UIUtilRenderer: React.FC<UIUtilRendererProps>;

package/package.json

@@ -1,10 +1,11 @@
 {
   "name": "dry-ux",
-  "version": "1.53.0",
+  "version": "1.54.0",
   "description": "",
   "main": "dist/index",
   "scripts": {
-    "build": "rimraf dist/ && tsc",
+    "copy-css": "copyfiles -u 2 \"./src/enhanced-inputs/styles.css\" \"./dist/enhanced-inputs\"",
+    "build": "rimraf dist/ && tsc && npm run copy-css",
     "watch": "rimraf dist/ && tsc --watch",
     "format": "prettier --write \"src/**/*.ts\" \"src/**/*.tsx\"",
     "update:version": "npm version minor --no-git-tag-version",
@@ -23,6 +24,7 @@
   "author": "Naved Rangwala",
   "license": "ISC",
   "devDependencies": {
+    "copyfiles": "^2.4.1",
     "react": "^16.8.2",
     "react-dom": "^16.8.2",
     "@types/react": "^17.0.0",