@ulu/frontend 0.1.0-beta.4 → 0.1.0-beta.41

package/types/ui/tabs.d.ts

@@ -1,14 +1,7 @@
 /**
  * Init all instances currently in document
- * @param {Object} options Options to serve as defaults
  */
-export function init(options?: any): void;
-/**
- * Init all tabs within a certain context
- * @param {Node} context Element to init within
- * @param {Object} options Options to serve as defaults
- */
-export function initWithin(context: Node, options?: any): void;
+export function init(): void;
 /**
  *
  * @param {Node} element Tablist Element
@@ -21,4 +14,9 @@ export function setup(element: Node, options?: Node): any;
  * @type {Array}
  */
 export const instances: any[];
+/**
+ * Tabs Component Initializer
+ */
+export const initializer: ComponentInitializer;
+import { ComponentInitializer } from "../utils/system.js";
 //# sourceMappingURL=tabs.d.ts.map

package/types/ui/tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../js/ui/tabs.js"],"names":[],"mappings":"AAeA;;;GAGG;AACH,0CAcC;AAED;;;;GAIG;AACH,oCAHW,IAAI,uBAUd;AAED;;;;;GAKG;AACH,+BAJW,IAAI,YACJ,IAAI,OAuCd;AAlFD;;;GAGG;AACH,8BAA4B"}
+{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../js/ui/tabs.js"],"names":[],"mappings":"AA2BA;;GAEG;AACH,6BAoBC;AAED;;;;;GAKG;AACH,+BAJW,IAAI,YACJ,IAAI,OA2Bd;AArED;;;GAGG;AACH,8BAA4B;AAE5B;;GAEG;AACH,+CAGG;qCAdkC,oBAAoB"}

package/types/ui/theme-toggle.d.ts

@@ -1,14 +1,58 @@
+/**
+ * @param {Object} options Change options used as default for dialogs, can then be overridden by data attribute settings on element
+ */
+export function setDefaults(options: any): void;
 /**
  * Initialize everything in document
  * - This will only initialize elements once, it is safe to call on page changes
  */
 export function init(): void;
-export function setup(context?: Document): void;
-export namespace options {
-    let darkTheme: string;
-    let lightTheme: string;
-    let defaultTheme: string;
-    let darkIcon: string;
-    let lightIcon: string;
+/**
+ * Sets up a single toggle
+ * @param {HTMLElement} toggle A toggle to be setup
+ */
+export function setupToggle(toggle: HTMLElement, userOptions: any): {
+    destroy: () => void;
+    toggle: HTMLElement;
+    options: any;
+    toggleState: (event: any) => void;
+    setState(themeKey: any): void;
+};
+/**
+ * Theme Toggle Component Initializer
+ */
+export const initializer: ComponentInitializer;
+export namespace defaults {
+    namespace themes {
+        namespace light {
+            let label: string;
+            let value: string;
+            let iconClass: string;
+            let targetClass: string;
+            let mediaQuery: string;
+        }
+        namespace dark {
+            let label_1: string;
+            export { label_1 as label };
+            let iconClass_1: string;
+            export { iconClass_1 as iconClass };
+            let targetClass_1: string;
+            export { targetClass_1 as targetClass };
+            let mediaQuery_1: string;
+            export { mediaQuery_1 as mediaQuery };
+        }
+    }
+    let target: string;
+    let group: any;
+    /**
+     * Optional callback to do something when the state changes
+     */
+    function onChange(_ctx: any): void;
+    let initialState: string;
+    let checkMediaQuery: boolean;
+    let savePreference: boolean;
+    let storagePrefix: string;
+    let debug: boolean;
 }
+import { ComponentInitializer } from "../utils/system.js";
 //# sourceMappingURL=theme-toggle.d.ts.map

package/types/ui/theme-toggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme-toggle.d.ts","sourceRoot":"","sources":["../../js/ui/theme-toggle.js"],"names":[],"mappings":"AA6BA;;;GAGG;AACH,6BAOC;AAED,gDAeC"}
+{"version":3,"file":"theme-toggle.d.ts","sourceRoot":"","sources":["../../js/ui/theme-toggle.js"],"names":[],"mappings":"AAkGA;;GAEG;AACH,gDAEC;AAED;;;GAGG;AACH,6BASC;AAED;;;GAGG;AACH,oCAFW,WAAW;;;;;;EA+FrB;AAhND;;GAEG;AACH,+CAGG;;;;;;;;;;;;;;;;;;;;;;;IAmDD;;OAEG;IACH,mCAAiB;;;;;;;qCAjEkB,oBAAoB"}

package/types/ui/tooltip.d.ts

@@ -3,12 +3,9 @@
  */
 export function init(): void;
 /**
- * Query all popovers on current page and set them up
- * - Use this manually if needed
- * - Won't setup a popover more than once
+ * Tooltip Component Initializer
  */
-export function setup(): void;
-export function setupTrigger(trigger: any): Tooltip;
+export const initializer: ComponentInitializer;
 /**
  * Tooltip
  * - Provides basic tooltip functionality
@@ -95,4 +92,5 @@ export class Tooltip {
     show(event: any): void;
     hide(event: any): void;
 }
+import { ComponentInitializer } from "../utils/system.js";
 //# sourceMappingURL=tooltip.d.ts.map

package/types/ui/tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../js/ui/tooltip.js"],"names":[],"mappings":"AAmBA;;GAEG;AACH,6BAGC;AAED;;;;GAIG;AACH,8BAGC;AAED,oDAOC;AAED;;;;GAIG;AACH;IACE;;OAEG;IACH;QACE;;;;WAIG;;QAEH;;;WAGG;;;;;QAKH;;;WAGG;qBADO,SAAO,IAAI;QAGrB;;WAEG;;QAEH;;;WAGG;;QAEH;;;WAGG;oBADO,aAAc;QAGxB;;;WAGG;oBADO,aAAc;QAGxB;;;WAGG;;QAEH;;WAEG;;QAUH;;;WAGG;;MAIH;IACF,kCAEE;IACF,mEAaC;IAPC,aAA+D;IAC/D,qBAAyF;IACzF,cAA+B;IAC/B,aAAkB;IAClB,gBAAmB;IAIrB,cAIC;IACD,2BAKC;IACD,gBAGC;IACD,uBAcC;IACD,gCASC;IACD,6BAkBC;IACD,uBAiCC;IACD,wBAiBC;IACD,wCAmBC;IACD,sDAEC;IACD,+BAEC;IADC,0BAA4E;IAE9E,gCAKC;IACD,uBAEC;IACD,uBAEC;CACF"}
+{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../js/ui/tooltip.js"],"names":[],"mappings":"AAuBA;;GAEG;AACH,6BAaC;AA5BD;;GAEG;AACH,+CAGG;AAwBH;;;;GAIG;AACH;IACE;;OAEG;IACH;QACE;;;;WAIG;;QAEH;;;WAGG;;;;;QAKH;;;WAGG;qBADO,SAAO,IAAI;QAGrB;;WAEG;;QAEH;;;WAGG;;QAEH;;;WAGG;oBADO,aAAc;QAGxB;;;WAGG;oBADO,aAAc;QAGxB;;;WAGG;;QAEH;;WAEG;;QAUH;;;WAGG;;MAIH;IACF,kCAEE;IACF,mEAaC;IAPC,aAA+D;IAC/D,qBAAyF;IACzF,cAA+B;IAC/B,aAAkB;IAClB,gBAAmB;IAIrB,cAIC;IACD,2BAKC;IACD,gBAGC;IACD,uBAcC;IACD,gCASC;IACD,6BAkBC;IACD,uBAiCC;IACD,wBAiBC;IACD,wCAmBC;IACD,sDAEC;IACD,+BAEC;IADC,0BAA4E;IAE9E,gCAKC;IACD,uBAEC;IACD,uBAEC;CACF;qCApRoC,oBAAoB"}

package/types/utils/css.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @module utils/css
+ */
+/**
+ * Generates a CSS custom property name with a given prefix.
+ * @param {string} prefix The prefix to apply to the custom property name.
+ * @param {string} propertyName The base name of the custom property.
+ * @returns {string} The fully formed CSS custom property name (e.g., "--prefix-propertyName").
+ */
+export function getCustomProperty(prefix: string, propertyName: string): string;
+//# sourceMappingURL=css.d.ts.map

package/types/utils/css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"css.d.ts","sourceRoot":"","sources":["../../js/utils/css.js"],"names":[],"mappings":"AAAA;;GAEG;AAEH;;;;;GAKG;AACH,0CAJW,MAAM,gBACN,MAAM,GACJ,MAAM,CAIlB"}

package/types/utils/dom.d.ts

@@ -1,3 +1,9 @@
+/**
+ * Converts a data attribute name to its corresponding dataset property name.
+ * @param {string} dataAttribute - The data attribute name (e.g., "data-ulu-dialog").
+ * @returns {string} - The dataset property name (e.g., "uluDialog").
+ */
+export function dataAttributeToDatasetKey(attribute: any): string;
 /**
  * Get an elements JSON dataset value
  * @param {Node} element
@@ -32,15 +38,48 @@ export function setPositionClasses(parent: Node, classes?: any): void;
  * Resolve a target to Element
  * @param {String|Node} target The selector or node/element
  * @param {Object} context [document] The context to query possible selectors from
+ * @return {HTMLElement} The element or null if not found
+ */
+export function getElement(target: string | Node, context?: any): HTMLElement;
+/**
+ * Resolve a target to Elements
+ * @param {String|Node} target The selector or node/element
+ * @param {Object} context [document] The context to query possible selectors from
+ * @return {Array} The elements or null if not found
+ */
+export function getElements(target: string | Node, context?: any): any[];
+/**
+ * Resolves a class input (string or array) into a consistent array of class names.
+ * @param {string|string[]} input - The class input, which can be a string, an array of strings, or any other value.
+ * @returns {string[]} An array of class names. Returns an empty array for invalid or falsy input.
+ * @example
+ * resolveClassArray("fas fa-check  my-class"); // Returns ["fas", "fa-check", "my-class"]
+ * resolveClassArray(["another-class", "yet-another-class"]); // Returns ["another-class", "yet-another-class"]
+ * resolveClassArray("single-class"); // Returns ["single-class"]
+ */
+export function resolveClasses(classes: any): string[];
+/**
+ * Sets a CSS custom property equal to the scrollbar width.
+ * @param {object} options - Configuration options.
+ * @param {HTMLElement} [options.scrollableChild=document.body] - An element that is a child of a scrollable container (used for width calculation).
+ * @param {Window|HTMLElement} [options.container=window] - The container that can be scrolled (used for width calculation).
+ * @param {HTMLElement} [options.propertyElement=document.documentElement] - The element to which the custom property will be added. Defaults to document.documentElement for :root access.
+ * @param {string} [options.propName="--ulu-scrollbar-width"] - The name of the custom property to set.
  */
-export function getElement(target: string | Node, context?: any): any;
+export function addScrollbarProperty(options: {
+    scrollableChild?: HTMLElement;
+    container?: Window | HTMLElement;
+    propertyElement?: HTMLElement;
+    propName?: string;
+}): void;
 /**
- * Sets a CSS custom property equal to the scrollbar width
- * @param {Node} element The element that is the child of a scrollabel container
- * @param {Node} container The container that can be scrolled
- * @param {Stirng} propName Custom property to set
+ * Calculates the width of the scrollbar.
+ *
+ * @param {HTMLElement} [element=document.body] -The element that is the child of a scrollable container
+ * @param {Window|HTMLElement} [container=window] - The container that can be scrolled
+ * @returns {number} The width of the scrollbar in pixels.
  */
-export function addScrollbarProperty(element?: Node, container?: Node, propName?: Stirng): void;
+export function getScrollbarWidth(element?: HTMLElement, container?: Window | HTMLElement): number;
 /**
  * @module utils/dom
  */

package/types/utils/dom.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dom.d.ts","sourceRoot":"","sources":["../../js/utils/dom.js"],"names":[],"mappings":"AAOA;;;;;GAKG;AACH,wCAJW,IAAI,oBAYd;AAED;;;;;;GAMG;AACH,gDAJW,IAAI,gBAEF,YAAa,CASzB;AAED;;GAEG;AACH,mEAMC;AAGD;;;;;;;;;GASG;AACH,2CAHa,IAAI,uBAoChB;AAED;;;;GAIG;AACH,mCAHW,SAAO,IAAI,sBAYrB;AAED;;;;;GAKG;AACH,+CAJW,IAAI,cACJ,IAAI,2BAMd;AAzHD;;GAEG;AAGH,qCAAqD"}
+{"version":3,"file":"dom.d.ts","sourceRoot":"","sources":["../../js/utils/dom.js"],"names":[],"mappings":"AAOA;;;;GAIG;AACH,2DAFa,MAAM,CAOlB;AAED;;;;;GAKG;AACH,wCAJW,IAAI,oBAYd;AAED;;;;;;GAMG;AACH,gDAJW,IAAI,gBAEF,YAAa,CASzB;AAED;;GAEG;AACH,mEAMC;AAGD;;;;;;;;;GASG;AACH,2CAHa,IAAI,uBAoChB;AAED;;;;;GAKG;AACH,mCAJW,SAAO,IAAI,kBAEV,WAAW,CAWtB;AAED;;;;;GAKG;AACH,oCAJW,SAAO,IAAI,wBAerB;AAED;;;;;;;;GAQG;AACH,8CANa,MAAM,EAAE,CAiBpB;AAED;;;;;;;GAOG;AACH;IALiC,eAAe,GAArC,WAAW;IACkB,SAAS,GAAtC,MAAM,GAAC,WAAW;IACI,eAAe,GAArC,WAAW;IACM,QAAQ,GAAzB,MAAM;SAehB;AAED;;;;;;GAMG;AACH,4CAJW,WAAW,cACX,MAAM,GAAC,WAAW,GAChB,MAAM,CAIlB;AAtMD;;GAEG;AAGH,qCAAqD"}

package/types/utils/font-awesome.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Sets icon settings to Font Awesome icons
+ */
+export function configureIcons(): void;
+//# sourceMappingURL=font-awesome.d.ts.map

package/types/utils/font-awesome.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"font-awesome.d.ts","sourceRoot":"","sources":["../../js/utils/font-awesome.js"],"names":[],"mappings":"AAOA;;GAEG;AACH,uCAOC"}

