@oscarpalmer/atoms 0.190.0 → 0.192.0

package/dist/color/misc/state.mjs

@@ -1,121 +1,112 @@
-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";
-import { getRgbValue, rgbToHex, rgbToHsl, rgbToHwb } from "../space/rgb.mjs";
-import { getNormalizedHex, hexToHsl } from "../space/hex.mjs";
-import { getHslValue, hslToHex, hslToHwb, hslToRgb } from "../space/hsl.mjs";
-import { getHwbValue, hwbToHex, hwbToHsl, hwbToRgb } from "../space/hwb.mjs";
+import { getColorFromRgb, getRgbValue } from "../space/rgb.mjs";
+import { getColorFromHex, getNormalizedHex } from "../space/hex.mjs";
+import { getColorFromHsl, getHslValue } from "../space/hsl.mjs";
+import { getColorFromHwb, getHwbValue } from "../space/hwb.mjs";
 //#region src/color/misc/state.ts
+function getColorFromState(state, type) {
+	const { origin } = state;
+	if (type === origin) return state[origin];
+	return state[type] ?? getters[origin](state, type);
+}
 function getColorState(value) {
 	if (typeof value === "string") return getColorStateForHex(value);
-	if (isColor(value)) return {
-		hex: value.hex,
-		hsl: value.hsl,
-		hwb: value.hwb,
-		rgb: value.rgb,
-		alpha: getAlpha(value.alpha)
-	};
-	const state = {};
+	if (isColor(value)) {
+		const { origin } = value;
+		return {
+			origin,
+			[origin]: value[origin],
+			alpha: getAlpha(value.alpha, false)
+		};
+	}
 	if (typeof value === "object" && value !== null) {
-		state.alpha = getAlpha(value.alpha);
-		if (KEYS_HSL.every((key) => key in value)) return getColorStateForHsl(state, value);
-		if (KEYS_HWB.every((key) => key in value)) return getColorStateForHwb(state, value);
-		if (KEYS_RGB.every((key) => key in value)) return getColorStateForRgb(state, value);
+		const state = {
+			alpha: getAlpha(value.alpha, false),
+			origin: void 0
+		};
+		if (COLOR_KEYS.hsl.every((key) => key in value)) {
+			state.hsl = getHslValue(value);
+			state.origin = COLOR_TYPE.hsl;
+		} else if (COLOR_KEYS.hwb.every((key) => key in value)) {
+			state.hwb = getHwbValue(value);
+			state.origin = COLOR_TYPE.hwb;
+		} else if (COLOR_KEYS.rgb.every((key) => key in value)) {
+			state.rgb = getRgbValue(value);
+			state.origin = COLOR_TYPE.rgb;
+		}
+		if (state.origin != null) return state;
 	}
-	return getDefaultColorState(state);
+	return getDefaultColorState();
 }
 function getColorStateForHex(value) {
 	const normalized = getNormalizedHex(value, true);
-	const hex = normalized.slice(0, 6);
-	const hsl = hexToHsl(hex);
 	return {
-		hex,
-		hsl,
-		alpha: getAlpha(normalized.slice(6)),
-		hwb: hslToHwb(hsl),
-		rgb: hslToRgb(hsl)
+		hex: normalized.slice(0, COLOR_LENGTHS.hexLong),
+		alpha: getAlpha(normalized.slice(COLOR_LENGTHS.hexLong), true),
+		origin: COLOR_TYPE.hex
 	};
 }
