@sprawlify/primitives 0.0.55 → 0.0.57

package/dist/collection.d.cts

@@ -1,5 +1,5 @@
 import { a as CollectionSearchState, c as FlatTreeNode, d as TreeCollectionMethods, f as TreeCollectionOptions, g as ValuePath, i as CollectionSearchOptions, l as FlatTreeNodeMeta, m as TreeSkipFn, n as CollectionMethods, p as TreeNode, r as CollectionOptions, s as FilePathTreeNode, t as CollectionItem, u as IndexPath } from "./types-CADkcKtr.cjs";
-import { n as isListCollection, t as ListCollection } from "./list-collection-BvMwDNHf.cjs";
-import { a as isGridCollection, i as GridCollectionOptions, n as SelectionMode, r as GridCollection, t as Selection } from "./selection-vng1guNc.cjs";
+import { n as isListCollection, t as ListCollection } from "./list-collection-BslnP0r-.cjs";
+import { a as isGridCollection, i as GridCollectionOptions, n as SelectionMode, r as GridCollection, t as Selection } from "./selection-DTpiPgq8.cjs";
 import { n as filePathToTree, r as flattenedToTree, t as TreeCollection } from "./tree-collection-CmehimuO.cjs";
 export { CollectionItem, CollectionMethods, CollectionOptions, CollectionSearchOptions, CollectionSearchState, FilePathTreeNode, FlatTreeNode, FlatTreeNodeMeta, GridCollection, GridCollectionOptions, IndexPath, ListCollection, Selection, SelectionMode, TreeCollection, TreeCollectionMethods, TreeCollectionOptions, TreeNode, TreeSkipFn, ValuePath, filePathToTree, flattenedToTree, isGridCollection, isListCollection };

package/dist/collection.d.mts

@@ -1,5 +1,5 @@
 import { a as CollectionSearchState, c as FlatTreeNode, d as TreeCollectionMethods, f as TreeCollectionOptions, g as ValuePath, i as CollectionSearchOptions, l as FlatTreeNodeMeta, m as TreeSkipFn, n as CollectionMethods, p as TreeNode, r as CollectionOptions, s as FilePathTreeNode, t as CollectionItem, u as IndexPath } from "./types-Df8ZhdY-.mjs";
-import { n as isListCollection, t as ListCollection } from "./list-collection-CTt1eong.mjs";
-import { a as isGridCollection, i as GridCollectionOptions, n as SelectionMode, r as GridCollection, t as Selection } from "./selection-JDFmyke7.mjs";
+import { n as isListCollection, t as ListCollection } from "./list-collection-swuCMCIS.mjs";
+import { a as isGridCollection, i as GridCollectionOptions, n as SelectionMode, r as GridCollection, t as Selection } from "./selection-CIoBu9mp.mjs";
 import { n as filePathToTree, r as flattenedToTree, t as TreeCollection } from "./tree-collection-CqXQBHwY.mjs";
 export { CollectionItem, CollectionMethods, CollectionOptions, CollectionSearchOptions, CollectionSearchState, FilePathTreeNode, FlatTreeNode, FlatTreeNodeMeta, GridCollection, GridCollectionOptions, IndexPath, ListCollection, Selection, SelectionMode, TreeCollection, TreeCollectionMethods, TreeCollectionOptions, TreeNode, TreeSkipFn, ValuePath, filePathToTree, flattenedToTree, isGridCollection, isListCollection };

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/{index-BTi1wETB.d.mts → index-60_Ru8qp.d.mts}