package/types/utils/index.d.ts

@@ -5,5 +5,6 @@ export * as id from "./id.js";
 export * as index from "./index.js";
 export * as pauseYoutubeVideo from "./pause-youtube-video.js";
 export * as fileSave from "./file-save.js";
+export * as fontAwesome from "./font-awesome.js";
 declare namespace ___Users_joescherben_Personal_Projects_ULU_frontend_js_utils_index_ { }
 //# sourceMappingURL=index.d.ts.map

package/types/utils/system.d.ts

@@ -0,0 +1,113 @@
+/**
+ * Class serves as a utility for UI modules, handling the selection of elements and the initialization of corresponding component instances, ensuring consistent setup within the module
+ */
+export class ComponentInitializer {
+    static defaults: {
+        type: any;
+        baseAttribute: any;
+    };
+    static requiredOptions: string[];
+    static hasRequiredOptions: Function;
+    /**
+     * Create a new instance of ComponentInitializer
+     * @param {Object} options Options for configuring the component initializer.
+     * @param {String} options.type Type of component (used for logs).
+     * @param {String} options.baseAttribute Prefix and base attribute name (used for base attribute and further element attribute names).
+     */
+    constructor(options: {
+        type: string;
+        baseAttribute: string;
+    });
+    options: any;
+    logTitle: string;
+    /**
+     * Initializes the component based on the provided configuration.
+     * @param {Object} config The initialization configuration.
+     * @param {Function} config.setup The setup function to call for each element.
+     * @param {String} config.key [null] The optional key to use with attribute selector.
+     * @param {Boolean} config.withData [null] Whether to retrieve element data.
+     * @param {Array} config.events [null] Ulu events that should call setup when dispatched (ie. pageModified, pageResized)
+     * @param {Boolean} config.onPageResized [null] Whether to bind event listener for page resize end
+     * @param {HTMLElement} config.context [document] The context to query within.
+     */
+    init(config: {
+        setup: Function;
+        key: string;
+        withData: boolean;
+        events: any[];
+        onPageResized: boolean;
+        context: HTMLElement;
+    }): void;
+    /**
+     * Processes the elements based on the provided configuration.
+     * @param {object} config The initialization configuration.
+     * @param {function} config.setup The setup function to call for each element.
+     * @param {string} config.key The optional key to use with attribute selector.
+     * @param {boolean} config.withData [false] Whether to retrieve element data.
+     * @param {boolean} config.onPageModified [true] Whether to bind event listener for page modifications.
+     * @param {HTMLElement} config.context [document] The context to query within.
+     */
+    setupElements(config: {
+        setup: Function;
+        key: string;
+        withData: boolean;
+        onPageModified: boolean;
+        context: HTMLElement;
+    }): void;
+    /**
+     * Get an attribute name
+     * @param {String} key Optional key, if no key will return baseAttribute if key will return key added to base
+     * @returns {String} String like data-ulu-dialog or data-ulu-dialog-element
+     */
+    getAttribute(key: string): string;
+    /**
+     * Create an attribute selector
+     * @param {String} key Optional key (see getAttribute)
+     */
+    attributeSelector(key: string): string;
+    /**
+     * Create an attribute selector for initial
+     * @return {String}
+     */
+    attributeSelectorInitial(key: any): string;
+    /**
+     * Queries all main elements of a component that have not been initialized and extracts their data attributes.
+     * @param {HTMLElement} context The context to query within.
+     * @param {Boolean} withData Include dataset from element (as optional JSON)
+     * @param {Node} context Element to query elements from
+     * @returns {Array<{element: HTMLElement, data: object, initialize: Function}>} An array of objects containing the elements, their data, and convenience function initialize() which when called will set the init attribute on the element
+     */
+    queryAllInitial(key: any, withData: boolean, context?: HTMLElement): Array<{
+        element: HTMLElement;
+        data: object;
+        initialize: Function;
+    }>;
+    /**
+     * Sets the init attribute on an element, marking it as initialized.
+     * @param {HTMLElement} element The element to initialize.
+     */
+    initializeElement(element: HTMLElement): void;
+    /**
+     * Get an elements dataset value as JSON or other value
+     * @return {*} The value of the dataset, if JSON will return object else will return string value or undefined
+     */
+    getData(element: any, key: any): any;
+    /**
+     * Will output namespaced console logs for the given initializer
+     */
+    log(...msgs: any[]): void;
+    /**
+     * Will output namespaced console warnings for the given initializer
+     */
+    warn(...msgs: any[]): void;
+    /**
+     * Will output namespaced console error for the given initializer
+     */
+    logError(...msgs: any[]): void;
+}
+/**
+ * Class serves as a base for representing individual occurrences of a UI component, providing a consistent structure for each
+ */
+export class ComponentInstance {
+}
+//# sourceMappingURL=system.d.ts.map