-function getColorStateForHsl(state, value) {
-	state.hsl = getHslValue(value);
-	state.rgb = hslToRgb(state.hsl);
-	state.hex = hslToHex(state.hsl);
-	state.hwb = hslToHwb(state.hsl);
-	return state;
-}
-function getColorStateForHwb(state, value) {
-	state.hwb = getHwbValue(value);
-	state.hsl = hwbToHsl(state.hwb);
-	state.rgb = hwbToRgb(state.hwb);
-	state.hex = hwbToHex(state.hwb);
-	return state;
-}
-function getColorStateForRgb(state, value) {
-	state.rgb = getRgbValue(value);
-	state.hex = rgbToHex(state.rgb);
-	state.hsl = rgbToHsl(state.rgb);
-	state.hwb = rgbToHwb(state.rgb);
-	return state;
+function getDefaultColorState() {
+	return {
+		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 getDefaultColorState(state) {
-	state.alpha = getAlpha(100);
-	state.hex = HEX_BLACK;
-	state.hsl = { ...DEFAULT_HSL };
-	state.hwb = { ...DEFAULT_HWB };
-	state.rgb = { ...DEFAULT_RGB };
-	return state;
+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 === 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);
-	const hex = normalized.slice(0, 6);
-	const hsl = hexToHsl(hex);
-	state.hex = hex;
-	state.hsl = hsl;
-	state.rgb = hslToRgb(hsl);
-	state.hwb = hslToHwb(hsl);
-	if (alpha) state.alpha = getAlpha(normalized.slice(6));
+	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;
-	const hsl = {
+	setColorValue(color, state, subscriptions, COLOR_TYPE.hsl, {
 		hue: getDegrees(value.hue),
 		saturation: getPercentage(value.saturation),
 		lightness: getPercentage(value.lightness)
-	};
-	state.hsl = hsl;
-	state.hex = hslToHex(hsl);
-	state.hwb = hslToHwb(hsl);
-	state.rgb = hslToRgb(hsl);
-	if (alpha) state.alpha = getAlpha(value.alpha);
+	}, alpha ? value.alpha : void 0);
 }
-function setHWBColor(state, value, alpha) {
+function setHWBColor(color, state, subscriptions, value, alpha) {
 	if (!isHwbLike(value)) return;
-	const hwb = {
+	setColorValue(color, state, subscriptions, COLOR_TYPE.hwb, {
 		hue: getDegrees(value.hue),
 		whiteness: getPercentage(value.whiteness),
 		blackness: getPercentage(value.blackness)
-	};
-	state.hwb = hwb;
-	state.hex = hwbToHex(hwb);
-	state.hsl = hwbToHsl(hwb);
-	state.rgb = hwbToRgb(hwb);
-	if (alpha) state.alpha = getAlpha(value.alpha);
+	}, alpha ? value.alpha : void 0);
 }
-function setRGBColor(state, value, alpha) {
+function setRGBColor(color, state, subscriptions, value, alpha) {
 	if (!isRgbLike(value)) return;
-	const rgb = {
-		blue: getHexValue(value.blue),
+	setColorValue(color, state, subscriptions, COLOR_TYPE.rgb, {
+		red: getHexValue(value.red),
 		green: getHexValue(value.green),
-		red: getHexValue(value.red)
-	};
-	const hsl = rgbToHsl(rgb);
-	state.hsl = hsl;
-	state.rgb = rgb;
-	state.hex = hslToHex(hsl);
-	state.hwb = hslToHwb(hsl);
-	if (alpha) state.alpha = getAlpha(value.alpha);
+		blue: getHexValue(value.blue)
+	}, alpha ? value.alpha : void 0);
 }
+const getters = {
+	hex: getColorFromHex,
+	hsl: getColorFromHsl,
+	hwb: getColorFromHwb,
+	rgb: getColorFromRgb
+};
 //#endregion
-export { getColorState, setHSLColor, setHWBColor, setHexColor, setRGBColor };
+export { getColorFromState, getColorState, setHSLColor, setHWBColor, setHexColor, setRGBColor };

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;
@@ -101,6 +103,12 @@ type Color = {
    * @param value New _HWBA_ color
    */
   set hwba(value: HWBAColor);
+  /**
+   * Last color format that was set on the color
+   *
+   * @returns Color type
+   */
+  get origin(): ColorType;
   /**
    * Get the color as an _RGB_ color
    *
@@ -125,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
    *
@@ -159,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 = {
   /**
@@ -223,13 +306,30 @@ 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;
-  hsl: HSLColor;
-  hwb: HWBColor;
-  rgb: RGBColor;
+  hex?: string;
+  hsl?: HSLColor;
+  hwb?: HWBColor;
+  origin: ColorType;
+  rgb?: RGBColor;
 };
+/**
+ * Base color types
+ */
+type ColorType = 'hex' | 'hsl' | 'hwb' | 'rgb';
+/**
+ * Extended color types
+ */
+type ColorTypeExtended = ColorType | 'hsla' | 'hwba' | 'rgba';
+/**
+ * Base color values
+ */
+type ColorValue = string | HSLColor | HWBColor | RGBColor;
+/**
+ * Extended color values
+ */
+type ColorValueExtended = ColorValue | HSLAColor | HWBAColor | RGBAColor;
 //#endregion
-export { Alpha, Color, ColorProperty, ColorState, HSLAColor, HSLColor, HWBAColor, HWBColor, RGBAColor, RGBColor };
+export { Alpha, Color, ColorProperty, ColorState, ColorType, ColorTypeExtended, ColorValue, ColorValueExtended, HSLAColor, HSLColor, HWBAColor, HWBColor, RGBAColor, RGBColor };

package/dist/color/space/hex.d.mts

@@ -1,5 +1,6 @@
-import { HSLAColor, HSLColor, HWBAColor, HWBColor, RGBAColor, RGBColor } from "../models.mjs";
+import { ColorState, ColorType, HSLAColor, HSLColor, HWBAColor, HWBColor, RGBAColor, RGBColor } from "../models.mjs";
 //#region src/color/space/hex.d.ts
+declare function getColorFromHex<Type extends ColorType>(state: ColorState, type: Type): NonNullable<ColorState[Type]>;
 /**
  * Get the normalized hex color from a value
  *
@@ -65,4 +66,4 @@ declare function hexToRgb(value: string): RGBColor;
  */
 declare function hexToRgba(value: string): RGBAColor;
 //#endregion
-export { getNormalizedHex, hexToHsl, hexToHsla, hexToHwb, hexToHwba, hexToRgb, hexToRgba };
+export { getColorFromHex, getNormalizedHex, hexToHsl, hexToHsla, hexToHwb, hexToHwba, hexToRgb, hexToRgba };

package/dist/color/space/hex.mjs

@@ -1,22 +1,34 @@
 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])
 	};
 }
+function getColorFromHex(state, type) {
+	switch (type) {
+		case COLOR_TYPE.hsl:
+			state.hsl ??= hexToHsl(state.hex);
+			break;
+		case COLOR_TYPE.hwb:
+			state.hwb ??= hexToHwb(state.hex);
+			break;
+		case COLOR_TYPE.rgb: state.rgb ??= hexToRgb(state.hex);
+	}
+	return state[type];
+}
 /**
 * Get the normalized hex color from a value
 *
@@ -28,14 +40,14 @@ function convertHexToRgba(value) {
 */
 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
@@ -119,4 +131,4 @@ function hexToRgba(value) {
 	return convertHexToRgba(value);
 }
 //#endregion
-export { getNormalizedHex, hexToHsl, hexToHsla, hexToHwb, hexToHwba, hexToRgb, hexToRgba };
+export { getColorFromHex, getNormalizedHex, hexToHsl, hexToHsla, hexToHwb, hexToHwba, hexToRgb, hexToRgba };

package/dist/color/space/hsl.d.mts

@@ -1,5 +1,6 @@
-import { HSLAColor, HSLColor, HWBAColor, HWBColor, RGBAColor, RGBColor } from "../models.mjs";
+import { ColorState, ColorType, HSLAColor, HSLColor, HWBAColor, HWBColor, RGBAColor, RGBColor } from "../models.mjs";
 //#region src/color/space/hsl.d.ts
+declare function getColorFromHsl<Type extends ColorType>(state: ColorState, type: Type): NonNullable<ColorState[Type]>;
 declare function getHslValue(value: Record<keyof HSLColor, unknown>): HSLColor;
 /**
  * Convert an _HSL(A)_ color to a hex color _(with optional alpha channel, i.e., opacity)_
@@ -52,4 +53,4 @@ declare function hslToRgb(hsl: HSLAColor | HSLColor): RGBColor;
  */
 declare function hslToRgba(hsl: HSLAColor | HSLColor): RGBAColor;
 //#endregion
-export { getHslValue, hslToHex, hslToHwb, hslToHwba, hslToRgb, hslToRgba };
+export { getColorFromHsl, getHslValue, hslToHex, hslToHwb, hslToHwba, hslToRgb, hslToRgba };

package/dist/color/space/hsl.mjs

@@ -1,39 +1,51 @@
-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))
 	};
 }