@@ -95,7 +95,7 @@ declare function getPlacementStyles(options?: Pick<PositioningOptions, "placemen
     readonly zIndex: "inherit";
   };
   floating: {
-    readonly position: "absolute" | "fixed";
+    readonly position: "fixed" | "absolute";
     readonly isolation: "isolate";
     readonly minWidth: "max-content" | undefined;
     readonly width: "var(--reference-width)" | undefined;

package/dist/{list-collection-BvMwDNHf.d.cts → list-collection-BslnP0r-.d.cts}

@@ -46,7 +46,7 @@ declare class ListCollection<T extends CollectionItem = CollectionItem> {
   moveBefore: (value: string, ...values: string[]) => ListCollection<T>;
   moveAfter: (value: string, ...values: string[]) => ListCollection<T>;
   reorder: (fromIndex: number, toIndex: number) => ListCollection<T>;
-  compareValue: (a: string, b: string) => 0 | 1 | -1;
+  compareValue: (a: string, b: string) => 1 | 0 | -1;
   private range;
   getValueRange: (from: string | null, to: string | null) => string[];
   toString: () => string;

package/dist/{list-collection-CTt1eong.d.mts → list-collection-swuCMCIS.d.mts}

@@ -46,7 +46,7 @@ declare class ListCollection<T extends CollectionItem = CollectionItem> {
   moveBefore: (value: string, ...values: string[]) => ListCollection<T>;
   moveAfter: (value: string, ...values: string[]) => ListCollection<T>;
   reorder: (fromIndex: number, toIndex: number) => ListCollection<T>;
-  compareValue: (a: string, b: string) => 0 | 1 | -1;
+  compareValue: (a: string, b: string) => 1 | 0 | -1;
   private range;
   getValueRange: (from: string | null, to: string | null) => string[];
   toString: () => string;

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" | "thumb" | "valueText" | "track" | "control" | "markerGroup" | "marker">;
+declare const anatomy: AnatomyInstance<"root" | "track" | "label" | "control" | "valueText" | "marker" | "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" | "thumb" | "valueText" | "track" | "control" | "markerGroup" | "marker">;
+declare const anatomy: AnatomyInstance<"root" | "track" | "label" | "control" | "valueText" | "marker" | "thumb" | "markerGroup">;
 //#endregion
 //#region src/machines/angle-slider/angle-slider.types.d.ts
 interface ValueChangeDetails {

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<"title" | "trigger" | "content" | "closeTrigger" | "backdrop" | "grabber" | "grabberIndicator">;
+declare const anatomy: AnatomyInstance<"trigger" | "content" | "title" | "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<"title" | "trigger" | "content" | "closeTrigger" | "backdrop" | "grabber" | "grabberIndicator">;
+declare const anatomy: AnatomyInstance<"trigger" | "content" | "title" | "closeTrigger" | "backdrop" | "grabber" | "grabberIndicator">;
 //#endregion
 //#region src/machines/bottom-sheet/utils/drag-manager.d.ts
 declare class DragManager {

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" | "control" | "indicator" | "item" | "nextTrigger" | "prevTrigger" | "itemGroup" | "indicatorGroup" | "autoplayTrigger" | "progressText">;
+declare const anatomy: AnatomyInstance<"root" | "control" | "item" | "indicator" | "prevTrigger" | "nextTrigger" | "itemGroup" | "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" | "control" | "indicator" | "item" | "nextTrigger" | "prevTrigger" | "itemGroup" | "indicatorGroup" | "autoplayTrigger" | "progressText">;
+declare const anatomy: AnatomyInstance<"root" | "control" | "item" | "indicator" | "prevTrigger" | "nextTrigger" | "itemGroup" | "indicatorGroup" | "autoplayTrigger" | "progressText">;
 //#endregion
 //#region src/machines/carousel/carousel.types.d.ts
 interface PageChangeDetails {

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" | "indicator" | "trigger">;
+declare const anatomy: AnatomyInstance<"root" | "input" | "label" | "control" | "trigger" | "indicator">;
 //#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" | "indicator" | "trigger">;
+declare const anatomy: AnatomyInstance<"root" | "input" | "label" | "control" | "trigger" | "indicator">;
 //#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" | "indicator" | "trigger" | "content">;
+declare const anatomy: AnatomyInstance<"root" | "trigger" | "content" | "indicator">;
 //#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" | "indicator" | "trigger" | "content">;
+declare const anatomy: AnatomyInstance<"root" | "trigger" | "content" | "indicator">;
 //#endregion
 //#region src/machines/collapsible/collapsible.types.d.ts
 interface OpenChangeDetails {

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

@@ -1,7 +1,7 @@
 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');
@@ -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" | "valueText" | "control" | "area" | "trigger" | "content" | "positioner" | "areaThumb" | "areaBackground" | "channelSlider" | "channelSliderLabel" | "channelSliderTrack" | "channelSliderThumb" | "channelSliderValueText" | "channelInput" | "transparencyGrid" | "swatchGroup" | "swatchTrigger" | "swatchIndicator" | "swatch" | "eyeDropperTrigger" | "formatTrigger" | "formatSelect">;
+declare const anatomy: Anatomy<"root" | "label" | "control" | "trigger" | "positioner" | "content" | "valueText" | "area" | "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";
+import { p as PositioningOptions } from "../../index-60_Ru8qp.mjs";
 
 //#region src/machines/color-picker/color-picker.anatomy.d.ts
-declare const anatomy: Anatomy<"root" | "label" | "valueText" | "control" | "area" | "trigger" | "content" | "positioner" | "areaThumb" | "areaBackground" | "channelSlider" | "channelSliderLabel" | "channelSliderTrack" | "channelSliderThumb" | "channelSliderValueText" | "channelInput" | "transparencyGrid" | "swatchGroup" | "swatchTrigger" | "swatchIndicator" | "swatch" | "eyeDropperTrigger" | "formatTrigger" | "formatSelect">;
+declare const anatomy: Anatomy<"root" | "label" | "control" | "trigger" | "positioner" | "content" | "valueText" | "area" | "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,7 +1,7 @@
 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";
@@ -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.d.cts

@@ -1,13 +1,13 @@
 import { n as AnatomyInstance } from "../../create-anatomy-smWrirg1.cjs";
 import { r as CollectionOptions, t as CollectionItem } from "../../types-CADkcKtr.cjs";
-import { t as ListCollection } from "../../list-collection-BvMwDNHf.cjs";
+import { t as ListCollection } from "../../list-collection-BslnP0r-.cjs";
 import { p as Machine, u as EventObject, y as Service } from "../../types-DejIu60O.cjs";
 import { b as NormalizeProps, 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 { c as Placement, d as PositioningOptions } from "../../types-D5ziaMrd.cjs";
 
 //#region src/machines/combobox/combobox.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "control" | "input" | "list" | "item" | "trigger" | "content" | "itemText" | "itemIndicator" | "clearTrigger" | "positioner" | "itemGroup" | "itemGroupLabel">;
+declare const anatomy: AnatomyInstance<"root" | "input" | "label" | "control" | "trigger" | "positioner" | "content" | "item" | "itemIndicator" | "itemText" | "clearTrigger" | "list" | "itemGroup" | "itemGroupLabel">;
 //#endregion
 //#region src/machines/combobox/combobox.collection.d.ts
 declare const collection: {

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

@@ -1,13 +1,13 @@
 import { n as AnatomyInstance } from "../../create-anatomy-DHVOqZET.mjs";
 import { r as CollectionOptions, t as CollectionItem } from "../../types-Df8ZhdY-.mjs";
-import { t as ListCollection } from "../../list-collection-CTt1eong.mjs";
+import { t as ListCollection } from "../../list-collection-swuCMCIS.mjs";
 import { p as Machine, u as EventObject, y as Service } from "../../types-DL5AIQk5.mjs";
 import { b as NormalizeProps, 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, u as Placement } from "../../index-BTi1wETB.mjs";
+import { p as PositioningOptions, u as Placement } from "../../index-60_Ru8qp.mjs";
 
 //#region src/machines/combobox/combobox.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "control" | "input" | "list" | "item" | "trigger" | "content" | "itemText" | "itemIndicator" | "clearTrigger" | "positioner" | "itemGroup" | "itemGroupLabel">;
+declare const anatomy: AnatomyInstance<"root" | "input" | "label" | "control" | "trigger" | "positioner" | "content" | "item" | "itemIndicator" | "itemText" | "clearTrigger" | "list" | "itemGroup" | "itemGroupLabel">;
 //#endregion
 //#region src/machines/combobox/combobox.collection.d.ts
 declare const collection: {

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

@@ -8,7 +8,7 @@ import { c as Placement, d as PositioningOptions } from "../../types-D5ziaMrd.cj
 import { Calendar, CalendarDate, CalendarDateTime, DateDuration, DateFormatter, DateValue, DateValue as DateValue$1, ZonedDateTime } from "@internationalized/date";
 
 //#region src/machines/date-picker/date-picker.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "control" | "input" | "table" | "view" | "trigger" | "content" | "nextTrigger" | "prevTrigger" | "clearTrigger" | "positioner" | "monthSelect" | "presetTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;
+declare const anatomy: AnatomyInstance<"root" | "input" | "view" | "label" | "control" | "trigger" | "positioner" | "content" | "table" | "clearTrigger" | "prevTrigger" | "nextTrigger" | "monthSelect" | "presetTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;
 //#endregion
 //#region src/machines/date-picker/date-picker.types.d.ts
 type DateView = "day" | "month" | "year";

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

@@ -4,11 +4,11 @@ import { b as NormalizeProps, g as RequiredBy, r as DirectionProperty, t as Comm
 import { X as DateRangePreset } from "../../index-HnPpYuSl.mjs";
 import { c as PointerDownOutsideEvent, n as FocusOutsideEvent, r as InteractOutsideEvent } from "../../index-Bvn6ocEE.mjs";
 import { t as LiveRegion } from "../../index-CygfPLvT.mjs";
-import { p as PositioningOptions, u as Placement } from "../../index-BTi1wETB.mjs";
+import { p as PositioningOptions, u as Placement } from "../../index-60_Ru8qp.mjs";
 import { Calendar, CalendarDate, CalendarDateTime, DateDuration, DateFormatter, DateValue, DateValue as DateValue$1, ZonedDateTime } from "@internationalized/date";
 
 //#region src/machines/date-picker/date-picker.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "control" | "input" | "table" | "view" | "trigger" | "content" | "nextTrigger" | "prevTrigger" | "clearTrigger" | "positioner" | "monthSelect" | "presetTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;
+declare const anatomy: AnatomyInstance<"root" | "input" | "view" | "label" | "control" | "trigger" | "positioner" | "content" | "table" | "clearTrigger" | "prevTrigger" | "nextTrigger" | "monthSelect" | "presetTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;
 //#endregion
 //#region src/machines/date-picker/date-picker.types.d.ts
 type DateView = "day" | "month" | "year";

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

@@ -5,7 +5,7 @@ import { c as PointerDownOutsideEvent, n as FocusOutsideEvent, r as InteractOuts
 import { r as PersistentElementOptions, t as DismissableElementHandlers } from "../../dismissable-layer-D-7fwQL8.cjs";
 
 //#region src/machines/dialog/dialog.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"title" | "trigger" | "content" | "description" | "closeTrigger" | "positioner" | "backdrop">;
+declare const anatomy: AnatomyInstance<"trigger" | "positioner" | "content" | "title" | "closeTrigger" | "description" | "backdrop">;
 //#endregion
 //#region src/machines/dialog/dialog.types.d.ts
 interface OpenChangeDetails {

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

@@ -5,7 +5,7 @@ import { c as PointerDownOutsideEvent, n as FocusOutsideEvent, r as InteractOuts
 import { r as PersistentElementOptions, t as DismissableElementHandlers } from "../../dismissable-layer-C39y-V3t.mjs";
 
 //#region src/machines/dialog/dialog.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"title" | "trigger" | "content" | "description" | "closeTrigger" | "positioner" | "backdrop">;
+declare const anatomy: AnatomyInstance<"trigger" | "positioner" | "content" | "title" | "closeTrigger" | "description" | "backdrop">;
 //#endregion
 //#region src/machines/dialog/dialog.types.d.ts
 interface OpenChangeDetails {

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

@@ -4,7 +4,7 @@ import { b as NormalizeProps, g as RequiredBy, r as DirectionProperty, t as Comm
 import { c as PointerDownOutsideEvent, i as InteractOutsideHandlers, n as FocusOutsideEvent, r as InteractOutsideEvent } from "../../index-C9-feK5c.cjs";
 
 //#region src/machines/editable/editable.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "control" | "area" | "input" | "preview" | "editTrigger" | "submitTrigger" | "cancelTrigger">;
+declare const anatomy: AnatomyInstance<"root" | "input" | "label" | "control" | "area" | "preview" | "editTrigger" | "submitTrigger" | "cancelTrigger">;
 //#endregion
 //#region src/machines/editable/editable.types.d.ts
 interface ValueChangeDetails {

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

@@ -4,7 +4,7 @@ import { b as NormalizeProps, g as RequiredBy, r as DirectionProperty, t as Comm
 import { c as PointerDownOutsideEvent, i as InteractOutsideHandlers, n as FocusOutsideEvent, r as InteractOutsideEvent } from "../../index-Bvn6ocEE.mjs";
 
 //#region src/machines/editable/editable.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "control" | "area" | "input" | "preview" | "editTrigger" | "submitTrigger" | "cancelTrigger">;
+declare const anatomy: AnatomyInstance<"root" | "input" | "label" | "control" | "area" | "preview" | "editTrigger" | "submitTrigger" | "cancelTrigger">;
 //#endregion
 //#region src/machines/editable/editable.types.d.ts
 interface ValueChangeDetails {

package/dist/machines/file-upload/index.d.cts

@@ -4,7 +4,7 @@ import { b as NormalizeProps, g as RequiredBy, o as LocaleProperties, t as Commo
 import { i as FileMimeType, r as FileError } from "../../types-F-0xFywm.cjs";
 
 //#region src/machines/file-upload/file-upload.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "item" | "trigger" | "clearTrigger" | "itemGroup" | "itemPreview" | "itemDeleteTrigger" | "dropzone" | "itemName" | "itemPreviewImage" | "itemSizeText">;
+declare const anatomy: AnatomyInstance<"root" | "label" | "trigger" | "item" | "clearTrigger" | "itemDeleteTrigger" | "itemPreview" | "itemGroup" | "dropzone" | "itemName" | "itemSizeText" | "itemPreviewImage">;
 //#endregion
 //#region src/machines/file-upload/file-upload.types.d.ts
 interface FileRejection {

package/dist/machines/file-upload/index.d.mts

@@ -4,7 +4,7 @@ import { b as NormalizeProps, g as RequiredBy, o as LocaleProperties, t as Commo
 import { i as FileMimeType, r as FileError } from "../../types-D-ZRl1jP.mjs";
 
 //#region src/machines/file-upload/file-upload.anatomy.d.ts
-declare const anatomy: AnatomyInstance<"root" | "label" | "item" | "trigger" | "clearTrigger" | "itemGroup" | "itemPreview" | "itemDeleteTrigger" | "dropzone" | "itemName" | "itemPreviewImage" | "itemSizeText">;
+declare const anatomy: AnatomyInstance<"root" | "label" | "trigger" | "item" | "clearTrigger" | "itemDeleteTrigger" | "itemPreview" | "itemGroup" | "dropzone" | "itemName" | "itemSizeText" | "itemPreviewImage">;
 //#endregion
 //#region src/machines/file-upload/file-upload.types.d.ts
 interface FileRejection {