@bouko/react 2.6.6 → 2.6.7

package/dist/colors/core.d.ts

@@ -1,10 +1,10 @@
-import type { RGBA } from "./types";
-/**
- * Extracts R, G, B, and A values from hex.
- *
- * @param {string} input - Hex value to parse.
- *
- * @returns {RGBA} Individual color values.
- * @throws {Error} Invalid hex code
-**/
-export declare function parseHex(input: string): RGBA;
+import type { RGBA } from "./types";
+/**
+ * Extracts R, G, B, and A values from hex.
+ *
+ * @param {string} input - Hex value to parse.
+ *
+ * @returns {RGBA} Individual color values.
+ * @throws {Error} Invalid hex code
+**/
+export declare function parseHex(input: string): RGBA;

package/dist/colors/core.js

@@ -1,25 +1,25 @@
-/**
- * Extracts R, G, B, and A values from hex.
- *
- * @param {string} input - Hex value to parse.
- *
- * @returns {RGBA} Individual color values.
- * @throws {Error} Invalid hex code
-**/
-export function parseHex(input) {
-    if (!/^#(?:[0-9a-fA-F]{3}|[0-9a-fA-F]{4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/.test(input))
-        throw new Error("Invalid hex");
-    let hex = input.replace("#", "");
-    let chars = hex.split("");
-    if (chars.length === 3 || chars.length == 4)
-        hex = chars.map(c => c + c).join("");
-    if (hex.length === 6)
-        hex += "ff";
-    return {
-        r: parseInt(hex.substring(0, 2), 16),
-        g: parseInt(hex.substring(2, 4), 16),
-        b: parseInt(hex.substring(4, 6), 16),
-        a: parseInt(hex.substring(6, 8), 16) / 255
-    };
-}
-// clean
+/**
+ * Extracts R, G, B, and A values from hex.
+ *
+ * @param {string} input - Hex value to parse.
+ *
+ * @returns {RGBA} Individual color values.
+ * @throws {Error} Invalid hex code
+**/
+export function parseHex(input) {
+    if (!/^#(?:[0-9a-fA-F]{3}|[0-9a-fA-F]{4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/.test(input))
+        throw new Error("Invalid hex");
+    let hex = input.replace("#", "");
+    let chars = hex.split("");
+    if (chars.length === 3 || chars.length == 4)
+        hex = chars.map(c => c + c).join("");
+    if (hex.length === 6)
+        hex += "ff";
+    return {
+        r: parseInt(hex.substring(0, 2), 16),
+        g: parseInt(hex.substring(2, 4), 16),
+        b: parseInt(hex.substring(4, 6), 16),
+        a: parseInt(hex.substring(6, 8), 16) / 255
+    };
+}
+// clean

package/dist/colors/index.d.ts

@@ -1,26 +1,26 @@
-/**
- * Applies opacity to a color. Supports CSS variables and hex.
- * Defaults to 50% if no opacity is specified. If an alpha value
- * is already present in the provided hex it will be overwritten.
- *
- * To use a CSS variable it must exist and be passed in the
- * form `--variable-name`. Any other format may cause unexpected
- * results. CSS variables use 'color-mix' which is not supported in
- * some old browsers such as Safari 15.3 and Internet Explorer.
- *
- * @param {string} color - Color value to apply opacity.
- * @param {number} opacity - Opacity level from 0-100. (optional, default = 50)
- *
- * @returns {string} The RGBA CSS style string
- *
- * @throws {Error} Opacity outside 0-1 bounds.
- * @throws {Error} Invalid hex string provided.
-**/
-export declare function opacitize(color: string, opacity?: number): string;
-/**
- * Gets hex value from CSS variable name
- *
- * @param {string} name - Color variable name.
- * @returns {string} The hex code.
-**/
-export declare const resolveColor: (name: string) => string;
+/**
+ * Applies opacity to a color. Supports CSS variables and hex.
+ * Defaults to 50% if no opacity is specified. If an alpha value
+ * is already present in the provided hex it will be overwritten.
+ *
+ * To use a CSS variable it must exist and be passed in the
+ * form `--variable-name`. Any other format may cause unexpected
+ * results. CSS variables use 'color-mix' which is not supported in
+ * some old browsers such as Safari 15.3 and Internet Explorer.
+ *
+ * @param {string} color - Color value to apply opacity.
+ * @param {number} opacity - Opacity level from 0-100. (optional, default = 50)
+ *
+ * @returns {string} The RGBA CSS style string
+ *
+ * @throws {Error} Opacity outside 0-1 bounds.
+ * @throws {Error} Invalid hex string provided.
+**/
+export declare function opacitize(color: string, opacity?: number): string;
+/**
+ * Gets hex value from CSS variable name
+ *
+ * @param {string} name - Color variable name.
+ * @returns {string} The hex code.
+**/
+export declare const resolveColor: (name: string) => string;

package/dist/colors/index.js

@@ -1,43 +1,43 @@
-import { parseHex } from "./core";
-/**
- * Applies opacity to a color. Supports CSS variables and hex.
- * Defaults to 50% if no opacity is specified. If an alpha value
- * is already present in the provided hex it will be overwritten.
- *
- * To use a CSS variable it must exist and be passed in the
- * form `--variable-name`. Any other format may cause unexpected
- * results. CSS variables use 'color-mix' which is not supported in
- * some old browsers such as Safari 15.3 and Internet Explorer.
- *
- * @param {string} color - Color value to apply opacity.
- * @param {number} opacity - Opacity level from 0-100. (optional, default = 50)
- *
- * @returns {string} The RGBA CSS style string
- *
- * @throws {Error} Opacity outside 0-1 bounds.
- * @throws {Error} Invalid hex string provided.
-**/
-export function opacitize(color, opacity = 50) {
-    if (opacity < 0)
-        throw new Error(`[opacitize] Opacity below 0%: '${opacity}'`);
-    if (opacity > 100)
-        throw new Error(`[opacitize] Opacity above 100%: '${opacity}'`);
-    if (color.startsWith("#")) {
-        const { r, g, b } = parseHex(color);
-        return `rgba(${r}, ${g}, ${b}, ${opacity / 100})`;
-    }
-    return `color-mix(in srgb, var(${color}) ${opacity}%, transparent)`;
-}
-;
-/**
- * Gets hex value from CSS variable name
- *
- * @param {string} name - Color variable name.
- * @returns {string} The hex code.
-**/
-export const resolveColor = (name) => {
-    const css = getComputedStyle(document.documentElement);
-    const color = css.getPropertyValue(`--color-${name}`);
-    return color.trim();
-};
-// clean
+import { parseHex } from "./core";
+/**
+ * Applies opacity to a color. Supports CSS variables and hex.
+ * Defaults to 50% if no opacity is specified. If an alpha value
+ * is already present in the provided hex it will be overwritten.
+ *
+ * To use a CSS variable it must exist and be passed in the
+ * form `--variable-name`. Any other format may cause unexpected
+ * results. CSS variables use 'color-mix' which is not supported in
+ * some old browsers such as Safari 15.3 and Internet Explorer.
+ *
+ * @param {string} color - Color value to apply opacity.
+ * @param {number} opacity - Opacity level from 0-100. (optional, default = 50)
+ *
+ * @returns {string} The RGBA CSS style string
+ *
+ * @throws {Error} Opacity outside 0-1 bounds.
+ * @throws {Error} Invalid hex string provided.
+**/
+export function opacitize(color, opacity = 50) {
+    if (opacity < 0)
+        throw new Error(`[opacitize] Opacity below 0%: '${opacity}'`);
+    if (opacity > 100)
+        throw new Error(`[opacitize] Opacity above 100%: '${opacity}'`);
+    if (color.startsWith("#")) {
+        const { r, g, b } = parseHex(color);
+        return `rgba(${r}, ${g}, ${b}, ${opacity / 100})`;
+    }
+    return `color-mix(in srgb, var(${color}) ${opacity}%, transparent)`;
+}
+;
+/**
+ * Gets hex value from CSS variable name
+ *
+ * @param {string} name - Color variable name.
+ * @returns {string} The hex code.
+**/
+export const resolveColor = (name) => {
+    const css = getComputedStyle(document.documentElement);
+    const color = css.getPropertyValue(`--color-${name}`);
+    return color.trim();
+};
+// clean

package/dist/colors/types.d.ts

@@ -1,11 +1,11 @@
-/**
- * Color-related type definitions.
- *
- * - `RGBA`: Hex split into individual color values.
-**/
-export declare type RGBA = {
-    r: number;
-    g: number;
-    b: number;
-    a: number;
-};
+/**
+ * Color-related type definitions.
+ *
+ * - `RGBA`: Hex split into individual color values.
+**/
+export type RGBA = {
+    r: number;
+    g: number;
+    b: number;
+    a: number;
+};

package/dist/colors/types.js

@@ -1,7 +1,7 @@
-/**
- * Color-related type definitions.
- *
- * - `RGBA`: Hex split into individual color values.
-**/
-export {};
-// clean
+/**
+ * Color-related type definitions.
+ *
+ * - `RGBA`: Hex split into individual color values.
+**/
+export {};
+// clean

package/dist/components/animate/configs.d.ts

@@ -1,136 +1,136 @@
-export declare const animations: {
-    readonly fadeUp: {
-        readonly initial: {
-            readonly opacity: 0;
-            readonly y: 30;
-        };
-        readonly animate: {
-            readonly opacity: 1;
-            readonly y: 0;
-            readonly transition: {
-                readonly duration: 0.3;
-            };
-        };
-    };
-    readonly fadeInAndOut: {
-        readonly initial: {
-            readonly opacity: 0;
-        };
-        readonly animate: {
-            readonly opacity: 1;
-        };
-        readonly exit: {
-            readonly opacity: 0;
-        };
-    };
-    readonly fadeUpAndOut: {
-        readonly initial: {
-            readonly opacity: 0;
-            readonly y: 10;
-        };
-        readonly animate: {
-            readonly opacity: 1;
-            readonly y: 0;
-        };
-        readonly exit: {
-            readonly opacity: 1;
-            readonly y: -10;
-        };
-    };
-    readonly fadeUpAndOutSlow: {
-        readonly initial: {
-            readonly opacity: 0;
-            readonly y: "-100%";
-        };
-        readonly animate: {
-            readonly opacity: 1;
-            readonly y: 0;
-            readonly transition: {
-                readonly duration: 0.2;
-                readonly ease: "easeInOut";
-            };
-        };
-        readonly exit: {
-            readonly opacity: 0;
-            readonly y: "100%";
-        };
-    };
-    readonly fadeLeft: {
-        readonly initial: {
-            readonly x: -50;
-            readonly opacity: 0;
-        };
-        readonly animate: {
-            readonly x: 0;
-            readonly opacity: 1;
-        };
-        readonly exit: {
-            readonly x: 50;
-            readonly opacity: 0;
-        };
-        readonly transition: {
-            readonly duration: 0.4;
-            readonly ease: "easeOut";
-        };
-    };
-    readonly growUpAndOut: {
-        readonly initial: {
-            readonly opacity: 0;
-            readonly height: 0;
-        };
-        readonly animate: {
-            readonly opacity: 1;
-            readonly height: "auto";
-        };
-        readonly exit: {
-            readonly opacity: 0;
-            readonly height: 0;
-        };
-    };
-    readonly fadeStagger: {
-        readonly initial: {
-            readonly opacity: 0;
-        };
-        readonly animate: {
-            readonly opacity: 1;
-            readonly transition: {
-                readonly staggerChildren: 0.2;
-            };
-        };
-    };
-    readonly fadeList: {
-        readonly hidden: {
-            readonly opacity: 0;
-            readonly x: -10;
-            readonly y: 5;
-        };
-        readonly visible: {
-            readonly opacity: 1;
-            readonly x: 0;
-            readonly y: 0;
-            readonly transition: {
-                readonly type: "spring";
-                readonly stiffness: 350;
-                readonly damping: 25;
-            };
-        };
-    };
-    readonly popUp: {
-        readonly initial: {
-            readonly opacity: 0;
-            readonly scale: 0.9;
-        };
-        readonly animate: {
-            readonly opacity: 1;
-            readonly scale: 1;
-        };
-        readonly exit: {
-            readonly opacity: 0;
-            readonly scale: 0.9;
-        };
-        readonly transition: {
-            readonly duration: 0.2;
-            readonly ease: readonly [0.23, 1, 0.32, 1];
-        };
-    };
-};
+export declare const animations: {
+    readonly fadeUp: {
+        readonly initial: {
+            readonly opacity: 0;
+            readonly y: 30;
+        };
+        readonly animate: {
+            readonly opacity: 1;
+            readonly y: 0;
+            readonly transition: {
+                readonly duration: 0.3;
+            };
+        };
+    };
+    readonly fadeInAndOut: {
+        readonly initial: {
+            readonly opacity: 0;
+        };
+        readonly animate: {
+            readonly opacity: 1;
+        };
+        readonly exit: {
+            readonly opacity: 0;
+        };
+    };
+    readonly fadeUpAndOut: {
+        readonly initial: {
+            readonly opacity: 0;
+            readonly y: 10;
+        };
+        readonly animate: {
+            readonly opacity: 1;
+            readonly y: 0;
+        };
+        readonly exit: {
+            readonly opacity: 1;
+            readonly y: -10;
+        };
+    };
+    readonly fadeUpAndOutSlow: {
+        readonly initial: {
+            readonly opacity: 0;
+            readonly y: "-100%";
+        };
+        readonly animate: {
+            readonly opacity: 1;
+            readonly y: 0;
+            readonly transition: {
+                readonly duration: 0.2;
+                readonly ease: "easeInOut";
+            };
+        };
+        readonly exit: {
+            readonly opacity: 0;
+            readonly y: "100%";
+        };
+    };
+    readonly fadeLeft: {
+        readonly initial: {
+            readonly x: -50;
+            readonly opacity: 0;
+        };
+        readonly animate: {
+            readonly x: 0;
+            readonly opacity: 1;
+        };
+        readonly exit: {
+            readonly x: 50;
+            readonly opacity: 0;
+        };
+        readonly transition: {
+            readonly duration: 0.4;
+            readonly ease: "easeOut";
+        };
+    };
+    readonly growUpAndOut: {
+        readonly initial: {
+            readonly opacity: 0;
+            readonly height: 0;
+        };
+        readonly animate: {
+            readonly opacity: 1;
+            readonly height: "auto";
+        };
+        readonly exit: {
+            readonly opacity: 0;
+            readonly height: 0;
+        };
+    };
+    readonly fadeStagger: {
+        readonly initial: {
+            readonly opacity: 0;
+        };
+        readonly animate: {
+            readonly opacity: 1;
+            readonly transition: {
+                readonly staggerChildren: 0.2;
+            };
+        };
+    };
+    readonly fadeList: {
+        readonly hidden: {
+            readonly opacity: 0;
+            readonly x: -10;
+            readonly y: 5;
+        };
+        readonly visible: {
+            readonly opacity: 1;
+            readonly x: 0;
+            readonly y: 0;
+            readonly transition: {
+                readonly type: "spring";
+                readonly stiffness: 350;
+                readonly damping: 25;
+            };
+        };
+    };
+    readonly popUp: {
+        readonly initial: {
+            readonly opacity: 0;
+            readonly scale: 0.9;
+        };
+        readonly animate: {
+            readonly opacity: 1;
+            readonly scale: 1;
+        };
+        readonly exit: {
+            readonly opacity: 0;
+            readonly scale: 0.9;
+        };
+        readonly transition: {
+            readonly duration: 0.2;
+            readonly ease: readonly [0.23, 1, 0.32, 1];
+        };
+    };
+};

package/dist/components/animate/configs.js

@@ -1,62 +1,62 @@
-export const animations = {
-    "fadeUp": {
-        "initial": { "opacity": 0, "y": 30 },
-        "animate": {
-            "opacity": 1,
-            "y": 0,
-            "transition": { "duration": 0.3 }
-        }
-    },
-    "fadeInAndOut": {
-        "initial": { "opacity": 0 },
-        "animate": { "opacity": 1 },
-        "exit": { "opacity": 0 }
-    },
-    "fadeUpAndOut": {
-        "initial": { "opacity": 0, "y": 10 },
-        "animate": { "opacity": 1, "y": 0 },
-        "exit": { "opacity": 1, "y": -10 }
-    },
-    "fadeUpAndOutSlow": {
-        "initial": { "opacity": 0, "y": "-100%" },
-        "animate": { "opacity": 1, "y": 0,
-            "transition": { "duration": 0.2, "ease": "easeInOut" }
-        },
-        "exit": { "opacity": 0, "y": "100%" }
-    },
-    "fadeLeft": {
-        "initial": { "x": -50, "opacity": 0 },
-        "animate": { "x": 0, "opacity": 1 },
-        "exit": { "x": 50, "opacity": 0 },
-        "transition": { "duration": 0.4, "ease": "easeOut" }
-    },
-    "growUpAndOut": {
-        "initial": { "opacity": 0, "height": 0 },
-        "animate": { "opacity": 1, "height": "auto" },
-        "exit": { "opacity": 0, "height": 0 }
-    },
-    "fadeStagger": {
-        "initial": { "opacity": 0 },
-        "animate": {
-            "opacity": 1,
-            "transition": { "staggerChildren": 0.2 }
-        }
-    },
-    "fadeList": {
-        "hidden": { "opacity": 0, "x": -10, "y": 5 },
-        "visible": {
-            "opacity": 1, "x": 0, "y": 0,
-            "transition": {
-                "type": "spring",
-                "stiffness": 350,
-                "damping": 25
-            }
-        }
-    },
-    "popUp": {
-        "initial": { "opacity": 0, "scale": 0.9 },
-        "animate": { "opacity": 1, "scale": 1 },
-        "exit": { "opacity": 0, "scale": 0.9 },
-        "transition": { "duration": 0.2, "ease": [0.23, 1, 0.32, 1] }
-    }
-};
+export const animations = {
+    "fadeUp": {
+        "initial": { "opacity": 0, "y": 30 },
+        "animate": {
+            "opacity": 1,
+            "y": 0,
+            "transition": { "duration": 0.3 }
+        }
+    },
+    "fadeInAndOut": {
+        "initial": { "opacity": 0 },
+        "animate": { "opacity": 1 },
+        "exit": { "opacity": 0 }
+    },
+    "fadeUpAndOut": {
+        "initial": { "opacity": 0, "y": 10 },
+        "animate": { "opacity": 1, "y": 0 },
+        "exit": { "opacity": 1, "y": -10 }
+    },
+    "fadeUpAndOutSlow": {
+        "initial": { "opacity": 0, "y": "-100%" },
+        "animate": { "opacity": 1, "y": 0,
+            "transition": { "duration": 0.2, "ease": "easeInOut" }
+        },
+        "exit": { "opacity": 0, "y": "100%" }
+    },
+    "fadeLeft": {
+        "initial": { "x": -50, "opacity": 0 },
+        "animate": { "x": 0, "opacity": 1 },
+        "exit": { "x": 50, "opacity": 0 },
+        "transition": { "duration": 0.4, "ease": "easeOut" }
+    },
+    "growUpAndOut": {
+        "initial": { "opacity": 0, "height": 0 },
+        "animate": { "opacity": 1, "height": "auto" },
+        "exit": { "opacity": 0, "height": 0 }
+    },
+    "fadeStagger": {
+        "initial": { "opacity": 0 },
+        "animate": {
+            "opacity": 1,
+            "transition": { "staggerChildren": 0.2 }
+        }
+    },
+    "fadeList": {
+        "hidden": { "opacity": 0, "x": -10, "y": 5 },
+        "visible": {
+            "opacity": 1, "x": 0, "y": 0,
+            "transition": {
+                "type": "spring",
+                "stiffness": 350,
+                "damping": 25
+            }
+        }
+    },
+    "popUp": {
+        "initial": { "opacity": 0, "scale": 0.9 },
+        "animate": { "opacity": 1, "scale": 1 },
+        "exit": { "opacity": 0, "scale": 0.9 },
+        "transition": { "duration": 0.2, "ease": [0.23, 1, 0.32, 1] }
+    }
+};