@oscarpalmer/atoms 0.191.0 → 0.192.0

package/dist/color/misc/format.mjs

@@ -1,16 +1,16 @@
-import "../constants.mjs";
+import { COLOR_TYPE } from "../constants.mjs";
 import { getColorFromState } from "./state.mjs";
 //#region src/color/misc/format.ts
 function formatHslColor(state, alpha) {
-	const { hue, lightness, saturation } = getColorFromState(state, "hsl");
+	const { hue, lightness, saturation } = getColorFromState(state, COLOR_TYPE.hsl);
 	return `hsl(${hue}deg ${saturation}% ${lightness}%${getSuffix(state, alpha)})`;
 }
 function formatHwbColor(state, alpha) {
-	const { blackness, hue, whiteness } = getColorFromState(state, "hwb");
+	const { blackness, hue, whiteness } = getColorFromState(state, COLOR_TYPE.hwb);
 	return `hwb(${hue}deg ${whiteness}% ${blackness}%${getSuffix(state, alpha)})`;
 }
 function formatRgbColor(state, alpha) {
-	const { blue, green, red } = getColorFromState(state, "rgb");
+	const { blue, green, red } = getColorFromState(state, COLOR_TYPE.rgb);
 	return `rgb(${red} ${green} ${blue}${getSuffix(state, alpha)})`;
 }
 function getSuffix(state, alpha) {

package/dist/color/misc/get.mjs

@@ -1,5 +1,5 @@
 import { clamp } from "../../internal/number.mjs";
-import { HEX_BLACK, HEX_WHITE, SRGB_LUMINANCE_EXPONENT, SRGB_LUMINANCE_MODIFIER, SRGB_LUMINANCE_MULTIPLIER, SRGB_LUMINANCE_OFFSET } from "../constants.mjs";
+import { COLOR_DEFAULTS, COLOR_MAX, COLOR_SRGB, COLOR_TYPE } from "../constants.mjs";
 import { round } from "../../internal/math/misc.mjs";
 import { getColorFromState, getColorState } from "./state.mjs";
 import { color } from "../instance.mjs";
@@ -8,19 +8,19 @@ function getClampedValue(value, minimum, maximum, rounding) {
 	return typeof value === "number" && !Number.isNaN(value) ? clamp(rounding ?? false ? round(value) : value, minimum, maximum) : minimum;
 }
 function getForegroundColor(value, hex) {
-	const { blue, green, red } = getColorFromState(getColorState(value), "rgb");
+	const { blue, green, red } = getColorFromState(getColorState(value), COLOR_TYPE.rgb);
 	const values = [
-		blue / 255,
-		green / 255,
-		red / 255
+		blue / COLOR_MAX.hex,
+		green / COLOR_MAX.hex,
+		red / COLOR_MAX.hex
 	];
 	const { length } = values;
 	for (let index = 0; index < length; index += 1) {
 		const color = values[index];
-		if (color <= .03928) values[index] /= SRGB_LUMINANCE_MULTIPLIER;
-		else values[index] = ((color + SRGB_LUMINANCE_OFFSET) / SRGB_LUMINANCE_MODIFIER) ** SRGB_LUMINANCE_EXPONENT;
+		if (color <= COLOR_SRGB.luminanceMinimum) values[index] /= COLOR_SRGB.luminanceMultiplier;
+		else values[index] = ((color + COLOR_SRGB.luminanceOffset) / COLOR_SRGB.luminanceModifier) ** COLOR_SRGB.luminanceExponent;
 	}
-	const foreground = .2126 * values[2] + .7152 * values[1] + .0722 * values[0] > .625 ? HEX_BLACK : HEX_WHITE;
+	const foreground = COLOR_SRGB.luminanceRed * values[2] + COLOR_SRGB.luminanceGreen * values[1] + COLOR_SRGB.luminanceBlue * values[0] > COLOR_SRGB.luminanceThreshold ? COLOR_DEFAULTS.hexBlack : COLOR_DEFAULTS.hexWhite;
 	return hex === true ? foreground : color(foreground);
 }
 /**
@@ -46,13 +46,13 @@ function getHexaColor(value) {
 * @returns Hex color string
 */
 function getHexColor(value) {
-	return getColorFromState(getColorState(value), "hex");
+	return getColorFromState(getColorState(value), COLOR_TYPE.hex);
 }
 function getHexValue(value) {
-	return getClampedValue(value, 0, 255, true);
+	return getClampedValue(value, 0, COLOR_MAX.hex, true);
 }
 function getDegrees(value) {
-	return getClampedValue(value, 0, 360);
+	return getClampedValue(value, 0, COLOR_MAX.degree);
 }
 /**
 * Get the _HSLA_ color from any kind of value
@@ -66,7 +66,7 @@ function getDegrees(value) {
 function getHslaColor(value) {
 	const state = getColorState(value);
 	return {
-		...getColorFromState(state, "hsl"),
+		...getColorFromState(state, COLOR_TYPE.hsl),
 		alpha: state.alpha.value
 	};
 }
@@ -80,7 +80,7 @@ function getHslaColor(value) {
 * @returns _HWB_ color
 */
 function getHwbColor(value) {
-	return getColorFromState(getColorState(value), "hwb");
+	return getColorFromState(getColorState(value), COLOR_TYPE.hwb);
 }
 /**
 * Get the _HWBA_ color from any kind of value
@@ -94,7 +94,7 @@ function getHwbColor(value) {
 function getHwbaColor(value) {
 	const state = getColorState(value);
 	return {
-		...getColorFromState(state, "hwb"),
+		...getColorFromState(state, COLOR_TYPE.hwb),
 		alpha: state.alpha.value
 	};
 }
@@ -108,10 +108,10 @@ function getHwbaColor(value) {
 * @returns _HSL_ color
 */
 function getHslColor(value) {
-	return getColorFromState(getColorState(value), "hsl");
+	return getColorFromState(getColorState(value), COLOR_TYPE.hsl);
 }
 function getPercentage(value) {
-	return getClampedValue(value, 0, 100);
+	return getClampedValue(value, 0, COLOR_MAX.percent);
 }
 /**
 * Get the _RGBA_ color from any kind of value
@@ -125,7 +125,7 @@ function getPercentage(value) {
 function getRgbaColor(value) {
 	const state = getColorState(value);
 	return {
-		...getColorFromState(state, "rgb"),
+		...getColorFromState(state, COLOR_TYPE.rgb),
 		alpha: state.alpha.value
 	};
 }
@@ -139,7 +139,7 @@ function getRgbaColor(value) {
 * @returns _RGB_ color
 */
 function getRgbColor(value) {
-	return getColorFromState(getColorState(value), "rgb");
+	return getColorFromState(getColorState(value), COLOR_TYPE.rgb);
 }
 //#endregion
 export { getDegrees, getForegroundColor, getHexColor, getHexValue, getHexaColor, getHslColor, getHslaColor, getHwbColor, getHwbaColor, getPercentage, getRgbColor, getRgbaColor };

package/dist/color/misc/is.mjs

@@ -1,14 +1,15 @@
+import { isPlainObject } from "../../internal/is.mjs";
 import { between } from "../../internal/number.mjs";
-import { EXPRESSION_HEX_LONG, EXPRESSION_HEX_SHORT, EXPRESSION_PREFIX, KEYS_HSL, KEYS_HSLA, KEYS_HWB, KEYS_HWBA, KEYS_RGB, KEYS_RGBA } from "../constants.mjs";
+import { COLOR_ALPHA, COLOR_EXPRESSION, COLOR_KEYS, COLOR_LENGTHS, COLOR_MAX, COLOR_PROPERTY } from "../constants.mjs";
 //#region src/color/misc/is.ts
 function hasKeys(value, keys) {
 	return typeof value === "object" && value !== null && keys.every((key) => key in value);
 }
 function isAlpha(value) {
-	return typeof value === "number" && between(value, 0, 100);
+	return typeof value === "number" && between(value, COLOR_ALPHA.noneValue, COLOR_MAX.percent);
 }
 function isBytey(value) {
-	return typeof value === "number" && between(value, 0, 255);
+	return typeof value === "number" && between(value, 0, COLOR_MAX.hex);
 }
 /**
 * Is the value a _Color_?
@@ -17,7 +18,7 @@ function isBytey(value) {
 * @returns `true` if the value is a _Color_, otherwise `false`
 */
 function isColor(value) {
-	return typeof value === "object" && value !== null && "$color" in value && value["$color"] === true;
+	return isPlainObject(value) && COLOR_PROPERTY.name in value && value[COLOR_PROPERTY.name] === true;
 }
 function isColorValue(obj, properties) {
 	if (typeof obj !== "object" || obj === null) return false;
@@ -31,7 +32,7 @@ function isColorValue(obj, properties) {
 	return true;
 }
 function isDegree(value) {
-	return typeof value === "number" && between(value, 0, 360);
+	return typeof value === "number" && between(value, 0, COLOR_MAX.degree);
 }
 /**
 * Is the value a hex color?
@@ -51,10 +52,10 @@ function isDegree(value) {
 */
 function isHexColor(value, alpha) {
 	if (typeof value !== "string") return false;
-	if (!(EXPRESSION_HEX_SHORT.test(value) || EXPRESSION_HEX_LONG.test(value))) return false;
+	if (!(COLOR_EXPRESSION.hexShort.test(value) || COLOR_EXPRESSION.hexLong.test(value))) return false;
 	if (alpha === false) {
-		const unprefixed = value.replace(EXPRESSION_PREFIX, "");
-		return unprefixed.length === 3 || unprefixed.length === 6;
+		const unprefixed = value.replace(COLOR_EXPRESSION.prefix, "");
+		return unprefixed.length === COLOR_LENGTHS.hexShort || unprefixed.length === COLOR_LENGTHS.hexLong;
 	}
 	return true;
 }
@@ -65,10 +66,10 @@ function isHexColor(value, alpha) {
 * @returns `true` if the value is an _HSLA_ color, otherwise `false`
 */
 function isHslaColor(value) {
-	return isColorValue(value, KEYS_HSLA);
+	return isColorValue(value, COLOR_KEYS.hsla);
 }
 function isHslaLike(value) {
-	return hasKeys(value, KEYS_HSLA);
+	return hasKeys(value, COLOR_KEYS.hsla);
 }
 /**
 * Is the value an _HSL_ color?
@@ -77,10 +78,10 @@ function isHslaLike(value) {
 * @returns `true` if the value is an _HSL_ color, otherwise `false`
 */
 function isHslColor(value) {
-	return isColorValue(value, KEYS_HSLA) || isColorValue(value, KEYS_HSL);
+	return isColorValue(value, COLOR_KEYS.hsla) || isColorValue(value, COLOR_KEYS.hsl);
 }
 function isHslLike(value) {
-	return hasKeys(value, KEYS_HSL);
+	return hasKeys(value, COLOR_KEYS.hsl);
 }
 /**
 * Is the value an _HWBA_ color?
@@ -89,10 +90,10 @@ function isHslLike(value) {
 * @returns `true` if the value is an _HWBA_ color, otherwise `false`
 */
 function isHwbaColor(value) {
-	return isColorValue(value, KEYS_HWBA);
+	return isColorValue(value, COLOR_KEYS.hwba);
 }
 function isHwbaLike(value) {
-	return hasKeys(value, KEYS_HWBA);
+	return hasKeys(value, COLOR_KEYS.hwba);
 }
 /**
 * Is the value an _HWB_ color?
@@ -101,10 +102,10 @@ function isHwbaLike(value) {
 * @returns `true` if the value is an _HWB_ color, otherwise `false`
 */
 function isHwbColor(value) {
-	return isColorValue(value, KEYS_HWB) || isColorValue(value, KEYS_HWBA);
+	return isColorValue(value, COLOR_KEYS.hwb) || isColorValue(value, COLOR_KEYS.hwba);
 }
 function isHwbLike(value) {
-	return hasKeys(value, KEYS_HWB);
+	return hasKeys(value, COLOR_KEYS.hwb);
 }
 /**
 * Is the value an _RGBA_ color?
@@ -113,10 +114,10 @@ function isHwbLike(value) {
 * @returns `true` if the value is an _RGBA_ color, otherwise `false`
 */
 function isRgbaColor(value) {
-	return isColorValue(value, KEYS_RGBA);
+	return isColorValue(value, COLOR_KEYS.rgba);
 }
 function isRgbaLike(value) {
-	return hasKeys(value, KEYS_RGBA);
+	return hasKeys(value, COLOR_KEYS.rgba);
 }
 /**
 * Is the value an _RGB_ color?
@@ -125,13 +126,13 @@ function isRgbaLike(value) {
 * @returns `true` if the value is an _RGB_ color, otherwise `false`
 */
 function isRgbColor(value) {
-	return isColorValue(value, KEYS_RGBA) || isColorValue(value, KEYS_RGB);
+	return isColorValue(value, COLOR_KEYS.rgba) || isColorValue(value, COLOR_KEYS.rgb);
 }
 function isRgbLike(value) {
-	return hasKeys(value, KEYS_RGB);
+	return hasKeys(value, COLOR_KEYS.rgb);
 }
 function isPercentage(value) {
-	return typeof value === "number" && between(value, 0, 100);
+	return typeof value === "number" && between(value, 0, COLOR_MAX.percent);
 }
 const validators = {
 	alpha: isAlpha,

package/dist/color/misc/state.d.mts

@@ -1,10 +1,11 @@
-import { ColorState, ColorType } from "../models.mjs";
+import { Subscriptions } from "../../internal/subscription.mjs";
+import { Color, ColorState, ColorType } from "../models.mjs";
 //#region src/color/misc/state.d.ts
 declare function getColorFromState<Type extends ColorType>(state: ColorState, type: Type): NonNullable<ColorState[Type]>;
 declare function getColorState(value: unknown): ColorState;
-declare function setHexColor(state: ColorState, value: string, alpha: boolean): void;
-declare function setHSLColor(state: ColorState, value: unknown, alpha: boolean): void;
-declare function setHWBColor(state: ColorState, value: unknown, alpha: boolean): void;
-declare function setRGBColor(state: ColorState, value: unknown, alpha: boolean): void;
+declare function setHexColor(color: Color, state: ColorState, subscriptions: Subscriptions<Function>, value: string, alpha: boolean): void;
+declare function setHSLColor(color: Color, state: ColorState, subscriptions: Subscriptions<Function>, value: unknown, alpha: boolean): void;
+declare function setHWBColor(color: Color, state: ColorState, subscriptions: Subscriptions<Function>, value: unknown, alpha: boolean): void;
+declare function setRGBColor(color: Color, state: ColorState, subscriptions: Subscriptions<Function>, value: unknown, alpha: boolean): void;
 //#endregion
 export { getColorFromState, getColorState, setHSLColor, setHWBColor, setHexColor, setRGBColor };

package/dist/color/misc/state.mjs

@@ -1,4 +1,4 @@
-import { DEFAULT_HSL, DEFAULT_HWB, DEFAULT_RGB, HEX_BLACK, KEYS_HSL, KEYS_HWB, KEYS_RGB } from "../constants.mjs";
+import { COLOR_DEFAULTS, COLOR_KEYS, COLOR_LENGTHS, COLOR_MAX, COLOR_TYPE } from "../constants.mjs";
 import { getAlpha } from "./alpha.mjs";
 import { getDegrees, getHexValue, getPercentage } from "./get.mjs";
 import { isColor, isHexColor, isHslLike, isHwbLike, isRgbLike } from "./is.mjs";
@@ -27,15 +27,15 @@ function getColorState(value) {
 			alpha: getAlpha(value.alpha, false),
 			origin: void 0
 		};
-		if (KEYS_HSL.every((key) => key in value)) {
+		if (COLOR_KEYS.hsl.every((key) => key in value)) {
 			state.hsl = getHslValue(value);
-			state.origin = "hsl";
-		} else if (KEYS_HWB.every((key) => key in value)) {
+			state.origin = COLOR_TYPE.hsl;
+		} else if (COLOR_KEYS.hwb.every((key) => key in value)) {
 			state.hwb = getHwbValue(value);
-			state.origin = "hwb";
-		} else if (KEYS_RGB.every((key) => key in value)) {
+			state.origin = COLOR_TYPE.hwb;
+		} else if (COLOR_KEYS.rgb.every((key) => key in value)) {
 			state.rgb = getRgbValue(value);
-			state.origin = "rgb";
+			state.origin = COLOR_TYPE.rgb;
 		}
 		if (state.origin != null) return state;
 	}
@@ -44,54 +44,59 @@ function getColorState(value) {
 function getColorStateForHex(value) {
 	const normalized = getNormalizedHex(value, true);
 	return {
-		hex: normalized.slice(0, 6),
-		alpha: getAlpha(normalized.slice(6), true),
-		origin: "hex"
+		hex: normalized.slice(0, COLOR_LENGTHS.hexLong),
+		alpha: getAlpha(normalized.slice(COLOR_LENGTHS.hexLong), true),
+		origin: COLOR_TYPE.hex
 	};
 }
 function getDefaultColorState() {
 	return {
-		alpha: getAlpha(100, false),
-		hex: HEX_BLACK,
-		hsl: { ...DEFAULT_HSL },
-		hwb: { ...DEFAULT_HWB },
-		rgb: { ...DEFAULT_RGB },
-		origin: "hex"
+		alpha: getAlpha(COLOR_MAX.percent, false),
+		hex: COLOR_DEFAULTS.hexBlack,
+		hsl: { ...COLOR_DEFAULTS.hsl },
+		hwb: { ...COLOR_DEFAULTS.hwb },
+		rgb: { ...COLOR_DEFAULTS.rgb },
+		origin: COLOR_TYPE.hex
 	};
 }
-function setColorValue(state, type, value, alpha) {
+function setColorValue(color, state, subscriptions, type, value, alpha) {
 	state.hex = void 0;
 	state.hsl = void 0;
 	state.hwb = void 0;
 	state.rgb = void 0;
 	state.origin = type;
 	state[type] = value;
-	if (alpha != null) state.alpha = getAlpha(alpha, type === "hex");
+	if (alpha != null) state.alpha = getAlpha(alpha, type === COLOR_TYPE.hex);
+	for (const type of COLOR_TYPE.all) {
+		const callbacks = subscriptions.values.to.keyed?.get(type);
+		if (callbacks != null) for (const callback of callbacks.values()) callback(color[type]);
+	}
+	for (const callback of subscriptions.values.to.any.values()) callback(color);
 }
-function setHexColor(state, value, alpha) {
+function setHexColor(color, state, subscriptions, value, alpha) {
 	if (!isHexColor(value) || !alpha && value === state.hex) return;
 	const normalized = getNormalizedHex(value, true);
-	setColorValue(state, "hex", normalized.slice(0, 6), alpha ? normalized.slice(6) : void 0);
+	setColorValue(color, state, subscriptions, COLOR_TYPE.hex, normalized.slice(0, COLOR_LENGTHS.hexLong), alpha ? normalized.slice(COLOR_LENGTHS.hexLong) : void 0);
 }
-function setHSLColor(state, value, alpha) {
+function setHSLColor(color, state, subscriptions, value, alpha) {
 	if (!isHslLike(value)) return;
-	setColorValue(state, "hsl", {
+	setColorValue(color, state, subscriptions, COLOR_TYPE.hsl, {
 		hue: getDegrees(value.hue),
 		saturation: getPercentage(value.saturation),
 		lightness: getPercentage(value.lightness)
 	}, alpha ? value.alpha : void 0);
 }
-function setHWBColor(state, value, alpha) {
+function setHWBColor(color, state, subscriptions, value, alpha) {
 	if (!isHwbLike(value)) return;
-	setColorValue(state, "hwb", {
+	setColorValue(color, state, subscriptions, COLOR_TYPE.hwb, {
 		hue: getDegrees(value.hue),
 		whiteness: getPercentage(value.whiteness),
 		blackness: getPercentage(value.blackness)
 	}, alpha ? value.alpha : void 0);
 }
-function setRGBColor(state, value, alpha) {
+function setRGBColor(color, state, subscriptions, value, alpha) {
 	if (!isRgbLike(value)) return;
-	setColorValue(state, "rgb", {
+	setColorValue(color, state, subscriptions, COLOR_TYPE.rgb, {
 		red: getHexValue(value.red),
 		green: getHexValue(value.green),
 		blue: getHexValue(value.blue)

package/dist/color/models.d.mts

@@ -1,3 +1,5 @@
+import { Subscription } from "../internal/subscription.mjs";
+import { COLOR_ALPHA, COLOR_TYPE } from "./constants.mjs";
 //#region src/color/models.d.ts
 type Alpha = {
   hex: string;
@@ -131,6 +133,75 @@ type Color = {
    * @param value New _RGBA_ color
    */
   set rgba(value: RGBAColor);
+  /**
+   * Subscribe to alpha channel _(opacity)_ changes of the color
+   *
+   * @param key Color property to subscribe to
+   * @param callback Callback function for changes
+   */
+  subscribe(key: 'alpha', callback: (value: number) => void): Subscription;
+  /**
+   * Subscribe to hex color changes of the color
+   *
+   * @param key Color type to subscribe to
+   * @param callback Callback function for changes
+   */
+  subscribe(key: typeof COLOR_TYPE.hex, callback: (value: string) => void): Subscription;
+  /**
+   * Subscribe to hex color changes of the color with alpha channel _(opacity)_
+   *
+   * @param key Color type to subscribe to
+   * @param callback Callback function for changes
+   */
+  subscribe(key: typeof COLOR_TYPE.hexa, callback: (value: string) => void): Subscription;
+  /**
+   * Subscribe to _HSL_ color changes of the color
+   *
+   * @param key Color type to subscribe to
+   * @param callback Callback function for changes
+   */
+  subscribe(key: typeof COLOR_TYPE.hsl, callback: (value: HSLColor) => void): Subscription;
+  /**
+   * Subscribe to _HSL(A)_ color changes of the color
+   *
+   * @param key Color type to subscribe to
+   * @param callback Callback function for changes
+   */
+  subscribe(key: typeof COLOR_TYPE.hsla, callback: (value: HSLAColor) => void): Subscription;
+  /**
+   * Subscribe to _HWB_ color changes of the color
+   *
+   * @param key Color type to subscribe to
+   * @param callback Callback function for changes
+   */
+  subscribe(key: typeof COLOR_TYPE.hwb, callback: (value: HWBColor) => void): Subscription;
+  /**
+   * Subscribe to _HWB(A)_ color changes of the color
+   *
+   * @param key Color type to subscribe to
+   * @param callback Callback function for changes
+   */
+  subscribe(key: typeof COLOR_TYPE.hwba, callback: (value: HWBAColor) => void): Subscription;
+  /**
+   * Subscribe to _RGB_ color changes of the color
+   *
+   * @param key Color type to subscribe to
+   * @param callback Callback function for changes
+   */
+  subscribe(key: typeof COLOR_TYPE.rgb, callback: (value: RGBColor) => void): Subscription;
+  /**
+   * Subscribe to _RGBA_ color changes of the color
+   *
+   * @param key Color type to subscribe to
+   * @param callback Callback function for changes
+   */
+  subscribe(key: typeof COLOR_TYPE.rgba, callback: (value: RGBAColor) => void): Subscription;
+  /**
+   * Subscribe to any color changes of the color
+   *
+   * @param callback Callback function for changes
+   */
+  subscribe(callback: (value: Color) => void): Subscription;
   /**
    * Get the color as a hex string
    *
@@ -165,6 +236,12 @@ type Color = {
    * @returns Hex color string
    */
   toString(): string;
+  /**
+   * Unsubscribe from all color changes of the color
+   *
+   * _(To unsubscribe from a specific color change, use the `unsubscribe()` method on the `Subscription` returned by the individual `subscribe()` method)_
+   */
+  unsubscribe(): void;
 };
 type ColorWithAlpha = {
   /**
@@ -229,7 +306,7 @@ type RGBColor = {
    */
   red: number;
 };
-type ColorProperty = 'alpha' | keyof HSLColor | keyof HWBColor | keyof RGBColor;
+type ColorProperty = typeof COLOR_ALPHA.name | keyof HSLColor | keyof HWBColor | keyof RGBColor;
 type ColorState = {
   alpha: Alpha;
   hex?: string;

package/dist/color/space/hex.mjs

@@ -1,17 +1,17 @@
 import { join } from "../../internal/string.mjs";
-import { ALPHA_FULL_HEX_LONG, EXPRESSION_HEX_LONG, EXPRESSION_PREFIX, HEX_BLACK } from "../constants.mjs";
+import { COLOR_ALPHA, COLOR_DEFAULTS, COLOR_EXPRESSION, COLOR_LENGTHS, COLOR_MAX, COLOR_TYPE } from "../constants.mjs";
 import { getHexValue, getPercentage } from "../misc/get.mjs";
 import { isHexColor } from "../misc/is.mjs";
 import { convertRgbToHsla, convertRgbToHwba } from "./rgb.mjs";
 //#region src/color/space/hex.ts
 function convertHexToRgba(value) {
 	const normalized = getNormalizedHex(value, true);
-	const pairs = EXPRESSION_HEX_LONG.exec(normalized);
+	const pairs = COLOR_EXPRESSION.hexLong.exec(normalized);
 	const values = [];
 	const { length } = pairs;
 	for (let index = 1; index < length; index += 1) values.push(Number.parseInt(pairs[index], 16));
 	return {
-		alpha: getPercentage(values[3] / 255 * 100),
+		alpha: getPercentage(values[3] / COLOR_MAX.hex * 100),
 		blue: getHexValue(values[2]),
 		green: getHexValue(values[1]),
 		red: getHexValue(values[0])
@@ -19,13 +19,13 @@ function convertHexToRgba(value) {
 }
 function getColorFromHex(state, type) {
 	switch (type) {
-		case "hsl":
+		case COLOR_TYPE.hsl:
 			state.hsl ??= hexToHsl(state.hex);
 			break;
-		case "hwb":
+		case COLOR_TYPE.hwb:
 			state.hwb ??= hexToHwb(state.hex);
 			break;
-		case "rgb": state.rgb ??= hexToRgb(state.hex);
+		case COLOR_TYPE.rgb: state.rgb ??= hexToRgb(state.hex);
 	}
 	return state[type];
 }
@@ -40,14 +40,14 @@ function getColorFromHex(state, type) {
 */
 function getNormalizedHex(value, alpha) {
 	const includeAlpha = alpha ?? false;
-	if (!isHexColor(value)) return `${HEX_BLACK}${includeAlpha ? ALPHA_FULL_HEX_LONG : ""}`;
-	const normalized = value.replace(EXPRESSION_PREFIX, "");
-	if (normalized.length < 6) {
-		const hex = normalized.slice(0, 3);
-		const a = includeAlpha ? normalized[3] ?? "f" : "";
+	if (!isHexColor(value)) return `${COLOR_DEFAULTS.hexBlack}${includeAlpha ? COLOR_ALPHA.fullHexLong : ""}`;
+	const normalized = value.replace(COLOR_EXPRESSION.prefix, "");
+	if (normalized.length < COLOR_LENGTHS.hexLong) {
+		const hex = normalized.slice(0, COLOR_LENGTHS.hexShort);
+		const a = includeAlpha ? normalized[COLOR_LENGTHS.hexShort] ?? COLOR_ALPHA.fullHexShort : "";
 		return join(`${hex}${a}`.split("").map((character) => character.repeat(2)));
 	}
-	return `${normalized.slice(0, 6)}${includeAlpha ? normalized.slice(6) || ALPHA_FULL_HEX_LONG : ""}`;
+	return `${normalized.slice(0, COLOR_LENGTHS.hexLong)}${includeAlpha ? normalized.slice(COLOR_LENGTHS.hexLong) || COLOR_ALPHA.fullHexLong : ""}`;
 }
 /**
 * Convert a hex color string to a _HSL_ color

package/dist/color/space/hsl.mjs

@@ -1,31 +1,31 @@
-import { DEFAULT_HSL } from "../constants.mjs";
+import { COLOR_DEFAULTS, COLOR_MAX, COLOR_TYPE } from "../constants.mjs";
 import { getAlphaValue } from "../misc/alpha.mjs";
 import { getDegrees, getHexValue, getPercentage } from "../misc/get.mjs";
 import { isHslLike } from "../misc/is.mjs";
 import { convertRgbToHex } from "./rgb.mjs";
 //#region src/color/space/hsl.ts
 function convertHslToHwba(input) {
-	let { hue, lightness, saturation } = isHslLike(input) ? getHslValue(input) : { ...DEFAULT_HSL };
-	lightness /= 100;
-	saturation /= 100;
+	let { hue, lightness, saturation } = isHslLike(input) ? getHslValue(input) : { ...COLOR_DEFAULTS.hsl };
+	lightness /= COLOR_MAX.percent;
+	saturation /= COLOR_MAX.percent;
 	const value = lightness + saturation * Math.min(lightness, 1 - lightness);
 	if (value === 0) saturation = 0;
 	else saturation = 2 * (1 - lightness / value);
 	const blackness = 1 - value;
 	return {
 		hue,
-		whiteness: (1 - saturation) * value * 100,
-		blackness: blackness * 100,
-		alpha: getAlphaValue(input?.alpha ?? 100)
+		whiteness: (1 - saturation) * value * COLOR_MAX.percent,
+		blackness: blackness * COLOR_MAX.percent,
+		alpha: getAlphaValue(input?.alpha ?? COLOR_MAX.percent)
 	};
 }
 function convertHslToRgba(input) {
-	const hsl = isHslLike(input) ? getHslValue(input) : { ...DEFAULT_HSL };
-	const hue = hsl.hue % 360;
-	const saturation = hsl.saturation / 100;
-	const lightness = hsl.lightness / 100;
+	const hsl = isHslLike(input) ? getHslValue(input) : { ...COLOR_DEFAULTS.hsl };
+	const hue = hsl.hue % COLOR_MAX.degree;
+	const saturation = hsl.saturation / COLOR_MAX.percent;
+	const lightness = hsl.lightness / COLOR_MAX.percent;
 	return {
-		alpha: getAlphaValue(input?.alpha ?? 100),
+		alpha: getAlphaValue(input?.alpha ?? COLOR_MAX.percent),
 		blue: getHexValue(getHexyValue(hue, lightness, saturation, 4)),
 		green: getHexValue(getHexyValue(hue, lightness, saturation, 8)),
 		red: getHexValue(getHexyValue(hue, lightness, saturation, 0))
@@ -33,19 +33,19 @@ function convertHslToRgba(input) {
 }
 function getColorFromHsl(state, type) {
 	switch (type) {
-		case "hex":
+		case COLOR_TYPE.hex:
 			state.hex = hslToHex(state.hsl);
 			break;
-		case "hwb":
+		case COLOR_TYPE.hwb:
 			state.hwb = hslToHwb(state.hsl);
 			break;
-		case "rgb": state.rgb = hslToRgb(state.hsl);
+		case COLOR_TYPE.rgb: state.rgb = hslToRgb(state.hsl);
 	}
 	return state[type];
 }
 function getHexyValue(hue, lightness, saturation, value) {
 	const part = (value + hue / 30) % 12;
-	return (lightness - saturation * Math.min(lightness, 1 - lightness) * Math.max(-1, Math.min(part - 3, 9 - part, 1))) * 255;
+	return (lightness - saturation * Math.min(lightness, 1 - lightness) * Math.max(-1, Math.min(part - 3, 9 - part, 1))) * COLOR_MAX.hex;
 }
 function getHslValue(value) {
 	return {

package/dist/color/space/hwb.mjs

@@ -1,4 +1,4 @@
-import { DEFAULT_HWB } from "../constants.mjs";
+import { COLOR_DEFAULTS, COLOR_MAX, COLOR_TYPE } from "../constants.mjs";
 import { getAlphaValue } from "../misc/alpha.mjs";
 import { getDegrees, getPercentage } from "../misc/get.mjs";
 import { isHwbLike } from "../misc/is.mjs";
@@ -6,9 +6,9 @@ import { rgbToHex } from "./rgb.mjs";
 import { hslToRgb, hslToRgba } from "./hsl.mjs";
 //#region src/color/space/hwb.ts
 function convertHwbToHsl(input) {
-	let { blackness, hue, whiteness } = isHwbLike(input) ? getHwbValue(input) : DEFAULT_HWB;
-	blackness /= 100;
-	whiteness /= 100;
+	let { blackness, hue, whiteness } = isHwbLike(input) ? getHwbValue(input) : COLOR_DEFAULTS.hwb;
+	blackness /= COLOR_MAX.percent;
+	whiteness /= COLOR_MAX.percent;
 	if (blackness + whiteness > 1) {
 		const total = blackness + whiteness;
 		blackness /= total;
@@ -17,20 +17,20 @@ function convertHwbToHsl(input) {
 	const lightness = (1 - blackness + whiteness) / 2;
 	return {
 		hue,
-		saturation: getHwbSaturation(blackness, whiteness, lightness) * 100,
-		lightness: lightness * 100,
-		alpha: getAlphaValue(input?.alpha ?? 100)
+		saturation: getHwbSaturation(blackness, whiteness, lightness) * COLOR_MAX.percent,
+		lightness: lightness * COLOR_MAX.percent,
+		alpha: getAlphaValue(input?.alpha ?? COLOR_MAX.percent)
 	};
 }
 function getColorFromHwb(state, type) {
 	switch (type) {
-		case "hex":
+		case COLOR_TYPE.hex:
 			state.hex = hwbToHex(state.hwb);
 			break;
-		case "hsl":
+		case COLOR_TYPE.hsl:
 			state.hsl = hwbToHsl(state.hwb);
 			break;
-		case "rgb": state.rgb = hwbToRgb(state.hwb);
+		case COLOR_TYPE.rgb: state.rgb = hwbToRgb(state.hwb);
 	}
 	return state[type];
 }