@sprawlify/primitives 0.0.56 → 0.0.58

package/dist/{color-CIaXnwJx.d.mts → color-Bcy-SLQ1.d.mts}

@@ -19,7 +19,7 @@ interface ColorChannelRange {
 interface ColorType {
   toFormat(format: ColorFormat): ColorType;
   toJSON(): Record<string, number>;
-  toString(format: ColorStringFormat): string;
+  toString(format?: ColorStringFormat): string;
   toHexInt(): number;
   getChannelValue(channel: ColorChannel): number;
   withChannelValue(channel: ColorChannel, value: number): ColorType;
@@ -40,7 +40,7 @@ interface ColorType {
 declare abstract class Color implements ColorType {
   abstract toFormat(format: ColorFormat): ColorType;
   abstract toJSON(): Record<string, number>;
-  abstract toString(format: ColorStringFormat): string;
+  abstract toString(format?: ColorStringFormat): string;
   abstract clone(): ColorType;
   abstract getChannelRange(channel: ColorChannel): ColorChannelRange;
   abstract getFormat(): ColorFormat;

package/dist/{color-_pKYh-E2.d.cts → color-Bj20c2qw.d.cts}

@@ -19,7 +19,7 @@ interface ColorChannelRange {
 interface ColorType {
   toFormat(format: ColorFormat): ColorType;
   toJSON(): Record<string, number>;
-  toString(format: ColorStringFormat): string;
+  toString(format?: ColorStringFormat): string;
   toHexInt(): number;
   getChannelValue(channel: ColorChannel): number;
   withChannelValue(channel: ColorChannel, value: number): ColorType;
@@ -40,7 +40,7 @@ interface ColorType {
 declare abstract class Color implements ColorType {
   abstract toFormat(format: ColorFormat): ColorType;
   abstract toJSON(): Record<string, number>;
-  abstract toString(format: ColorStringFormat): string;
+  abstract toString(format?: ColorStringFormat): string;
   abstract clone(): ColorType;
   abstract getChannelRange(channel: ColorChannel): ColorChannelRange;
   abstract getFormat(): ColorFormat;

package/dist/{color-utils-CLAICiIG.cjs → color-utils-BVq_rh8L.cjs}

@@ -230,7 +230,7 @@ var RGBColor = class RGBColor extends Color {
 		if (match?.[1]) colors = match[1].split(",").map((value$1) => Number(value$1.trim())).map((num, i) => require_utils.clampValue(num, 0, i < 3 ? 255 : 1));
 		return colors.length < 3 ? void 0 : new RGBColor(colors[0], colors[1], colors[2], colors[3] ?? 1);
 	}
-	toString(format) {
+	toString(format = "css") {
 		switch (format) {
 			case "hex": return "#" + (this.red.toString(16).padStart(2, "0") + this.green.toString(16).padStart(2, "0") + this.blue.toString(16).padStart(2, "0")).toUpperCase();
 			case "hexa": return "#" + (this.red.toString(16).padStart(2, "0") + this.green.toString(16).padStart(2, "0") + this.blue.toString(16).padStart(2, "0") + Math.round(this.alpha * 255).toString(16).padStart(2, "0")).toUpperCase();
@@ -381,7 +381,7 @@ var HSLColor = class HSLColor extends Color {
 			return new HSLColor(require_utils.mod(h, 360), require_utils.clampValue(s, 0, 100), require_utils.clampValue(l, 0, 100), require_utils.clampValue(a ?? 1, 0, 1));
 		}
 	}
-	toString(format) {
+	toString(format = "css") {
 		switch (format) {
 			case "hex": return this.toRGB().toString("hex");
 			case "hexa": return this.toRGB().toString("hexa");
@@ -511,7 +511,7 @@ var HSBColor = class HSBColor extends Color {
 			return new HSBColor(require_utils.mod(h, 360), require_utils.clampValue(s, 0, 100), require_utils.clampValue(b, 0, 100), require_utils.clampValue(a ?? 1, 0, 1));
 		}
 	}
-	toString(format) {
+	toString(format = "css") {
 		switch (format) {
 			case "css": return this.toHSL().toString("css");
 			case "hex": return this.toRGB().toString("hex");

package/dist/{color-utils-BUIU6o8a.mjs → color-utils-BekVyYIJ.mjs}

@@ -230,7 +230,7 @@ var RGBColor = class RGBColor extends Color {
 		if (match?.[1]) colors = match[1].split(",").map((value$1) => Number(value$1.trim())).map((num, i) => clampValue(num, 0, i < 3 ? 255 : 1));
 		return colors.length < 3 ? void 0 : new RGBColor(colors[0], colors[1], colors[2], colors[3] ?? 1);
 	}
-	toString(format) {
+	toString(format = "css") {
 		switch (format) {
 			case "hex": return "#" + (this.red.toString(16).padStart(2, "0") + this.green.toString(16).padStart(2, "0") + this.blue.toString(16).padStart(2, "0")).toUpperCase();
 			case "hexa": return "#" + (this.red.toString(16).padStart(2, "0") + this.green.toString(16).padStart(2, "0") + this.blue.toString(16).padStart(2, "0") + Math.round(this.alpha * 255).toString(16).padStart(2, "0")).toUpperCase();
@@ -381,7 +381,7 @@ var HSLColor = class HSLColor extends Color {
 			return new HSLColor(mod(h, 360), clampValue(s, 0, 100), clampValue(l, 0, 100), clampValue(a ?? 1, 0, 1));
 		}
 	}
-	toString(format) {
+	toString(format = "css") {
 		switch (format) {
 			case "hex": return this.toRGB().toString("hex");
 			case "hexa": return this.toRGB().toString("hexa");
@@ -511,7 +511,7 @@ var HSBColor = class HSBColor extends Color {
 			return new HSBColor(mod(h, 360), clampValue(s, 0, 100), clampValue(b, 0, 100), clampValue(a ?? 1, 0, 1));
 		}
 	}
-	toString(format) {
+	toString(format = "css") {
 		switch (format) {
 			case "css": return this.toHSL().toString("css");
 			case "hex": return this.toRGB().toString("hex");

package/dist/color-utils.cjs

@@ -1,5 +1,5 @@
 require('./utils-B4_qn2dt.cjs');
-const require_color_utils = require('./color-utils-CLAICiIG.cjs');
+const require_color_utils = require('./color-utils-BVq_rh8L.cjs');
 
 exports.Color = require_color_utils.Color;
 exports.getColorAreaGradient = require_color_utils.getColorAreaGradient;

package/dist/color-utils.d.cts

@@ -1,4 +1,4 @@
-import { a as ColorFormat, i as ColorChannelRange, n as ColorAxes, o as ColorStringFormat, r as ColorChannel, s as ColorType, t as Color } from "./color-_pKYh-E2.cjs";
+import { a as ColorFormat, i as ColorChannelRange, n as ColorAxes, o as ColorStringFormat, r as ColorChannel, s as ColorType, t as Color } from "./color-Bj20c2qw.cjs";
 
 //#region src/shared/color-utils/area-gradient.d.ts
 interface GradientOptions {

package/dist/color-utils.d.mts

@@ -1,4 +1,4 @@
-import { a as ColorFormat, i as ColorChannelRange, n as ColorAxes, o as ColorStringFormat, r as ColorChannel, s as ColorType, t as Color } from "./color-CIaXnwJx.mjs";
+import { a as ColorFormat, i as ColorChannelRange, n as ColorAxes, o as ColorStringFormat, r as ColorChannel, s as ColorType, t as Color } from "./color-Bcy-SLQ1.mjs";
 
 //#region src/shared/color-utils/area-gradient.d.ts
 interface GradientOptions {

package/dist/color-utils.mjs

@@ -1,4 +1,4 @@
 import "./utils-DSBXwmDm.mjs";
-import { i as getColorAreaGradient, n as parseColor, r as Color, t as normalizeColor } from "./color-utils-BUIU6o8a.mjs";
+import { i as getColorAreaGradient, n as parseColor, r as Color, t as normalizeColor } from "./color-utils-BekVyYIJ.mjs";
 
 export { Color, getColorAreaGradient, normalizeColor, parseColor };

package/dist/date-utils.d.cts

@@ -1,5 +1,5 @@
 import { a as DateRangePreset, i as DateGranularity, n as DateAlignment, r as DateAvailableFn, t as DateAdjustFn } from "./types-GxLIgJib.cjs";
-import * as _internationalized_date2 from "@internationalized/date";
+import * as _internationalized_date0 from "@internationalized/date";
 import { Calendar, DateDuration, DateFormatter, DateValue } from "@internationalized/date";
 
 //#region src/shared/date-utils/align.d.ts
@@ -27,7 +27,7 @@ declare function getUnitDuration(duration: DateDuration): {
   weeks?: number;
   days?: number;
 };
-declare function getEndDate(startDate: DateValue, duration: DateDuration): _internationalized_date2.CalendarDate | _internationalized_date2.CalendarDateTime | _internationalized_date2.ZonedDateTime;
+declare function getEndDate(startDate: DateValue, duration: DateDuration): _internationalized_date0.CalendarDate | _internationalized_date0.CalendarDateTime | _internationalized_date0.ZonedDateTime;
 //#endregion
 //#region src/shared/date-utils/format.d.ts
 declare function formatRange(startDate: DateValue, endDate: DateValue, formatter: DateFormatter, toString: (start: string, end: string) => string, timeZone: string): string;
@@ -50,7 +50,7 @@ declare function getWeekdayFormats(locale: string, timeZone: string): <T extends
   narrow: string;
 };
 declare function getWeekDays(date: DateValue, startOfWeekProp: number | undefined, timeZone: string, locale: string): {
-  value: _internationalized_date2.CalendarDate | _internationalized_date2.CalendarDateTime | _internationalized_date2.ZonedDateTime;
+  value: _internationalized_date0.CalendarDate | _internationalized_date0.CalendarDateTime | _internationalized_date0.ZonedDateTime;
   short: string;
   long: string;
   narrow: string;
@@ -69,8 +69,8 @@ declare function getDecadeRange(year: number, opts?: {
 }): number[];
 //#endregion
 //#region src/shared/date-utils/mutation.d.ts
-declare function getTodayDate(timeZone?: string): _internationalized_date2.CalendarDate;
-declare function setCalendar(date: DateValue, calendar: Calendar): _internationalized_date2.CalendarDateTime;
+declare function getTodayDate(timeZone?: string): _internationalized_date0.CalendarDate;
+declare function setCalendar(date: DateValue, calendar: Calendar): _internationalized_date0.CalendarDateTime;
 declare function setDate(date: DateValue, startDate: DateValue, isDateUnavailable: DateAvailableFn, locale: string, minValue: DateValue, maxValue: DateValue): DateValue | undefined;
 declare function getPreviousAvailableDate(date: DateValue, minValue: DateValue, locale: string, isDateUnavailable?: DateAvailableFn): DateValue | undefined;
 //#endregion

package/dist/{dismissable-CtFpYFBY.mjs → dismissable-D0YyXTJv.mjs}

@@ -1,4 +1,4 @@
-import { $t as getDocument, W as raf, Zt as contains, ct as addDomEvent, pt as getEventTarget, t as waitForElement, u as setStyle, un as isHTMLElement } from "./dom-query-CUb85Z22.mjs";
+import { $t as getDocument, H as nextTick, W as raf, Zt as contains, ct as addDomEvent, pt as getEventTarget, t as waitForElement, u as setStyle, un as isHTMLElement } from "./dom-query-CUb85Z22.mjs";
 import { at as isFunction, i as warn } from "./utils-DSBXwmDm.mjs";
 import { t as trackInteractOutside } from "./interact-outside-xKQjln5u.mjs";
 
@@ -18,6 +18,7 @@ const LAYER_REQUEST_DISMISS_EVENT = "layer:request-dismiss";
 const layerStack = {
 	layers: [],
 	branches: [],
+	recentlyRemoved: /* @__PURE__ */ new Set(),
 	count() {
 		return this.layers.length;
 	},
@@ -56,7 +57,9 @@ const layerStack = {
 		return this.getNestedLayersByType(node, type).length;
 	},
 	isInNestedLayer(node, target) {
-		return this.getNestedLayers(node).some((layer) => contains(layer.node, target));
+		if (this.getNestedLayers(node).some((layer) => contains(layer.node, target))) return true;
+		if (this.recentlyRemoved.size > 0) return true;
+		return false;
 	},
 	isInBranch(target) {
 		return Array.from(this.branches).some((branch) => contains(branch, target));
@@ -71,6 +74,8 @@ const layerStack = {
 	remove(node) {
 		const index = this.indexOf(node);
 		if (index < 0) return;
+		this.recentlyRemoved.add(node);
+		nextTick(() => this.recentlyRemoved.delete(node));
 		if (index < this.count() - 1) this.getNestedLayers(node).forEach((layer) => layerStack.dismiss(layer.node, node));
 		this.layers.splice(index, 1);
 		this.syncLayers();

package/dist/{dismissable-DWJdIOtX.cjs → dismissable-D9NEAGMU.cjs}

@@ -18,6 +18,7 @@ const LAYER_REQUEST_DISMISS_EVENT = "layer:request-dismiss";
 const layerStack = {
 	layers: [],
 	branches: [],
+	recentlyRemoved: /* @__PURE__ */ new Set(),
 	count() {
 		return this.layers.length;
 	},
@@ -56,7 +57,9 @@ const layerStack = {
 		return this.getNestedLayersByType(node, type).length;
 	},
 	isInNestedLayer(node, target) {
-		return this.getNestedLayers(node).some((layer) => require_dom_query.contains(layer.node, target));
+		if (this.getNestedLayers(node).some((layer) => require_dom_query.contains(layer.node, target))) return true;
+		if (this.recentlyRemoved.size > 0) return true;
+		return false;
 	},
 	isInBranch(target) {
 		return Array.from(this.branches).some((branch) => require_dom_query.contains(branch, target));
@@ -71,6 +74,8 @@ const layerStack = {
 	remove(node) {
 		const index = this.indexOf(node);
 		if (index < 0) return;
+		this.recentlyRemoved.add(node);
+		require_dom_query.nextTick(() => this.recentlyRemoved.delete(node));
 		if (index < this.count() - 1) this.getNestedLayers(node).forEach((layer) => layerStack.dismiss(layer.node, node));
 		this.layers.splice(index, 1);
 		this.syncLayers();

package/dist/dismissable.cjs

@@ -1,7 +1,7 @@
 require('./dom-query-xZuxOsD4.cjs');
 require('./utils-B4_qn2dt.cjs');
 require('./interact-outside-xGMuVVaa.cjs');
-const require_dismissable = require('./dismissable-DWJdIOtX.cjs');
+const require_dismissable = require('./dismissable-D9NEAGMU.cjs');
 
 exports.trackDismissableBranch = require_dismissable.trackDismissableBranch;
 exports.trackDismissableElement = require_dismissable.trackDismissableElement;

package/dist/dismissable.mjs

@@ -1,6 +1,6 @@
 import "./dom-query-CUb85Z22.mjs";
 import "./utils-DSBXwmDm.mjs";
 import "./interact-outside-xKQjln5u.mjs";
-import { n as trackDismissableElement, t as trackDismissableBranch } from "./dismissable-CtFpYFBY.mjs";
+import { n as trackDismissableElement, t as trackDismissableBranch } from "./dismissable-D0YyXTJv.mjs";
 
 export { trackDismissableBranch, trackDismissableElement };

package/dist/machines/accordion/index.d.cts

@@ -3,7 +3,7 @@ import { p as Machine, u as EventObject, y as Service } from "../../types-DejIu6
 import { b as NormalizeProps, g as RequiredBy, r as DirectionProperty, t as CommonProperties, x as PropTypes } from "../../index-Bqw3r34-.cjs";
 
 //#region src/machines/accordion/accordion.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "item" | "itemIndicator" | "itemTrigger" | "itemContent">;
+declare const anatomy: AnatomyInstance<"item" | "itemIndicator" | "root" | "itemTrigger" | "itemContent">;
 //#endregion
 //#region src/machines/accordion/accordion.types.d.ts
 interface ValueChangeDetails {

package/dist/machines/accordion/index.d.mts

@@ -3,7 +3,7 @@ import { p as Machine, u as EventObject, y as Service } from "../../types-DL5AIQ
 import { b as NormalizeProps, g as RequiredBy, r as DirectionProperty, t as CommonProperties, x as PropTypes } from "../../index-BuUzJjaP.mjs";
 
 //#region src/machines/accordion/accordion.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "item" | "itemIndicator" | "itemTrigger" | "itemContent">;
+declare const anatomy: AnatomyInstance<"item" | "itemIndicator" | "root" | "itemTrigger" | "itemContent">;
 //#endregion
 //#region src/machines/accordion/accordion.types.d.ts
 interface ValueChangeDetails {

package/dist/machines/angle-slider/index.d.cts

@@ -3,7 +3,7 @@ import { p as Machine, u as EventObject, y as Service } from "../../types-DejIu6
 import { b as NormalizeProps, g as RequiredBy, r as DirectionProperty, t as CommonProperties, x as PropTypes } from "../../index-Bqw3r34-.cjs";
 
 //#region src/machines/angle-slider/angle-slider.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "control" | "track" | "thumb" | "valueText" | "markerGroup" | "marker">;
+declare const anatomy: AnatomyInstance<"label" | "root" | "control" | "track" | "marker" | "valueText" | "thumb" | "markerGroup">;
 //#endregion
 //#region src/machines/angle-slider/angle-slider.types.d.ts
 interface ValueChangeDetails {

package/dist/machines/angle-slider/index.d.mts

@@ -3,7 +3,7 @@ import { p as Machine, u as EventObject, y as Service } from "../../types-DL5AIQ
 import { b as NormalizeProps, g as RequiredBy, r as DirectionProperty, t as CommonProperties, x as PropTypes } from "../../index-BuUzJjaP.mjs";
 
 //#region src/machines/angle-slider/angle-slider.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "control" | "track" | "thumb" | "valueText" | "markerGroup" | "marker">;
+declare const anatomy: AnatomyInstance<"label" | "root" | "control" | "track" | "marker" | "valueText" | "thumb" | "markerGroup">;
 //#endregion
 //#region src/machines/angle-slider/angle-slider.types.d.ts
 interface ValueChangeDetails {

package/dist/machines/bottom-sheet/index.cjs

@@ -5,7 +5,7 @@ const require_aria_hidden = require('../../aria-hidden-kcYiyWLo.cjs');
 const require_utils = require('../../utils-B4_qn2dt.cjs');
 const require_core = require('../../core-CsVTCpQ_.cjs');
 require('../../interact-outside-xGMuVVaa.cjs');
-const require_dismissable = require('../../dismissable-DWJdIOtX.cjs');
+const require_dismissable = require('../../dismissable-D9NEAGMU.cjs');
 const require_focus_trap = require('../../focus-trap-DcDcihd5.cjs');
 const require_create_props = require('../../create-props-l5q5b8Wo.cjs');
 const require_remove_scroll = require('../../remove-scroll-D5aUrYvL.cjs');

package/dist/machines/bottom-sheet/index.d.cts

@@ -5,7 +5,7 @@ import { c as PointerDownOutsideEvent, n as FocusOutsideEvent, r as InteractOuts
 import { t as DismissableElementHandlers } from "../../dismissable-layer-D-7fwQL8.cjs";
 
 //#region src/machines/bottom-sheet/bottom-sheet.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"trigger" | "content" | "title" | "closeTrigger" | "backdrop" | "grabber" | "grabberIndicator">;
+declare const anatomy: AnatomyInstance<"title" | "trigger" | "content" | "closeTrigger" | "backdrop" | "grabber" | "grabberIndicator">;
 //#endregion
 //#region src/machines/bottom-sheet/utils/drag-manager.d.ts
 declare class DragManager {

package/dist/machines/bottom-sheet/index.d.mts

@@ -5,7 +5,7 @@ import { c as PointerDownOutsideEvent, n as FocusOutsideEvent, r as InteractOuts
 import { t as DismissableElementHandlers } from "../../dismissable-layer-C39y-V3t.mjs";
 
 //#region src/machines/bottom-sheet/bottom-sheet.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"trigger" | "content" | "title" | "closeTrigger" | "backdrop" | "grabber" | "grabberIndicator">;
+declare const anatomy: AnatomyInstance<"title" | "trigger" | "content" | "closeTrigger" | "backdrop" | "grabber" | "grabberIndicator">;
 //#endregion
 //#region src/machines/bottom-sheet/utils/drag-manager.d.ts
 declare class DragManager {

package/dist/machines/bottom-sheet/index.mjs

@@ -5,7 +5,7 @@ import { t as ariaHidden } from "../../aria-hidden-CVIz-P9c.mjs";
 import { H as toPx, u as createSplitProps } from "../../utils-DSBXwmDm.mjs";
 import { a as createMachine } from "../../core-CujC6Y2H.mjs";
 import "../../interact-outside-xKQjln5u.mjs";
-import { n as trackDismissableElement } from "../../dismissable-CtFpYFBY.mjs";
+import { n as trackDismissableElement } from "../../dismissable-D0YyXTJv.mjs";
 import { t as trapFocus } from "../../focus-trap-KZbY4M-m.mjs";
 import { t as createProps } from "../../create-props-SRSjdUTq.mjs";
 import { t as preventBodyScroll } from "../../remove-scroll-DNoftRvo.mjs";

package/dist/machines/carousel/index.d.cts

@@ -3,7 +3,7 @@ import { p as Machine, u as EventObject, y as Service } from "../../types-DejIu6
 import { b as NormalizeProps, d as Orientation, f as OrientationProperty, g as RequiredBy, r as DirectionProperty, t as CommonProperties, x as PropTypes } from "../../index-Bqw3r34-.cjs";
 
 //#region src/machines/carousel/carousel.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "item" | "control" | "indicator" | "itemGroup" | "prevTrigger" | "nextTrigger" | "indicatorGroup" | "autoplayTrigger" | "progressText">;
+declare const anatomy: AnatomyInstance<"item" | "root" | "control" | "indicator" | "itemGroup" | "nextTrigger" | "prevTrigger" | "indicatorGroup" | "autoplayTrigger" | "progressText">;
 //#endregion
 //#region src/machines/carousel/carousel.types.d.ts
 interface PageChangeDetails {

package/dist/machines/carousel/index.d.mts

@@ -3,7 +3,7 @@ import { p as Machine, u as EventObject, y as Service } from "../../types-DL5AIQ
 import { b as NormalizeProps, d as Orientation, f as OrientationProperty, g as RequiredBy, r as DirectionProperty, t as CommonProperties, x as PropTypes } from "../../index-BuUzJjaP.mjs";
 
 //#region src/machines/carousel/carousel.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "item" | "control" | "indicator" | "itemGroup" | "prevTrigger" | "nextTrigger" | "indicatorGroup" | "autoplayTrigger" | "progressText">;
+declare const anatomy: AnatomyInstance<"item" | "root" | "control" | "indicator" | "itemGroup" | "nextTrigger" | "prevTrigger" | "indicatorGroup" | "autoplayTrigger" | "progressText">;
 //#endregion
 //#region src/machines/carousel/carousel.types.d.ts
 interface PageChangeDetails {

package/dist/machines/checkbox/index.d.cts

@@ -3,7 +3,7 @@ import { p as Machine, u as EventObject, y as Service } from "../../types-DejIu6
 import { b as NormalizeProps, g as RequiredBy, r as DirectionProperty, t as CommonProperties, x as PropTypes } from "../../index-Bqw3r34-.cjs";
 
 //#region src/machines/checkbox/checkbox.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "control" | "indicator">;
+declare const anatomy: AnatomyInstance<"label" | "root" | "control" | "indicator">;
 //#endregion
 //#region src/machines/checkbox/checkbox.types.d.ts
 type CheckedState = boolean | "indeterminate";

package/dist/machines/checkbox/index.d.mts

@@ -3,7 +3,7 @@ import { p as Machine, u as EventObject, y as Service } from "../../types-DL5AIQ
 import { b as NormalizeProps, g as RequiredBy, r as DirectionProperty, t as CommonProperties, x as PropTypes } from "../../index-BuUzJjaP.mjs";
 
 //#region src/machines/checkbox/checkbox.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "control" | "indicator">;
+declare const anatomy: AnatomyInstance<"label" | "root" | "control" | "indicator">;
 //#endregion
 //#region src/machines/checkbox/checkbox.types.d.ts
 type CheckedState = boolean | "indeterminate";

package/dist/machines/clipboard/index.d.cts

@@ -3,7 +3,7 @@ import { p as Machine, y as Service } from "../../types-DejIu60O.cjs";
 import { b as NormalizeProps, g as RequiredBy, t as CommonProperties, x as PropTypes } from "../../index-Bqw3r34-.cjs";
 
 //#region src/machines/clipboard/clipboard.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "control" | "input" | "trigger" | "indicator">;
+declare const anatomy: AnatomyInstance<"label" | "root" | "control" | "indicator" | "input" | "trigger">;
 //#endregion
 //#region src/machines/clipboard/clipboard.types.d.ts
 interface CopyStatusDetails {

package/dist/machines/clipboard/index.d.mts

@@ -3,7 +3,7 @@ import { p as Machine, y as Service } from "../../types-DL5AIQk5.mjs";
 import { b as NormalizeProps, g as RequiredBy, t as CommonProperties, x as PropTypes } from "../../index-BuUzJjaP.mjs";
 
 //#region src/machines/clipboard/clipboard.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "control" | "input" | "trigger" | "indicator">;
+declare const anatomy: AnatomyInstance<"label" | "root" | "control" | "indicator" | "input" | "trigger">;
 //#endregion
 //#region src/machines/clipboard/clipboard.types.d.ts
 interface CopyStatusDetails {

package/dist/machines/collapsible/index.d.cts

@@ -3,7 +3,7 @@ import { p as Machine, y as Service } from "../../types-DejIu60O.cjs";
 import { b as NormalizeProps, r as DirectionProperty, t as CommonProperties, x as PropTypes } from "../../index-Bqw3r34-.cjs";
 
 //#region src/machines/collapsible/collapsible.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "trigger" | "content" | "indicator">;
+declare const anatomy: AnatomyInstance<"root" | "indicator" | "trigger" | "content">;
 //#endregion
 //#region src/machines/collapsible/collapsible.types.d.ts
 interface OpenChangeDetails {

package/dist/machines/collapsible/index.d.mts

@@ -3,7 +3,7 @@ import { p as Machine, y as Service } from "../../types-DL5AIQk5.mjs";
 import { b as NormalizeProps, r as DirectionProperty, t as CommonProperties, x as PropTypes } from "../../index-BuUzJjaP.mjs";
 
 //#region src/machines/collapsible/collapsible.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "trigger" | "content" | "indicator">;
+declare const anatomy: AnatomyInstance<"root" | "indicator" | "trigger" | "content">;
 //#endregion
 //#region src/machines/collapsible/collapsible.types.d.ts
 interface OpenChangeDetails {

package/dist/machines/color-picker/index.cjs

@@ -1,10 +1,10 @@
 const require_create_anatomy = require('../../create-anatomy-CDsIFUXg.cjs');
 const require_dom_query = require('../../dom-query-xZuxOsD4.cjs');
 const require_utils = require('../../utils-B4_qn2dt.cjs');
-const require_color_utils = require('../../color-utils-CLAICiIG.cjs');
+const require_color_utils = require('../../color-utils-BVq_rh8L.cjs');
 const require_core = require('../../core-CsVTCpQ_.cjs');
 require('../../interact-outside-xGMuVVaa.cjs');
-const require_dismissable = require('../../dismissable-DWJdIOtX.cjs');
+const require_dismissable = require('../../dismissable-D9NEAGMU.cjs');
 const require_popper = require('../../popper-TNUpC0Kp.cjs');
 const require_create_props = require('../../create-props-l5q5b8Wo.cjs');
 
@@ -929,12 +929,18 @@ function prefixHex(value) {
 //#endregion
 //#region src/machines/color-picker/color-picker.machine.ts
 const { and } = require_core.createGuards();
+const hashObject = (obj) => {
+	let hash = "";
+	for (const key in obj) hash += `${key}:${obj[key] ?? ""};`;
+	return hash;
+};
+const DEFAULT_COLOR = parse("#000000");
 const machine = require_core.createMachine({
 	props({ props: props$1 }) {
 		return {
 			dir: "ltr",
-			defaultValue: parse("#000000"),
-			defaultFormat: "rgba",
+			defaultValue: DEFAULT_COLOR,
+			defaultFormat: (props$1.value ?? props$1.defaultValue ?? DEFAULT_COLOR).getFormat(),
 			openAutoFocus: true,
 			...props$1,
 			positioning: {
@@ -952,17 +958,16 @@ const machine = require_core.createMachine({
 				defaultValue: prop("defaultValue"),
 				value: prop("value"),
 				isEqual(a, b) {
-					return a.toString("css") === b?.toString("css");
+					return b != null && a.isEqual(b);
 				},
 				hash(a) {
-					return a.toString("css");
+					return hashObject(a.toJSON());
 				},
 				onChange(value) {
-					const ctx = getContext();
-					const valueAsString = value.toString(ctx.get("format"));
+					const format = getContext().get("format");
 					prop("onValueChange")?.({
 						value,
-						valueAsString
+						valueAsString: value.toString(format)
 					});
 				}
 			})),
@@ -997,7 +1002,7 @@ const machine = require_core.createMachine({
 			action(["syncInputElements", "dispatchChangeEvent"]);
 		});
 		track([() => context.get("format")], () => {
-			action(["syncFormatSelectElement"]);
+			action(["syncFormatSelectElement", "syncValueWithFormat"]);
 		});
 		track([() => prop("open")], () => {
 			action(["toggleVisibility"]);
@@ -1428,6 +1433,12 @@ const machine = require_core.createMachine({
 			syncFormatSelectElement({ context, scope }) {
 				syncFormatSelect(scope, context.get("format"));
 			},
+			syncValueWithFormat({ context }) {
+				const value = context.get("value");
+				const newValue = value.toFormat(context.get("format"));
+				if (newValue.isEqual(value)) return;
+				context.set("value", newValue);
+			},
 			invokeOnOpen({ prop, context }) {
 				if (prop("inline")) return;
 				prop("onOpenChange")?.({

package/dist/machines/color-picker/index.d.cts

@@ -1,12 +1,12 @@
 import { t as Anatomy } from "../../create-anatomy-smWrirg1.cjs";
-import { a as ColorFormat, n as ColorAxes, r as ColorChannel, s as ColorType, t as Color } from "../../color-_pKYh-E2.cjs";
+import { a as ColorFormat, n as ColorAxes, r as ColorChannel, s as ColorType, t as Color } from "../../color-Bj20c2qw.cjs";
 import { p as Machine, u as EventObject, y as Service } from "../../types-DejIu60O.cjs";
 import { b as NormalizeProps, d as Orientation, g as RequiredBy, r as DirectionProperty, t as CommonProperties, x as PropTypes } from "../../index-Bqw3r34-.cjs";
 import { c as PointerDownOutsideEvent, i as InteractOutsideHandlers, n as FocusOutsideEvent, r as InteractOutsideEvent } from "../../index-C9-feK5c.cjs";
 import { d as PositioningOptions } from "../../types-D5ziaMrd.cjs";
 
 //#region src/machines/color-picker/color-picker.anatomy.d.ts
-declare const anatomy: Anatomy<"root" | "label" | "control" | "area" | "trigger" | "content" | "valueText" | "positioner" | "areaThumb" | "areaBackground" | "channelSlider" | "channelSliderLabel" | "channelSliderTrack" | "channelSliderThumb" | "channelSliderValueText" | "channelInput" | "transparencyGrid" | "swatchGroup" | "swatchTrigger" | "swatchIndicator" | "swatch" | "eyeDropperTrigger" | "formatTrigger" | "formatSelect">;
+declare const anatomy: Anatomy<"label" | "root" | "control" | "area" | "valueText" | "trigger" | "content" | "positioner" | "areaThumb" | "areaBackground" | "channelSlider" | "channelSliderLabel" | "channelSliderTrack" | "channelSliderThumb" | "channelSliderValueText" | "channelInput" | "transparencyGrid" | "swatchGroup" | "swatchTrigger" | "swatchIndicator" | "swatch" | "eyeDropperTrigger" | "formatTrigger" | "formatSelect">;
 //#endregion
 //#region src/machines/color-picker/color-picker.types.d.ts
 type ExtendedColorChannel = ColorChannel | "hex" | "css";

package/dist/machines/color-picker/index.d.mts

@@ -1,12 +1,12 @@
 import { t as Anatomy } from "../../create-anatomy-DHVOqZET.mjs";
-import { a as ColorFormat, n as ColorAxes, r as ColorChannel, s as ColorType, t as Color } from "../../color-CIaXnwJx.mjs";
+import { a as ColorFormat, n as ColorAxes, r as ColorChannel, s as ColorType, t as Color } from "../../color-Bcy-SLQ1.mjs";
 import { p as Machine, u as EventObject, y as Service } from "../../types-DL5AIQk5.mjs";
 import { b as NormalizeProps, d as Orientation, g as RequiredBy, r as DirectionProperty, t as CommonProperties, x as PropTypes } from "../../index-BuUzJjaP.mjs";
 import { c as PointerDownOutsideEvent, i as InteractOutsideHandlers, n as FocusOutsideEvent, r as InteractOutsideEvent } from "../../index-Bvn6ocEE.mjs";
 import { p as PositioningOptions } from "../../index-BTi1wETB.mjs";
 
 //#region src/machines/color-picker/color-picker.anatomy.d.ts
-declare const anatomy: Anatomy<"root" | "label" | "control" | "area" | "trigger" | "content" | "valueText" | "positioner" | "areaThumb" | "areaBackground" | "channelSlider" | "channelSliderLabel" | "channelSliderTrack" | "channelSliderThumb" | "channelSliderValueText" | "channelInput" | "transparencyGrid" | "swatchGroup" | "swatchTrigger" | "swatchIndicator" | "swatch" | "eyeDropperTrigger" | "formatTrigger" | "formatSelect">;
+declare const anatomy: Anatomy<"label" | "root" | "control" | "area" | "valueText" | "trigger" | "content" | "positioner" | "areaThumb" | "areaBackground" | "channelSlider" | "channelSliderLabel" | "channelSliderTrack" | "channelSliderThumb" | "channelSliderValueText" | "channelInput" | "transparencyGrid" | "swatchGroup" | "swatchTrigger" | "swatchIndicator" | "swatch" | "eyeDropperTrigger" | "formatTrigger" | "formatSelect">;
 //#endregion
 //#region src/machines/color-picker/color-picker.types.d.ts
 type ExtendedColorChannel = ColorChannel | "hex" | "css";

package/dist/machines/color-picker/index.mjs

@@ -1,10 +1,10 @@
 import { t as createAnatomy } from "../../create-anatomy-CArN8dVu.mjs";
 import { A as getRelativePoint, C as queryAll, D as disableTextSelection, E as trackPointerMove, G as getInitialFocus, S as query, W as raf, a as visuallyHiddenStyle, bt as isLeftClick, dt as getEventPoint, ft as getEventStep, it as dispatchInputValueEvent, ot as setElementValue, st as trackFormControl, ut as getEventKey, xt as isModifierKey, yn as dataAttr } from "../../dom-query-CUb85Z22.mjs";
 import { $ as tryCatch, u as createSplitProps } from "../../utils-DSBXwmDm.mjs";
-import { i as getColorAreaGradient, n as parseColor, t as normalizeColor } from "../../color-utils-BUIU6o8a.mjs";
+import { i as getColorAreaGradient, n as parseColor, t as normalizeColor } from "../../color-utils-BekVyYIJ.mjs";
 import { a as createMachine, i as createGuards } from "../../core-CujC6Y2H.mjs";
 import "../../interact-outside-xKQjln5u.mjs";
-import { n as trackDismissableElement } from "../../dismissable-CtFpYFBY.mjs";
+import { n as trackDismissableElement } from "../../dismissable-D0YyXTJv.mjs";
 import { n as getPlacement, t as getPlacementStyles } from "../../popper-DbfXVgrC.mjs";
 import { t as createProps } from "../../create-props-SRSjdUTq.mjs";
 
@@ -929,12 +929,18 @@ function prefixHex(value) {
 //#endregion
 //#region src/machines/color-picker/color-picker.machine.ts
 const { and } = createGuards();
+const hashObject = (obj) => {
+	let hash = "";
+	for (const key in obj) hash += `${key}:${obj[key] ?? ""};`;
+	return hash;
+};
+const DEFAULT_COLOR = parse("#000000");
 const machine = createMachine({
 	props({ props: props$1 }) {
 		return {
 			dir: "ltr",
-			defaultValue: parse("#000000"),
-			defaultFormat: "rgba",
+			defaultValue: DEFAULT_COLOR,
+			defaultFormat: (props$1.value ?? props$1.defaultValue ?? DEFAULT_COLOR).getFormat(),
 			openAutoFocus: true,
 			...props$1,
 			positioning: {
@@ -952,17 +958,16 @@ const machine = createMachine({
 				defaultValue: prop("defaultValue"),
 				value: prop("value"),
 				isEqual(a, b) {
-					return a.toString("css") === b?.toString("css");
+					return b != null && a.isEqual(b);
 				},
 				hash(a) {
-					return a.toString("css");
+					return hashObject(a.toJSON());
 				},
 				onChange(value) {
-					const ctx = getContext();
-					const valueAsString = value.toString(ctx.get("format"));
+					const format = getContext().get("format");
 					prop("onValueChange")?.({
 						value,
-						valueAsString
+						valueAsString: value.toString(format)
 					});
 				}
 			})),
@@ -997,7 +1002,7 @@ const machine = createMachine({
 			action(["syncInputElements", "dispatchChangeEvent"]);
 		});
 		track([() => context.get("format")], () => {
-			action(["syncFormatSelectElement"]);
+			action(["syncFormatSelectElement", "syncValueWithFormat"]);
 		});
 		track([() => prop("open")], () => {
 			action(["toggleVisibility"]);
@@ -1428,6 +1433,12 @@ const machine = createMachine({
 			syncFormatSelectElement({ context, scope }) {
 				syncFormatSelect(scope, context.get("format"));
 			},
+			syncValueWithFormat({ context }) {
+				const value = context.get("value");
+				const newValue = value.toFormat(context.get("format"));
+				if (newValue.isEqual(value)) return;
+				context.set("value", newValue);
+			},
 			invokeOnOpen({ prop, context }) {
 				if (prop("inline")) return;
 				prop("onOpenChange")?.({

package/dist/machines/combobox/index.cjs

@@ -4,7 +4,7 @@ const require_utils = require('../../utils-B4_qn2dt.cjs');
 const require_collection = require('../../collection-Q52RkxUe.cjs');
 const require_core = require('../../core-CsVTCpQ_.cjs');
 require('../../interact-outside-xGMuVVaa.cjs');
-const require_dismissable = require('../../dismissable-DWJdIOtX.cjs');
+const require_dismissable = require('../../dismissable-D9NEAGMU.cjs');
 const require_popper = require('../../popper-TNUpC0Kp.cjs');
 const require_create_props = require('../../create-props-l5q5b8Wo.cjs');