tiny-essentials 1.25.0 → 1.25.1

package/dist/v1/libs/TinyAnalogClock.d.mts

@@ -0,0 +1,342 @@
+export default TinyAnalogClock;
+/**
+ * Configuration object for the Analog Clock.
+ */
+export type ClockConfig = {
+    /**
+     * - The background color of the clock face (e.g., '#ffffff', 'rgb(0,0,0)').
+     */
+    bgColor: string;
+    /**
+     * - The color of the clock's outer border.
+     */
+    borderColor: string;
+    /**
+     * - The thickness of the outer border in pixels.
+     */
+    borderWidth: number;
+    /**
+     * - The color of the minute/hour tick marks.
+     */
+    markColor: string;
+    /**
+     * - The color of the hour hand.
+     */
+    hourHandColor: string;
+    /**
+     * - The color of the minute hand.
+     */
+    minuteHandColor: string;
+    /**
+     * - The color of the second hand.
+     */
+    secondHandColor: string;
+    /**
+     * - The color of the numbers on the clock face.
+     */
+    textColor: string;
+    /**
+     * - The URL of an image to use as the clock face background. Set to null to use bgColor.
+     */
+    skinUrl: string | null;
+    /**
+     * - Whether to render the numbers (1-12) on the clock face.
+     */
+    showNumbers: boolean;
+    /**
+     * - Whether to display the second hand.
+     */
+    showSeconds: boolean;
+    /**
+     * - The total width and height of the clock in pixels.
+     */
+    size: number;
+    /**
+     * - Scale factor for the font size of the numbers relative to the clock size.
+     */
+    sizeAdjust: number;
+    /**
+     * - Padding in pixels between the clock edge and the tick marks.
+     */
+    padding: number;
+    /**
+     * - Distance multiplier (0-1) for placing numbers relative to the radius.
+     */
+    angleDistance: number;
+    /**
+     * - Hour tick width as a percentage of clock size (0.0 to 1.0).
+     */
+    pwH: number;
+    /**
+     * - Hour tick height as a percentage of clock size (0.0 to 1.0).
+     */
+    phH: number;
+    /**
+     * - Minute tick width as a percentage of clock size (0.0 to 1.0).
+     */
+    pwM: number;
+    /**
+     * - Minute tick height as a percentage of clock size (0.0 to 1.0).
+     */
+    phM: number;
+};
+/**
+ * Configuration object for the Analog Clock.
+ * @typedef {Object} ClockConfig
+ * @property {string} bgColor - The background color of the clock face (e.g., '#ffffff', 'rgb(0,0,0)').
+ * @property {string} borderColor - The color of the clock's outer border.
+ * @property {number} borderWidth - The thickness of the outer border in pixels.
+ * @property {string} markColor - The color of the minute/hour tick marks.
+ * @property {string} hourHandColor - The color of the hour hand.
+ * @property {string} minuteHandColor - The color of the minute hand.
+ * @property {string} secondHandColor - The color of the second hand.
+ * @property {string} textColor - The color of the numbers on the clock face.
+ * @property {string|null} skinUrl - The URL of an image to use as the clock face background. Set to null to use bgColor.
+ * @property {boolean} showNumbers - Whether to render the numbers (1-12) on the clock face.
+ * @property {boolean} showSeconds - Whether to display the second hand.
+ * @property {number} size - The total width and height of the clock in pixels.
+ * @property {number} sizeAdjust - Scale factor for the font size of the numbers relative to the clock size.
+ * @property {number} padding - Padding in pixels between the clock edge and the tick marks.
+ * @property {number} angleDistance - Distance multiplier (0-1) for placing numbers relative to the radius.
+ * @property {number} pwH - Hour tick width as a percentage of clock size (0.0 to 1.0).
+ * @property {number} phH - Hour tick height as a percentage of clock size (0.0 to 1.0).
+ * @property {number} pwM - Minute tick width as a percentage of clock size (0.0 to 1.0).
+ * @property {number} phM - Minute tick height as a percentage of clock size (0.0 to 1.0).
+ */
+declare class TinyAnalogClock {
+    /**
+     * Creates an instance of TinyAnalogClock.
+     * Initializes the DOM structure and starts the animation loop.
+     * @param {Partial<ClockConfig>} [options] - Optional configuration overrides.
+     */
+    constructor(options?: Partial<ClockConfig>);
+    /**
+     * Retrieves the current date and extracts the specific hour, minute, and second components.
+     * @returns {{ now: Date, s: number, m: number, h: number }}
+     * @private
+     */
+    private _getDate;
+    /**
+     * Applies the current configuration to the DOM elements (colors, sizes, visibility).
+     * @private
+     */
+    private _applyConfig;
+    /**
+     * Renders the clock face, including tick marks and numbers, based on the current size and config.
+     * Uses trigonometry to position elements perfectly from the center.
+     * @private
+     */
+    private _renderFace;
+    /**
+     * Starts the RequestAnimationFrame loop to update hand positions.
+     * @private
+     */
+    private _startTicker;
+    /**
+     * Gets the main HTML element of the clock.
+     * @returns {HTMLElement} The clock container.
+     */
+    get element(): HTMLElement;
+    /**
+     * Sets the size of the clock.
+     * @param {number} value - The new size in pixels. Must be a positive number.
+     * @throws {Error} If value is not a positive number.
+     */
+    set size(value: number);
+    /** * Gets the clock size in pixels.
+     * @returns {number}
+     */
+    get size(): number;
+    /**
+     * Sets the background image (skin) of the clock.
+     * @param {string|null} url - The URL string of the image, or null to remove the skin.
+     * @throws {Error} If value is not a string or null.
+     */
+    set skinUrl(url: string | null);
+    /**
+     * Gets the skin URL.
+     * @returns {string|null}
+     */
+    get skinUrl(): string | null;
+    /**
+     * Sets the primary border color.
+     * @param {string} color - A valid CSS color string.
+     * @throws {Error} If value is not a non-empty string.
+     */
+    set borderColor(color: string);
+    /**
+     * Gets the border color.
+     * @returns {string}
+     */
+    get borderColor(): string;
+    /**
+     * Sets the primary marks color.
+     * @param {string} color - A valid CSS color string.
+     * @throws {Error} If value is not a non-empty string.
+     */
+    set markColor(color: string);
+    /**
+     * Gets the tick marks color.
+     * @returns {string}
+     */
+    get markColor(): string;
+    /**
+     * Sets the primary text color.
+     * @param {string} color - A valid CSS color string.
+     * @throws {Error} If value is not a non-empty string.
+     */
+    set textColor(color: string);
+    /**
+     * Gets the text color.
+     * @returns {string}
+     */
+    get textColor(): string;
+    /**
+     * Toggles the visibility of numbers on the clock face.
+     * @param {boolean} value - True to show numbers, false to hide.
+     * @throws {Error} If value is not a boolean.
+     */
+    set showNumbers(value: boolean);
+    /**
+     * Gets numbers visibility.
+     * @returns {boolean}
+     */
+    get showNumbers(): boolean;
+    /**
+     * Sets the background color.
+     * @param {string} value
+     */
+    set bgColor(value: string);
+    /**
+     * Gets the background color.
+     * @returns {string}
+     */
+    get bgColor(): string;
+    /**
+     * Sets the border thickness in pixels.
+     * @param {number} value
+     */
+    set borderWidth(value: number);
+    /**
+     * Gets the border thickness.
+     * @returns {number}
+     */
+    get borderWidth(): number;
+    /**
+     * Sets the hour hand color.
+     * @param {string} value
+     */
+    set hourHandColor(value: string);
+    /**
+     * Gets the hour hand color.
+     * @returns {string}
+     */
+    get hourHandColor(): string;
+    /**
+     * Sets the minute hand color.
+     * @param {string} value
+     */
+    set minuteHandColor(value: string);
+    /**
+     * Gets the minute hand color.
+     * @returns {string}
+     */
+    get minuteHandColor(): string;
+    /**
+     * Sets the second hand color.
+     * @param {string} value
+     */
+    set secondHandColor(value: string);
+    /**
+     * Gets the second hand color.
+     * @returns {string}
+     */
+    get secondHandColor(): string;
+    /**
+     * Toggle second hand visibility.
+     * @param {boolean} value
+     */
+    set showSeconds(value: boolean);
+    /**
+     * Gets second hand visibility.
+     * @returns {boolean}
+     */
+    get showSeconds(): boolean;
+    /**
+     * Sets the font size adjustment factor.
+     * @param {number} value - Positive number.
+     */
+    set sizeAdjust(value: number);
+    /**
+     * Gets the font size adjustment factor.
+     * @returns {number}
+     */
+    get sizeAdjust(): number;
+    /**
+     * Sets the padding from edge to ticks.
+     * @param {number} value - Non-negative number in pixels.
+     */
+    set padding(value: number);
+    /**
+     * Gets the padding.
+     * @returns {number}
+     */
+    get padding(): number;
+    /**
+     * Sets the angle distance multiplier for numbers placement.
+     * @param {number} value - Positive number.
+     */
+    set angleDistance(value: number);
+    /**
+     * Gets the angle distance multiplier.
+     * @returns {number}
+     */
+    get angleDistance(): number;
+    /**
+     * Sets the Hour tick width percentage.
+     * @param {number} value - Positive number.
+     */
+    set pwH(value: number);
+    /**
+     * Gets the Hour tick width percentage.
+     * @returns {number}
+     */
+    get pwH(): number;
+    /**
+     * Sets the Hour tick height percentage.
+     * @param {number} value - Positive number.
+     */
+    set phH(value: number);
+    /**
+     * Gets the Hour tick height percentage.
+     * @returns {number}
+     */
+    get phH(): number;
+    /**
+     * Sets the Minute tick width percentage.
+     * @param {number} value - Positive number.
+     */
+    set pwM(value: number);
+    /**
+     * Gets the Minute tick width percentage.
+     * @returns {number}
+     */
+    get pwM(): number;
+    /**
+     * Sets the Minute tick height percentage.
+     * @param {number} value - Positive number.
+     */
+    set phM(value: number);
+    /**
+     * Gets the Minute tick height percentage.
+     * @returns {number}
+     */
+    get phM(): number;
+    /**
+     * Destroys the clock instance, stops animations, and removes the element from DOM.
+     * @returns {void}
+     */
+    destroy(): void;
+    #private;
+}
+//# sourceMappingURL=TinyAnalogClock.d.mts.map