+function getColorFromHsl(state, type) {
+	switch (type) {
+		case COLOR_TYPE.hex:
+			state.hex = hslToHex(state.hsl);
+			break;
+		case COLOR_TYPE.hwb:
+			state.hwb = hslToHwb(state.hsl);
+			break;
+		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 {
@@ -113,4 +125,4 @@ function hslToRgba(hsl) {
 	return convertHslToRgba(hsl);
 }
 //#endregion
-export { getHslValue, hslToHex, hslToHwb, hslToHwba, hslToRgb, hslToRgba };
+export { getColorFromHsl, getHslValue, hslToHex, hslToHwb, hslToHwba, hslToRgb, hslToRgba };

package/dist/color/space/hwb.d.mts

@@ -1,6 +1,7 @@
-import { HSLAColor, HSLColor, HWBAColor, HWBColor, RGBAColor, RGBColor } from "../models.mjs";
+import { ColorState, ColorType, HSLAColor, HSLColor, HWBAColor, HWBColor, RGBAColor, RGBColor } from "../models.mjs";
 //#region src/color/space/hwb.d.ts
 declare function convertHwbToHsl(input: HWBAColor | HWBColor): HSLAColor;
+declare function getColorFromHwb<Type extends ColorType>(state: ColorState, type: Type): NonNullable<ColorState[Type]>;
 declare function getHwbValue(value: Record<keyof HWBColor, unknown>): HWBColor;
 /**
  * Convert an _HWB(A)_ color to a hex color _(with optional alpha channel, i.e., opacity)_
@@ -49,4 +50,4 @@ declare function hwbToRgb(hwb: HWBAColor | HWBColor): RGBColor;
  */
 declare function hwbToRgba(hwb: HWBAColor | HWBColor): RGBAColor;
 //#endregion
-export { convertHwbToHsl, getHwbValue, hwbToHex, hwbToHsl, hwbToHsla, hwbToRgb, hwbToRgba };
+export { convertHwbToHsl, getColorFromHwb, getHwbValue, hwbToHex, hwbToHsl, hwbToHsla, hwbToRgb, hwbToRgba };

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,11 +17,23 @@ 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 COLOR_TYPE.hex:
+			state.hex = hwbToHex(state.hwb);
+			break;
+		case COLOR_TYPE.hsl:
+			state.hsl = hwbToHsl(state.hwb);
+			break;
+		case COLOR_TYPE.rgb: state.rgb = hwbToRgb(state.hwb);
+	}
+	return state[type];
+}
 function getHwbSaturation(blackness, whiteness, lightness) {
 	const hue = 1 - blackness - whiteness;
 	if (hue <= 0) return 0;
@@ -96,4 +108,4 @@ function hwbToRgba(hwb) {
 	return hslToRgba(hwbToHsla(hwb));
 }
 //#endregion
-export { convertHwbToHsl, getHwbValue, hwbToHex, hwbToHsl, hwbToHsla, hwbToRgb, hwbToRgba };
+export { convertHwbToHsl, getColorFromHwb, getHwbValue, hwbToHex, hwbToHsl, hwbToHsla, hwbToRgb, hwbToRgba };

package/dist/color/space/rgb.d.mts

@@ -1,8 +1,9 @@
-import { HSLAColor, HSLColor, HWBAColor, HWBColor, RGBAColor, RGBColor } from "../models.mjs";
+import { ColorState, ColorType, HSLAColor, HSLColor, HWBAColor, HWBColor, RGBAColor, RGBColor } from "../models.mjs";
 //#region src/color/space/rgb.d.ts
 declare function convertRgbToHex(rgb: RGBAColor | RGBColor, alpha: boolean): string;
 declare function convertRgbToHsla(value: unknown): HSLAColor;
 declare function convertRgbToHwba(value: unknown): HWBAColor;
+declare function getColorFromRgb<Type extends ColorType>(state: ColorState, type: Type): NonNullable<ColorState[Type]>;
 declare function getRgbValue(value: Record<keyof RGBColor, unknown>): RGBColor;
 /**
  * Convert an _RGB(A)_ color to a hex color _(with optional alpha channel, i.e., opacity)_
@@ -58,4 +59,4 @@ declare function rgbToHwb(rgb: RGBAColor | RGBColor): HWBColor;
  */
 declare function rgbToHwba(rgb: RGBAColor | RGBColor): HWBAColor;
 //#endregion
-export { convertRgbToHex, convertRgbToHsla, convertRgbToHwba, getRgbValue, rgbToHex, rgbToHsl, rgbToHsla, rgbToHwb, rgbToHwba };
+export { convertRgbToHex, convertRgbToHsla, convertRgbToHwba, getColorFromRgb, getRgbValue, rgbToHex, rgbToHsl, rgbToHsla, rgbToHwb, rgbToHwba };