package/types/utils/system.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"system.d.ts","sourceRoot":"","sources":["../../js/utils/system.js"],"names":[],"mappings":"AASA;;GAEG;AACH;IACE;;;MAGE;IACF,iCAGE;IACF,oCAEE;IAEF;;;;;OAKG;IACH;QAH2B,IAAI;QACJ,aAAa;OAUvC;IAFC,aAAwE;IACxE,iBAAgD;IAElD;;;;;;;;;OASG;IACH;QAP4B,KAAK;QACP,GAAG;QACF,QAAQ;QACV,MAAM;QACJ,aAAa;QACT,OAAO,EAA3B,WAAW;aAYrB;IACD;;;;;;;;OAQG;IACH;QAN4B,KAAK;QACP,GAAG,EAAlB,MAAM;QACU,QAAQ,EAAxB,OAAO;QACS,cAAc,EAA9B,OAAO;QACa,OAAO,EAA3B,WAAW;aAMrB;IACD;;;;OAIG;IACH,kCAGC;IACD;;;OAGG;IACH,uCAEC;IACD;;;OAGG;IACH,2CAEC;IACD;;;;;;OAMG;IACH,uDALW,WAAW,GAGT,MAAM;QAAC,OAAO,EAAE,WAAW,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,UAAU,WAAU;KAAC,CAAC,CAS7E;IACD;;;OAGG;IACH,2BAFW,WAAW,QAIrB;IACD;;;OAGG;IACH,qCAGC;IACD;;OAEG;IACH,0BAEC;IACD;;OAEG;IACH,2BAEC;IACD;;OAEG;IACH,+BAEC;CACF;AAED;;GAEG;AACH;CAEC"}